/*
Theme Name: GFS Roster
Theme URI: https://www.ghettofilm.org/gfs-roster
Author: Ghetto Film School
Author URI: https://www.ghettofilm.org
Description: Full-Site Editing block theme for the GFS ROSTER alumni portal. Design tokens come from theme.json (palette, type scale, layout). Type stack: Anton (display) + Poppins (headings) + Source Sans 3 (body, substitute for Acumin Pro), all loaded from Google Fonts via wp_enqueue_style.
Version: 1.0.1
Requires at least: 6.4
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gfs-roster
Tags: full-site-editing, block-themes, custom-colors, custom-fonts
*/

/* ==========================================================================
   GLOBAL — Dark theme background with warm amber radial glows
   The site is cinematic-dark; this paints the page foundation.
   ========================================================================== */

body {
	background-color: #000;
	color: var(--wp--preset--color--base);
}

/* Amber glow overlay. The glows used to live on the body background, so any
   section with an opaque background (hero photo, etc.) cut them off at its
   edge. As a fixed overlay they paint ABOVE section backgrounds instead:
   - position:fixed replaces the old background-attachment:fixed anchoring;
   - pointer-events:none keeps everything underneath clickable;
   - mix-blend-mode:screen only ever brightens, so white text stays white and
     photos just pick up the warm light;
   - z-index 2 sits above unpositioned content but below dropdowns, modals
     and the admin bar (all 1000+). */
body::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background-image:
		radial-gradient(ellipse 70% 50% at 8% 25%, rgba(102, 63, 24, 0.55), transparent 60%),
		radial-gradient(ellipse 70% 50% at 92% 75%, rgba(102, 63, 24, 0.45), transparent 60%);
	background-repeat: no-repeat;
	mix-blend-mode: screen;
}

/* ==========================================================================
   GLOBAL BLOCK SPACING
   ========================================================================== */

.wp-block-buttons {
	margin-top: 1.5rem;
}

/* ==========================================================================
   NAVIGATION
   ========================================================================== */

.wp-block-navigation__container {
	gap: 1.5rem !important;
}

.wp-block-navigation .wp-block-navigation__container {
	gap: 1.5rem !important;
}

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

.wp-block-group.alignfull .wp-block-navigation__container {
	gap: 1.5rem !important;
}

footer .wp-block-navigation__container {
	gap: 1rem !important;
}

/* ==========================================================================
   BRACKET FRAME — signature L-corner treatment on cards, footer, callouts
   Apply with class="gfs-bracket-frame" on any block-level container.
   ========================================================================== */

.gfs-bracket-frame {
	position: relative;
	padding: clamp(1.5rem, 3vw, 2.5rem);
}

.gfs-bracket-frame::before,
.gfs-bracket-frame::after {
	content: "";
	position: absolute;
	width: 28px;
	height: 28px;
	border-color: var(--wp--preset--color--base);
	border-style: solid;
	border-width: 0;
}

.gfs-bracket-frame::before {
	top: 0;
	left: 0;
	border-top-width: 1px;
	border-left-width: 1px;
}

.gfs-bracket-frame::after {
	bottom: 0;
	right: 0;
	border-bottom-width: 1px;
	border-right-width: 1px;
}

/* ==========================================================================
   PAGE HERO — gfs/page-hero block
   ========================================================================== */

.gfs-page-hero {
	text-align: center;
	padding: clamp(2rem, 6vw, 4rem) 0;
}

.gfs-page-hero__title {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2.5rem, 6vw, 4.5rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--base);
	margin: 0 0 1.5rem;
}

.gfs-page-hero__intro {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--base);
	max-width: 60ch;
	margin: 0 auto;
	line-height: 1.5;
}

.gfs-page-hero__intro > p {
	margin: 0 0 1rem;
}

.gfs-page-hero__intro > p:last-child {
	margin-bottom: 0;
}

.gfs-page-hero__intro a {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
}

.gfs-page-hero__rule {
	border: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	margin: 2rem auto;
	max-width: 1200px;
}

/* ==========================================================================
   OPPORTUNITY FILTER — gfs/opportunity-filter block
   ========================================================================== */

.gfs-opportunity-filter {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	padding: 1rem 0;
	margin: 0 0 2rem;
}

.gfs-opportunity-filter__label {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--base);
	font-weight: 500;
}

.gfs-opportunity-filter__select {
	background: transparent;
	color: var(--wp--preset--color--base);
	border: 1px solid rgba(255, 255, 255, 0.4);
	padding: 0.5rem 2.5rem 0.5rem 1rem;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	cursor: pointer;
	appearance: none;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='1.5' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.9rem center;
}

.gfs-opportunity-filter__select option {
	background: #000;
	color: var(--wp--preset--color--base);
}

.gfs-opportunity-filter__select:focus {
	outline: 1px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

/* ==========================================================================
   OPPORTUNITY LIST — gfs/opportunity-list block
   ========================================================================== */

.gfs-opportunity-list {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.gfs-opportunity-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	background: linear-gradient(135deg, rgba(0, 0, 0, 0.7), rgba(51, 74, 90, 0.15));
	border: 1px solid rgba(255, 255, 255, 0.18);
}

.gfs-opportunity-card__content {
	flex: 1;
	min-width: 0;
}

.gfs-opportunity-card__title {
	color: var(--wp--preset--color--accent);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 600;
	line-height: 1.2;
	margin: 0 0 0.5rem;
}

.gfs-opportunity-card__title a {
	color: inherit;
	text-decoration: none;
}

.gfs-opportunity-card__title a:hover {
	text-decoration: underline;
}

.gfs-opportunity-card__company {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--large);
	margin: 0;
}

.gfs-opportunity-card__location {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--medium);
	margin: 0.25rem 0 0;
}

.gfs-opportunity-card__action {
	flex-shrink: 0;
}

.gfs-opportunity-empty {
	text-align: center;
	color: var(--wp--preset--color--muted);
	padding: 3rem 1rem;
}

.gfs-opportunity-list__pagination,
.gfs-class-list__pagination {
	margin: 3rem 0 0;
	padding: 1.5rem 0;
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.gfs-opportunity-list__pagination .page-numbers,
.gfs-class-list__pagination .page-numbers {
	color: var(--wp--preset--color--base);
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.2);
	padding: 0 0.9rem;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1;
	text-decoration: none;
	min-width: 40px;
	min-height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.gfs-opportunity-list__pagination a.page-numbers:hover,
.gfs-class-list__pagination a.page-numbers:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.gfs-opportunity-list__pagination .page-numbers.current,
.gfs-class-list__pagination .page-numbers.current {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--primary);
}

.gfs-opportunity-list__pagination .page-numbers.dots,
.gfs-class-list__pagination .page-numbers.dots {
	border-color: transparent;
}

.gfs-opportunity-list__pagination .page-numbers.disabled,
.gfs-class-list__pagination .page-numbers.disabled {
	color: rgba(255, 255, 255, 0.3);
	border-color: rgba(255, 255, 255, 0.1);
	cursor: not-allowed;
}

/* ==========================================================================
   CLASS / RESOURCE GRID — [gfs_classes] on /classes/ and [gfs_resources]
   on /resources/ (Phase 2) share these card styles
   ========================================================================== */

.gfs-class-grid,
.gfs-resource-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.75rem;
	margin: 0;
}

@media (max-width: 960px) {
	.gfs-class-grid,
	.gfs-resource-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.gfs-class-grid,
	.gfs-resource-grid {
		grid-template-columns: 1fr;
	}
}

.gfs-class-card,
.gfs-resource-card {
	display: flex;
	flex-direction: column;
	background: linear-gradient(160deg, rgba(0, 0, 0, 0.85), rgba(51, 74, 90, 0.15));
	border: 1px solid rgba(255, 255, 255, 0.18);
}

.gfs-class-card__tag,
.gfs-resource-card__tag {
	display: inline-block;
	align-self: flex-start;
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin: 0 0 0.75rem;
}

.gfs-class-card__title,
.gfs-resource-card__title {
	color: var(--wp--preset--color--accent);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 600;
	line-height: 1.25;
	margin: 0 0 0.75rem;
}

.gfs-class-card__title a,
.gfs-resource-card__title a {
	color: inherit;
	text-decoration: none;
}

.gfs-class-card__title a:hover,
.gfs-resource-card__title a:hover {
	text-decoration: underline;
}

.gfs-class-card__instructor {
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	font-style: italic;
	opacity: 0.85;
	margin: -0.35rem 0 0.75rem;
}

.gfs-class-card__excerpt,
.gfs-resource-card__excerpt {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.5;
	margin: 0 0 1rem;
}

.gfs-class-card__meta,
.gfs-resource-card__meta {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--medium);
	margin: 0 0 1rem;
}

.gfs-class-card__action,
.gfs-resource-card__action {
	margin-top: 0.25rem;
}

/* ==========================================================================
   SINGLE CLASS / RESOURCE DETAIL — used by the [gfs_class_detail]
   and [gfs_resource_detail] shortcodes
   ========================================================================== */

.gfs-class-detail {
	max-width: 1200px;
	margin: 0 auto;
}

.gfs-class-detail__back {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	text-decoration: none;
	letter-spacing: 0.04em;
	margin: 0 0 2.5rem;
	transition: color 0.15s ease;
}

.gfs-class-detail__back:hover {
	color: var(--wp--preset--color--base);
}

.gfs-class-detail__header {
	margin: 0 0 3rem;
}

.gfs-class-detail__tag {
	display: inline-block;
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	margin: 0 0 1rem;
}

.gfs-class-detail__title {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2.5rem, 6vw, 4.5rem);
	font-weight: 400;
	line-height: 1.05;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--base);
	margin: 0 0 1.5rem;
}

.gfs-class-detail__excerpt {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.5;
	color: var(--wp--preset--color--base);
	max-width: 70ch;
	margin: 0 0 2rem;
}

.gfs-class-detail__header .gfs-page-hero__rule {
	margin: 0;
}

.gfs-class-detail__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 3rem;
	align-items: start;
}

@media (max-width: 900px) {
	.gfs-class-detail__body {
		grid-template-columns: 1fr;
		gap: 2rem;
	}
}

/* No Class Details panel -> the description spans the full width instead of
   leaving a 340px empty gutter where the sidebar column would have been. */
.gfs-class-detail__body--no-sidebar {
	grid-template-columns: minmax(0, 1fr);
}

.gfs-class-detail__content {
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.7;
}

.gfs-class-detail__content > *:first-child {
	margin-top: 0;
}

.gfs-class-detail__content > *:last-child {
	margin-bottom: 0;
}

.gfs-class-detail__content h2,
.gfs-class-detail__content h3,
.gfs-class-detail__content h4 {
	font-family: var(--wp--preset--font-family--heading);
	color: var(--wp--preset--color--base);
	margin: 2.5rem 0 1rem;
}

.gfs-class-detail__content a {
	color: var(--wp--preset--color--accent);
}

.gfs-class-detail__sidebar {
	background: linear-gradient(160deg, rgba(0, 0, 0, 0.85), rgba(51, 74, 90, 0.18));
	border: 1px solid rgba(255, 255, 255, 0.18);
	position: sticky;
	top: 2rem;
}

@media (max-width: 900px) {
	.gfs-class-detail__sidebar {
		position: static;
	}
}

.gfs-class-detail__sidebar-title {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	margin: 0 0 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.gfs-class-detail__meta {
	margin: 0 0 2rem;
}

.gfs-class-detail__meta-row {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 0.75rem 0;
	border-bottom: 1px dashed rgba(255, 255, 255, 0.08);
}

.gfs-class-detail__meta-row:last-child {
	border-bottom: 0;
}

.gfs-class-detail__meta-row dt {
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
	margin: 0;
}

.gfs-class-detail__meta-row dd {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--base);
	margin: 0;
}

.gfs-class-detail__cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	width: 100%;
	box-sizing: border-box;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--primary);
	padding: 1rem 1.5rem;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.gfs-class-detail__cta:hover,
.gfs-class-detail__cta:focus {
	background: var(--wp--preset--color--warm-dark);
	border-color: var(--wp--preset--color--warm-dark);
	color: var(--wp--preset--color--base);
}

.gfs-class-detail__cta-arrow {
	transition: transform 0.15s ease;
}

.gfs-class-detail__cta:hover .gfs-class-detail__cta-arrow {
	transform: translateX(4px);
}

@media (max-width: 600px) {
	.gfs-opportunity-card {
		flex-direction: column;
		align-items: flex-start;
		gap: 1.25rem;
	}
}

/* ==========================================================================
   BUTTONS — outline-white variant for Apply Now and other secondary CTAs on dark
   Registered as block style "is-style-outline-white" via register_block_style().
   ========================================================================== */

.wp-block-button.is-style-outline-white > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--base);
	padding: 0.75rem 1.75rem;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	transition: background 0.15s ease, color 0.15s ease;
}

.wp-block-button.is-style-outline-white > .wp-block-button__link:hover,
.wp-block-button.is-style-outline-white > .wp-block-button__link:focus {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
}

/* Plain anchor variant used inside opportunity cards (Apply Now) */
.gfs-button-outline-white {
	display: inline-block;
	background: transparent;
	color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--base);
	padding: 0.75rem 1.75rem;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.gfs-button-outline-white:hover,
.gfs-button-outline-white:focus {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

/* Outline-amber variant — header Donate button */
.wp-block-button.is-style-outline-amber > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--primary);
	border: 1px solid var(--wp--preset--color--primary);
	border-radius: 0;
	padding: 0.75rem 1.75rem;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	transition: background 0.15s ease, color 0.15s ease;
}

.wp-block-button.is-style-outline-amber > .wp-block-button__link:hover,
.wp-block-button.is-style-outline-amber > .wp-block-button__link:focus {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

/* ==========================================================================
   WORDMARK — stacked "GHETTO FILM SCHOOL / ROSTER" used in header + footer
   ========================================================================== */

.gfs-wordmark {
	display: inline-flex;
	flex-direction: column;
	text-decoration: none;
	color: var(--wp--preset--color--base);
	line-height: 1;
}

.gfs-wordmark:hover,
.gfs-wordmark:focus {
	color: var(--wp--preset--color--base);
	text-decoration: none;
}

.gfs-wordmark__top {
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

.gfs-wordmark__bottom {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.875rem;
	font-weight: 400;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	margin-top: 0.2rem;
}

/* ==========================================================================
   HEADER — layout overrides on the dark transparent header bar
   ========================================================================== */

.gfs-header {
	position: relative;
	z-index: 5;
	/* Declared explicitly (not only via WordPress' generated flex-layout CSS)
	   so the logo-left / nav-right distribution survives when the header part is
	   rendered outside the normal template pipeline — the get_header() shim
	   (header.php) used by The Events Calendar, and the access gate. */
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.gfs-header .wp-block-navigation,
.gfs-header .wp-block-navigation a {
	color: var(--wp--preset--color--base) !important;
}

.gfs-header .wp-block-navigation__container {
	gap: 2.5rem !important;
}

.gfs-header .wp-block-navigation .wp-block-navigation-item__label {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 500;
}

.gfs-header .wp-block-navigation .wp-block-navigation-submenu__toggle {
	color: var(--wp--preset--color--base);
}

/* Top-level item turns amber when hovered / its submenu is open (XD design). */
.gfs-header .wp-block-navigation > .wp-block-navigation__container > .wp-block-navigation-item:hover > a,
.gfs-header .wp-block-navigation > .wp-block-navigation__container > .wp-block-navigation-item:focus-within > a,
.gfs-header .wp-block-navigation > .wp-block-navigation__container > .wp-block-navigation-item:hover > .wp-block-navigation-submenu__toggle,
.gfs-header .wp-block-navigation > .wp-block-navigation__container > .wp-block-navigation-item:focus-within > .wp-block-navigation-submenu__toggle {
	color: var(--wp--preset--color--primary) !important;
}

/* Submenu dropdown — solid black flyout, borderless, left-aligned (XD design).
   Styled explicitly in the theme so it renders the same on every env,
   independent of the navigation block's overlay-color attribute. */
.gfs-header .wp-block-navigation .wp-block-navigation__submenu-container {
	/* !important so it beats WordPress core's default white submenu background,
	   which otherwise wins on pages where the header renders outside the normal
	   template pipeline (the TEC/get_header() shim and the access gate), where
	   the block's own overlay-color CSS isn't printed. */
	background-color: var(--wp--preset--color--dark) !important;
	border: 0;
	padding: 0.5rem 0;
	min-width: 12rem;
}

.gfs-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 500;
	padding: 0.5rem 1.5rem;
}

.gfs-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.gfs-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus {
	color: var(--wp--preset--color--primary) !important;
}

/* Mobile overlay (hamburger) — dark full-screen menu, not the default white.
   Styled explicitly so it doesn't depend on the block's overlay-color attribute. */
.gfs-header .wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--wp--preset--color--dark) !important;
	padding: 2rem;
}

.gfs-header .wp-block-navigation__responsive-container.is-menu-open,
.gfs-header .wp-block-navigation__responsive-container.is-menu-open a,
.gfs-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label,
.gfs-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	color: var(--wp--preset--color--base) !important;
}

/* Submenus inside the mobile overlay: flat, no dropdown box */
.gfs-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	background-color: transparent;
	padding: 0;
}

.gfs-header .wp-block-navigation__responsive-container.is-menu-open a:hover,
.gfs-header .wp-block-navigation__responsive-container.is-menu-open a:focus {
	color: var(--wp--preset--color--primary) !important;
}

/* Login / Register — drawn as the amber outline button, matching the Donate
   CTA it replaces in the header. The pair is ONE pill: the wrapper owns the
   border and the hover fill, and the links inherit its colour so "Login", "/"
   and "Register" never highlight independently. */
.gfs-header-link {
	color: inherit;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

/* Wrap auth links as ONE flex child so the parent's 2rem blockGap
   doesn't apply between "My Account / Logout" */
.gfs-header-auth {
	display: inline-flex;
	align-items: stretch;
	gap: 0;
	white-space: nowrap;
	border: 1px solid var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

/* The pill holds TWO destinations (Login|Register, My Account|Logout), so the
   padding lives on the links, not on the wrapper: every pixel inside the
   border belongs to one of them and there is no dead zone that looks
   clickable but isn't. The separator is the only inert part, and it is
   aria-hidden. */
.gfs-header-auth .gfs-header-link {
	display: inline-flex;
	align-items: center;
	padding: 0.75rem 1rem;
	transition: background 0.15s ease, color 0.15s ease;
}

.gfs-header-auth .gfs-header-link:first-child {
	padding-left: 1.5rem;
}

.gfs-header-auth .gfs-header-link:last-child {
	padding-right: 1.5rem;
}

/* "/" divider — no horizontal padding, so it doesn't widen the gap between
   the two hit areas. */
.gfs-header-auth > span.gfs-header-link {
	padding-left: 0;
	padding-right: 0;
	opacity: 0.55;
}

/* Only the hovered half fills, so it's clear which destination you'll get. */
.gfs-header-auth > a.gfs-header-link:hover,
.gfs-header-auth > a.gfs-header-link:focus {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}

/* Cache-safe nav state: the header renders BOTH menus and the same
   .gfs-logged-in class picks one. The state must NOT be decided in PHP --
   Pantheon's CDN caches the whole page, so a server-side is_user_logged_in()
   branch would freeze one menu into the cached HTML and serve it to everyone.
   Default (no JS / anonymous) shows the logged-out menu. */
/* Qualified with .wp-block-navigation on purpose: core ships
   `.wp-block-navigation.is-layout-flex { display: flex }`, which outranks a
   single-class selector and leaves both menus on screen at once. */
.wp-block-navigation.gfs-nav--in {
	display: none;
}

.gfs-logged-in .wp-block-navigation.gfs-nav--in {
	display: flex;
}

.gfs-logged-in .wp-block-navigation.gfs-nav--out {
	display: none;
}

/* Cache-safe auth state: the pattern renders BOTH pairs of links and an
   inline script adds .gfs-logged-in to <html> when the gfs_li cookie is set
   (see inc/login-state.php). Default (no JS / anonymous) shows Login/Register. */
.gfs-header-auth--in {
	display: none;
}

.gfs-logged-in .gfs-header-auth--in {
	display: inline-flex;
}

.gfs-logged-in .gfs-header-auth--out {
	display: none;
}

/* ==========================================================================
   ACCESS GATE — restricted-archive screen (GFS Access).
   Copy comes from Ultimate Member's editable Restricted Access Message; this
   frames it in the cinematic brand style. <body> carries .gfs-access-gate.
   ========================================================================== */

.gfs-access-gate__main {
	display: flex;
	align-items: center;
	justify-content: center;
}

.gfs-access-gate__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1.75rem;
	min-height: 60vh;
	max-width: 640px;
	margin-inline: auto;
	padding: 5rem 1.5rem;
	text-align: center;
}

.gfs-access-gate__lock {
	display: block;
	margin: 0 auto -0.5rem;
	color: var(--wp--preset--color--primary);
}

.gfs-access-gate__inner h1,
.gfs-access-gate__inner h2 {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 400;
	font-size: clamp(2.75rem, 7vw, 4.5rem);
	line-height: 1.02;
	letter-spacing: 0.015em;
	color: var(--wp--preset--color--base);
}

/* Amber accent rule under the heading (echoes the directory gate). */
.gfs-access-gate__inner h1::after,
.gfs-access-gate__inner h2::after {
	content: "";
	display: block;
	width: 72px;
	height: 3px;
	margin: 1.5rem auto 0;
	background: var(--wp--preset--color--primary);
}

.gfs-access-gate__inner p {
	margin: 0;
	max-width: 48ch;
	color: rgba(255, 255, 255, 0.72);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.65;
}

/*
 * Self-sufficient on purpose. This markup is Ultimate Member's editable
 * Restricted Access Message, injected as raw HTML rather than parsed as
 * blocks, so WordPress never registers core/buttons as "used" on this page
 * and its stylesheet (which supplies `display:flex` here and
 * `display:inline-block` on the link) is not enqueued. It only appeared to
 * work where some *other* block on the page happened to pull those styles in
 * -- the header's Donate button. On an environment whose header has no button
 * block, the link fell back to `display:inline`, its vertical padding
 * overflowed the line box, and the two buttons overlapped. Declaring the
 * layout here keeps the gate correct no matter what else is on the page.
 */
.gfs-access-gate__inner .wp-block-buttons {
	display: flex;
	margin-top: 0.75rem;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
}

.gfs-access-gate__inner .wp-block-button {
	display: block;
	margin: 0;
}

/* Buttons match the directory gate: flat, rectangular, solid-amber primary +
   subtle-outline secondary (overrides the theme's default pill button style). */
.gfs-access-gate__inner .wp-block-button__link {
	display: inline-block;
	text-decoration: none;
	box-sizing: border-box;
	border-radius: 0;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	letter-spacing: 0.06em;
	transition: background 0.3s ease, transform 0.15s ease, box-shadow 0.3s ease;
}

.gfs-access-gate__inner .wp-block-button:not(.is-style-outline-amber) .wp-block-button__link {
	padding: 1rem 3rem;
	border: 0;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

.gfs-access-gate__inner .wp-block-button:not(.is-style-outline-amber) .wp-block-button__link:hover {
	background: var(--wp--preset--color--warm-dark);
	color: var(--wp--preset--color--base);
	transform: translateY(-2px);
	box-shadow: 0 8px 30px rgba(181, 113, 42, 0.4);
}

.gfs-access-gate__inner .is-style-outline-amber .wp-block-button__link {
	padding: 0.75rem 2rem;
	font-size: 0.875rem;
	background: transparent;
	color: rgba(255, 255, 255, 0.5);
	border: 1px solid rgba(255, 255, 255, 0.12);
}

.gfs-access-gate__inner .is-style-outline-amber .wp-block-button__link:hover {
	background: transparent;
	color: #fff;
	border-color: rgba(255, 255, 255, 0.3);
	transform: translateY(-1px);
}

/* ==========================================================================
   FOOTER — bracket-framed footer with amber separator + contact icons
   ========================================================================== */

.gfs-footer {
	margin: 4rem auto 2rem;
	max-width: 1200px;
	border: 1px solid rgba(255, 255, 255, 0.18);
}

/* Top row: wordmark left, social icons right (icons render only when their
   URL is set in Settings → Social Links) */
.gfs-footer__top {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 1.5rem;
	flex-wrap: wrap;
}

/* Right end of the top row: social icons + the Donate/CTA button */
.gfs-footer__top-end {
	display: flex;
	align-items: center;
	gap: 2rem;
	flex-wrap: wrap;
}

.gfs-footer-social {
	display: flex;
	align-items: center;
	gap: 1.25rem;
}

/* Donate/CTA button — same amber outline treatment as the header auth button */
.gfs-footer__cta {
	display: inline-block;
	padding: 0.75rem 1.75rem;
	border: 1px solid var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.15s ease, color 0.15s ease;
}

.gfs-footer__cta:hover,
.gfs-footer__cta:focus {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}

.gfs-footer-social__link {
	display: block;
	line-height: 0;
}

.gfs-footer-social__link svg {
	width: 26px;
	height: 26px;
	display: block;
	transition: opacity 0.15s ease;
}

.gfs-footer-social__link:hover svg,
.gfs-footer-social__link:focus svg {
	opacity: 0.7;
}

.gfs-footer__rule {
	border: 0;
	border-top: 1px solid var(--wp--preset--color--primary);
	margin: 1.5rem 0 2rem;
	width: 100%;
}

.gfs-footer__columns {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 2rem;
	align-items: start;
}

@media (max-width: 900px) {
	.gfs-footer__columns {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 600px) {
	.gfs-footer__columns {
		grid-template-columns: 1fr;
	}
}

.gfs-footer__col-heading {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 700;
	color: var(--wp--preset--color--base);
	margin: 0 0 1.25rem;
}

.gfs-footer__contact {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}

.gfs-footer__contact li {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.4;
}

.gfs-footer__contact svg {
	flex-shrink: 0;
	margin-top: 0.15rem;
	color: var(--wp--preset--color--accent);
	width: 16px;
	height: 16px;
}

.gfs-footer__contact a {
	color: inherit;
	text-decoration: none;
}

.gfs-footer__contact a:hover {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}

.gfs-footer__nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.gfs-footer__nav a {
	color: var(--wp--preset--color--base);
	text-decoration: none;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
}

.gfs-footer__nav a:hover {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}

/* ==========================================================================
   BRACKET FRAME — 4-corner variant (hero, big containers)
   Adds two more pseudo-element corners; rendered alongside the existing 2.
   ========================================================================== */

.gfs-bracket-frame--all {
	position: relative;
	padding: clamp(1.5rem, 3vw, 2.5rem);
}

.gfs-bracket-frame--all .gfs-corner-tr,
.gfs-bracket-frame--all .gfs-corner-bl {
	position: absolute;
	width: 28px;
	height: 28px;
	border-color: var(--wp--preset--color--base);
	border-style: solid;
	border-width: 0;
	pointer-events: none;
}

.gfs-bracket-frame--all .gfs-corner-tr {
	top: 0;
	right: 0;
	border-top-width: 1px;
	border-right-width: 1px;
}

.gfs-bracket-frame--all .gfs-corner-bl {
	bottom: 0;
	left: 0;
	border-bottom-width: 1px;
	border-left-width: 1px;
}

/* ==========================================================================
   HOMEPAGE — HERO
   ========================================================================== */

.gfs-hero {
	position: relative;
	min-height: 720px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(4rem, 10vw, 8rem) clamp(1.5rem, 4vw, 4rem);
	background-color: #1a0f08;
	background-image:
		radial-gradient(ellipse 80% 60% at 50% 50%, rgba(0,0,0,0.4), transparent 70%),
		linear-gradient(135deg, rgba(102, 63, 24, 0.5), rgba(0, 0, 0, 0.9)),
		repeating-linear-gradient(45deg, rgba(255,255,255,0.02) 0 2px, transparent 2px 8px);
	overflow: hidden;
}

/* Optional photo background (gfs/home-hero ACF background_image field).
   The block outputs the photo as an inline background-image, which replaces
   the gradient stack above; this modifier adds cover sizing and a dark
   ::before overlay so the text stays legible over the photo (XD design).
   The overlay paints below .gfs-hero__inner — both are positioned, and the
   pseudo-element comes first in paint order. */
.gfs-hero--has-image {
	background-size: cover;
	background-position: center;
}

.gfs-hero--has-image::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 75% 65% at 50% 40%, rgba(0, 0, 0, 0.5), transparent 75%),
		linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.35) 45%, rgba(0, 0, 0, 0.85) 85%, #000 100%);
}

.gfs-hero__inner {
	max-width: 900px;
	width: 100%;
	text-align: center;
	position: relative;
	padding: clamp(3rem, 6vw, 5rem) clamp(2rem, 4vw, 4rem);
}

.gfs-hero__wordmark {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(4rem, 13vw, 10rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--base);
	margin: 0 0 1.5rem;
	text-shadow: 0 2px 30px rgba(0, 0, 0, 0.6);
}

/* Anton 400 + 0.02em is the shared recipe for every headline in the system
   (.gfs-section__heading, .gfs-benefit-card__title, .gfs-page-hero__title).
   The weight MUST stay 400: Anton ships a single weight, so 600 made the
   browser synthesise a fake bold and smeared the strokes. */
.gfs-hero__tagline {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.75rem, 3.4vw, 2.5rem);
	font-weight: 400;
	letter-spacing: 0.02em;
	line-height: 1.2;
	color: var(--wp--preset--color--base);
	margin: 0 auto 1.5rem;
	max-width: 30ch;
}

.gfs-hero__intro {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--base);
	max-width: 56ch;
	margin: 0 auto;
	line-height: 1.5;
}

/* ==========================================================================
   HOMEPAGE — SECTION HEADING (centered, with intro)
   Used by "Fellows & Alumni Benefits", "What our Alumni say", "Ready to Join"
   ========================================================================== */

.gfs-section {
	padding: clamp(3rem, 6vw, 5rem) clamp(1.5rem, 4vw, 3rem);
	text-align: center;
}

.gfs-section__rule {
	border: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	width: 100%;
	max-width: 1480px;
	margin: 0 auto;
}

/* No `text-transform` on purpose: the heading is typed in the block, so the
   editor decides the case. Forcing uppercase here would override whatever the
   client writes in wp-admin. Same rule for every other editor-authored title
   in this file. */
.gfs-section__heading {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 400;
	color: var(--wp--preset--color--base);
	letter-spacing: 0.02em;
	margin: 0 0 1.5rem;
}

.gfs-section__heading--amber {
	color: var(--wp--preset--color--primary);
}

.gfs-section__intro {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--base);
	max-width: 60ch;
	margin: 0 auto;
	line-height: 1.5;
}

/* ==========================================================================
   HOMEPAGE — BENEFITS GRID (4 bracket-framed cards)
   ========================================================================== */

.gfs-benefit-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	max-width: 1480px;
	margin: 3rem auto 0;
}

@media (max-width: 900px) {
	.gfs-benefit-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px) {
	.gfs-benefit-grid {
		grid-template-columns: 1fr;
	}
}

.gfs-benefit-card {
	display: flex;
	flex-direction: column;
	min-height: 260px;
	text-align: center;
	background: linear-gradient(160deg, rgba(0,0,0,0.85), rgba(51, 74, 90, 0.15));
	border: 1px solid rgba(255, 255, 255, 0.18);
}

.gfs-benefit-card__title {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 400;
	color: var(--wp--preset--color--base);
	letter-spacing: 0.02em;
	margin: 0 0 1.25rem;
}

.gfs-benefit-card__body {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.5;
	margin: 0;
}

/* ==========================================================================
   HOMEPAGE — STATS GRID (2 rows x 3 cols, icon + number + label)
   ========================================================================== */

.gfs-stats-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(2rem, 4vw, 3.5rem) 2rem;
	max-width: 1100px;
	margin: 2rem auto 0;
	padding: 0 1.5rem;
}

@media (max-width: 700px) {
	.gfs-stats-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 480px) {
	.gfs-stats-grid {
		grid-template-columns: 1fr;
	}
}

.gfs-stat {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.gfs-stat__icon {
	/* color only affects the legacy stroked icons; the XD stat icons carry
	   their own gradient fills */
	color: var(--wp--preset--color--accent);
	width: 80px;
	height: 80px;
	margin: 0 auto 1rem;
}

.gfs-stat__icon svg {
	width: 100%;
	height: 100%;
}

.gfs-stat__number {
	font-family: var(--wp--preset--font-family--display);
	font-size: 2.25rem;
	font-weight: 400;
	color: var(--wp--preset--color--base);
	line-height: 1;
	margin: 0 0 0.5rem;
	letter-spacing: 0.02em;
}

.gfs-stat__label {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--base);
	margin: 0;
}

/* ==========================================================================
   HOMEPAGE — MENTOR SECTION (2-column: text left, image right)
   ========================================================================== */

.gfs-mentor {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(2rem, 5vw, 5rem);
	align-items: center;
	max-width: 1200px;
	margin: 0 auto;
	padding: clamp(3rem, 6vw, 5rem) clamp(1.5rem, 4vw, 3rem);
}

@media (max-width: 800px) {
	.gfs-mentor {
		grid-template-columns: 1fr;
	}
}

.gfs-mentor__heading {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 400;
	color: var(--wp--preset--color--base);
	letter-spacing: 0.02em;
	margin: 0 0 1.25rem;
}

.gfs-mentor__body {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.5;
	margin: 0 0 2rem;
}

.gfs-mentor__cta {
	display: inline-block;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	padding: 0.85rem 2.5rem;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease;
}

.gfs-mentor__cta:hover,
.gfs-mentor__cta:focus {
	background: var(--wp--preset--color--warm-dark);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}

.gfs-mentor__image {
	aspect-ratio: 16 / 10;
	background: linear-gradient(135deg, #4a3a2e, #2a1f17);
	background-size: cover;
	background-position: center;
}

/* No photo set → the image column isn't rendered at all; the text takes the
   full row instead of leaving an empty grid cell. */
.gfs-mentor--text-only {
	grid-template-columns: 1fr;
}

/* ==========================================================================
   HOMEPAGE — TESTIMONIAL SLIDER (bracket-frame quote card + JS carousel)
   Markup: .gfs-testimonial-wrap > arrows + .gfs-testimonial-slider >
           .gfs-testimonial-slider__viewport > .gfs-testimonial-slider__track >
           .gfs-testimonial (one per slide, each is the bracket-framed card)
   ========================================================================== */

.gfs-testimonial-wrap {
	position: relative;
	max-width: 1100px;
	margin: 2rem auto 0;
	padding: 0 clamp(2.5rem, 6vw, 5rem);
}

.gfs-testimonial-slider {
	max-width: 700px;
	margin: 0 auto;
}

.gfs-testimonial-slider__viewport {
	overflow: hidden;
}

.gfs-testimonial-slider__track {
	display: flex;
	transition: transform 500ms ease;
	will-change: transform;
}

.gfs-testimonial-slider__slide {
	flex: 0 0 100%;
	min-width: 0;
}

.gfs-testimonial {
	margin: 0;
	text-align: center;
	background: linear-gradient(135deg, rgba(0,0,0,0.6), rgba(102, 63, 24, 0.18));
	padding: clamp(2rem, 4vw, 3rem) clamp(2rem, 5vw, 4rem);
	border: 1px solid rgba(255, 255, 255, 0.18);
}

.gfs-testimonial__quote {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--base);
	line-height: 1.5;
	margin: 0 0 1.5rem;
	font-style: normal;
}

.gfs-testimonial__quote::before { content: "\201C"; }
.gfs-testimonial__quote::after { content: "\201D"; }

.gfs-testimonial__attribution {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--base);
	font-weight: 700;
	margin: 0;
}

.gfs-testimonial__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: transparent;
	border: 0;
	color: var(--wp--preset--color--accent);
	cursor: pointer;
	padding: 0.5rem;
	font-size: 1.5rem;
	line-height: 1;
	z-index: 2;
}

.gfs-testimonial__arrow--prev { left: 0; }
.gfs-testimonial__arrow--next { right: 0; }

.gfs-testimonial__arrow:hover {
	color: var(--wp--preset--color--primary);
}

.gfs-testimonial__arrow[disabled],
.gfs-testimonial__arrow[hidden] {
	opacity: 0;
	pointer-events: none;
}

.gfs-testimonial__dots {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin: 1.25rem 0 0;
	padding: 0;
	list-style: none;
}

.gfs-testimonial__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	border: 0;
	padding: 0;
	cursor: pointer;
}

.gfs-testimonial__dot[aria-current="true"] {
	background: var(--wp--preset--color--accent);
}

/* ==========================================================================
   HOMEPAGE — READY TO JOIN CTA
   ========================================================================== */

.gfs-cta {
	text-align: center;
	padding: clamp(3rem, 6vw, 5rem) clamp(1.5rem, 4vw, 3rem) clamp(4rem, 8vw, 6rem);
	max-width: 800px;
	margin: 0 auto;
}

.gfs-cta__heading {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 400;
	color: var(--wp--preset--color--primary);
	letter-spacing: 0.02em;
	margin: 0 0 1.5rem;
}

.gfs-cta__body {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.5;
	margin: 0 auto 2rem;
	max-width: 56ch;
}

.gfs-cta__button {
	display: inline-block;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	padding: 0.9rem 3rem;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--large);
	text-decoration: none;
	transition: background 0.15s ease;
}

.gfs-cta__button:hover,
.gfs-cta__button:focus {
	background: var(--wp--preset--color--warm-dark);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}

/* ==========================================================================
   THE EVENTS CALENDAR — overrides to match the XD events landing page
   We don't replace the plugin's markup; we restyle their classes.
   Specificity boosted via .tribe-events-page-template body class.
   ========================================================================== */

/* Force-reset Tribe's white container chrome */
.tribe-events-page-template .tribe-events,
.tribe-events-page-template .tribe-common {
	background: transparent !important;
	color: var(--wp--preset--color--base) !important;
}

.tribe-events-page-template .tribe-events-l-container {
	background: transparent !important;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 clamp(1rem, 4vw, 2rem);
}

/* Hide Tribe's default page title — our page-hero supplies it */
.tribe-events-page-template .tribe-events-header__title,
.tribe-events-page-template .tribe-events-c-messages,
.tribe-events-page-template .tribe-events-header__messages--mobile {
	display: none !important;
}

/* --- Events page hero (injected via tribe_events_before_html) --- */
.gfs-events-hero {
	text-align: center;
	padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 2rem) clamp(1.5rem, 3vw, 2.5rem);
	max-width: 1100px;
	margin: 0 auto;
}

/* --- Search + view-selector bar --- */
.tribe-events-page-template .tribe-events-c-events-bar {
	background: transparent !important;
	border: 1px solid rgba(255, 255, 255, 0.2) !important;
	box-shadow: none !important;
	padding: 0.5rem 0.75rem !important;
	margin-bottom: 2rem !important;
	display: flex;
	align-items: stretch;
	gap: 1rem;
}

/* Search input field — give icon room on the left and position it inside */
.tribe-events-page-template .tribe-events-c-search__input-group,
.tribe-events-page-template .tribe-events-c-search__input-control,
.tribe-events-page-template .tribe-common-form-control-text {
	position: relative !important;
	flex: 1 !important;
	background: transparent !important;
	border: 0 !important;
}

.tribe-events-page-template .tribe-events-c-events-bar input[type="text"],
.tribe-events-page-template .tribe-events-c-search__input {
	background: transparent !important;
	color: var(--wp--preset--color--base) !important;
	border: 0 !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	padding: 0.75rem 0.75rem 0.75rem 2.5rem !important;
	width: 100% !important;
}

.tribe-events-page-template .tribe-events-c-events-bar input[type="text"]::placeholder {
	color: var(--wp--preset--color--muted) !important;
}

/* Position the search icon inside the input, vertically centered on the left */
.tribe-events-page-template .tribe-events-c-search__input-control-icon-svg {
	position: absolute !important;
	left: 0.75rem !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	color: var(--wp--preset--color--accent) !important;
	width: 16px !important;
	height: 16px !important;
	pointer-events: none;
}

.tribe-events-page-template .tribe-events-c-events-bar__search-button-icon-svg,
.tribe-events-page-template .tribe-common-c-svgicon--search {
	color: var(--wp--preset--color--accent) !important;
}

/* Find Events submit button — amber filled */
.tribe-events-page-template .tribe-events-c-search__button,
.tribe-events-page-template .tribe-common-c-btn,
.tribe-events-page-template button[type="submit"].tribe-events-c-search__button {
	background: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--base) !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-weight: 600 !important;
	padding: 0.75rem 1.75rem !important;
	margin-right: 0.5rem !important;
}

.tribe-events-page-template .tribe-events-c-search__button:hover,
.tribe-events-page-template .tribe-common-c-btn:hover {
	background: var(--wp--preset--color--warm-dark) !important;
}

/* View selector (List / Month / Day) */
.tribe-events-page-template .tribe-events-c-view-selector__button,
.tribe-events-page-template .tribe-events-c-view-selector__list-item-link {
	background: transparent !important;
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0.75rem 1.25rem !important;
	position: relative;
}

/* Override Tribe's default dark border-bottom on the tabs (the active li
   gets its own amber border below). */
.tribe-events-page-template .tribe-events-c-view-selector__list-item,
.tribe-events-page-template .tribe-events-c-view-selector__list-item-link {
	border-bottom: 0 !important;
	box-shadow: none !important;
}

.tribe-events-page-template .tribe-events-c-view-selector__list-item--active .tribe-events-c-view-selector__list-item-link,
.tribe-events-page-template .tribe-events-c-view-selector__button[aria-current="true"] {
	color: var(--wp--preset--color--primary) !important;
	border-bottom: 0 !important;
}

/* Active tab — amber border on the li itself, spanning the full tab width. */
.tribe-events-page-template .tribe-events-c-view-selector__list-item--active .tribe-events-c-view-selector__list-item-link::after,
.tribe-events-page-template .tribe-events-c-view-selector__button[aria-current="true"]::after {
	content: none !important;
}

/* Doubled class + body-class variants outrank the border reset above,
   which also matches the active li. */
.tribe-events-page-template .tribe-events-c-view-selector__list-item--active,
.tribe-events-c-view-selector__list-item--active.tribe-events-c-view-selector__list-item--active {
	border-bottom: 2px solid var(--wp--preset--color--primary) !important;
}

/* Top bar — Today button + prev/next */
.tribe-events-page-template .tribe-events-c-top-bar {
	background: transparent !important;
	border: 0 !important;
	padding: 1.5rem 0 !important;
	margin: 0 !important;
	gap: 1rem;
}

.tribe-events-page-template .tribe-events-c-top-bar__today-button {
	background: transparent !important;
	color: var(--wp--preset--color--base) !important;
	border: 1px solid var(--wp--preset--color--base) !important;
	border-radius: 0 !important;
	padding: 0.65rem 1.75rem !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-weight: 600 !important;
}

.tribe-events-page-template .tribe-events-c-top-bar__today-button:hover {
	background: var(--wp--preset--color--base) !important;
	color: var(--wp--preset--color--contrast) !important;
}

.tribe-events-page-template .tribe-events-c-top-bar__nav-link,
.tribe-events-page-template .tribe-events-c-nav__prev,
.tribe-events-page-template .tribe-events-c-nav__next {
	background: transparent !important;
	color: var(--wp--preset--color--primary) !important;
	border: 0 !important;
	padding: 0.5rem !important;
}

.tribe-events-page-template .tribe-events-c-top-bar__nav-link-icon-svg,
.tribe-events-page-template .tribe-common-c-svgicon--caret-left,
.tribe-events-page-template .tribe-common-c-svgicon--caret-right {
	color: var(--wp--preset--color--primary) !important;
	width: 16px !important;
	height: 16px !important;
}

/* Tribe paints SVG paths with an explicit grey/dark fill via the
   .tribe-common-c-svgicon__svg-fill class. Override fill directly so chevrons
   (top-bar prev/next, datepicker caret, bottom pagination Previous/Next Events)
   and the AJAX view-switch loader dots render in our amber primary. */
.tribe-events-page-template .tribe-events-c-top-bar svg .tribe-common-c-svgicon__svg-fill,
.tribe-events-page-template .tribe-events-c-top-bar__nav-link svg path,
.tribe-events-page-template .tribe-events-c-top-bar__datepicker-button svg path,
.tribe-events-page-template .tribe-events-c-nav__prev svg path,
.tribe-events-page-template .tribe-events-c-nav__next svg path,
.tribe-events-page-template .tribe-common-c-svgicon--caret-left .tribe-common-c-svgicon__svg-fill,
.tribe-events-page-template .tribe-common-c-svgicon--caret-right .tribe-common-c-svgicon__svg-fill,
.tribe-events-page-template .tribe-common-c-svgicon--caret-down .tribe-common-c-svgicon__svg-fill,
.tribe-events-page-template .tribe-common-c-loader__dot circle,
.tribe-events-page-template .tribe-common-c-svgicon--dot circle {
	fill: var(--wp--preset--color--primary) !important;
}

/* Datepicker / "Upcoming" dropdown trigger */
.tribe-events-page-template .tribe-events-c-top-bar__datepicker-button {
	background: transparent !important;
	color: var(--wp--preset--color--base) !important;
	border: 0 !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--large) !important;
	font-weight: 600 !important;
	padding: 0.5rem 0.75rem !important;
}

/* --- Month-separator pill ("April 2026") --- */
.tribe-events-page-template .tribe-events-calendar-list__month-separator {
	background: transparent !important;
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--large) !important;
	font-weight: 700 !important;
	padding: 1.5rem 0 1rem !important;
	border: 0 !important;
	text-align: left !important;
}

.tribe-events-page-template .tribe-events-calendar-list__month-separator-text {
	background: transparent !important;
	color: var(--wp--preset--color--base) !important;
	padding: 0 !important;
}

/* --- Event card — bracket frame wraps the entire row (date column + event details) --- */
.tribe-events-page-template .tribe-events-calendar-list__event-row {
	background: linear-gradient(135deg, rgba(0,0,0,0.7), rgba(51, 74, 90, 0.15)) !important;
	border: 1px solid rgba(255, 255, 255, 0.18) !important;
	padding: clamp(1.25rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2.5rem) !important;
	margin: 0 0 1.5rem !important;
	list-style: none !important;
	display: flex !important;
	align-items: flex-start !important;
	gap: clamp(1.5rem, 3vw, 2.5rem) !important;
	position: relative !important;
}

/* Inner article is just a layout wrapper — no visible chrome */
.tribe-events-page-template .tribe-events-calendar-list__event,
.tribe-events-page-template .tribe-events-calendar-list__event-wrapper {
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	flex: 1 !important;
	min-width: 0 !important;
}

/* Bracket corners on the row — wraps date column AND event details */
.tribe-events-page-template .tribe-events-calendar-list__event-row::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 28px;
	height: 28px;
	border-top: 1px solid var(--wp--preset--color--base);
	border-left: 1px solid var(--wp--preset--color--base);
}

.tribe-events-page-template .tribe-events-calendar-list__event-row::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: 28px;
	height: 28px;
	border-bottom: 1px solid var(--wp--preset--color--base);
	border-right: 1px solid var(--wp--preset--color--base);
}

/* Date tag column (TUE / 21) */
.tribe-events-page-template .tribe-events-calendar-list__event-date-tag {
	flex: 0 0 auto !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	min-width: 80px !important;
	padding: 0 !important;
	border: 0 !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-date-tag-weekday {
	color: var(--wp--preset--color--primary) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	font-weight: 600 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	margin: 0 0 0.5rem !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-date-tag-datetime,
.tribe-events-page-template .tribe-events-calendar-list__event-date-tag-daynum {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: 2.25rem !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	margin: 0 !important;
}

/* Event details column */
.tribe-events-page-template .tribe-events-calendar-list__event-details {
	flex: 1 !important;
	min-width: 0 !important;
	padding: 0 !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-header {
	margin: 0 !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-datetime,
.tribe-events-page-template .tribe-events-calendar-list__event-datetime-wrapper {
	color: var(--wp--preset--color--primary) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	font-weight: 600 !important;
	margin: 0 0 0.5rem !important;
	background: transparent !important;
	padding: 0 !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-title {
	margin: 0 0 0.75rem !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-title-link {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--heading) !important;
	font-size: var(--wp--preset--font-size--xx-large) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-title-link:hover {
	color: var(--wp--preset--color--accent) !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-venue,
.tribe-events-page-template .tribe-events-calendar-list__event-venue-title,
.tribe-events-page-template .tribe-events-calendar-list__event-venue-address {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	font-style: normal !important;
	font-weight: 600 !important;
	margin: 0 0 0.5rem !important;
	padding: 0 !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-description,
.tribe-events-page-template .tribe-events-calendar-list__event-description p {
	color: var(--wp--preset--color--muted) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	line-height: 1.5 !important;
	margin: 0 !important;
	display: block !important;
}

.tribe-events-page-template .tribe-events-calendar-list__event-description.tribe-common-a11y-hidden {
	display: block !important;
	position: static !important;
	clip: auto !important;
	width: auto !important;
	height: auto !important;
}

/* Hide Tribe's "Latest Past Events" header if only past events exist */
.tribe-events-page-template .tribe-events-calendar-latest-past__heading {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--heading) !important;
	font-size: var(--wp--preset--font-size--x-large) !important;
	font-weight: 600 !important;
}

/* Reuse the same card styling for past events */
.tribe-events-page-template .tribe-events-calendar-latest-past__event {
	background: linear-gradient(135deg, rgba(0,0,0,0.6), rgba(51, 74, 90, 0.1)) !important;
	padding: clamp(1.25rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2.5rem) !important;
	margin: 0 0 1.5rem !important;
	position: relative !important;
	opacity: 0.7;
}

.tribe-events-page-template .tribe-events-calendar-latest-past__event::before,
.tribe-events-page-template .tribe-events-calendar-latest-past__event::after {
	content: "";
	position: absolute;
	width: 28px;
	height: 28px;
}

.tribe-events-page-template .tribe-events-calendar-latest-past__event::before {
	top: 0; left: 0;
	border-top: 1px solid var(--wp--preset--color--base);
	border-left: 1px solid var(--wp--preset--color--base);
}

.tribe-events-page-template .tribe-events-calendar-latest-past__event::after {
	bottom: 0; right: 0;
	border-bottom: 1px solid var(--wp--preset--color--base);
	border-right: 1px solid var(--wp--preset--color--base);
}

.tribe-events-page-template .tribe-events-calendar-latest-past__event-datetime {
	color: var(--wp--preset--color--primary) !important;
	font-weight: 600 !important;
}

.tribe-events-page-template .tribe-events-calendar-latest-past__event-title-link {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--heading) !important;
	font-size: var(--wp--preset--font-size--xx-large) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

/* --- Bottom nav ("Previous Events" / "Next Events") --- */
.tribe-events-page-template .tribe-events-c-nav,
.tribe-events-page-template .tribe-events-calendar-list__pagination {
	background: transparent !important;
	border: 0 !important;
	padding: 2rem 0 !important;
	display: flex !important;
	justify-content: space-between !important;
}

.tribe-events-page-template .tribe-events-c-nav__list,
.tribe-events-page-template .tribe-events-c-nav__list-item {
	background: transparent !important;
	display: flex !important;
	align-items: center !important;
}

.tribe-events-page-template .tribe-events-c-nav__prev,
.tribe-events-page-template .tribe-events-c-nav__next {
	color: var(--wp--preset--color--base) !important;
	background: transparent !important;
	border: 0 !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--large) !important;
	font-weight: 500 !important;
	padding: 0.5rem 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 0.5rem !important;
}

.tribe-events-page-template .tribe-events-c-nav__prev:hover,
.tribe-events-page-template .tribe-events-c-nav__next:hover {
	color: var(--wp--preset--color--primary) !important;
}

/* --- Subscribe to calendar dropdown — outline-white to match "Today" --- */
.tribe-events-page-template .tribe-events-c-subscribe-dropdown__button {
	background: transparent !important;
	color: var(--wp--preset--color--base) !important;
	border: 1px solid var(--wp--preset--color--base) !important;
	border-radius: 0 !important;
	padding: 0.65rem 1.5rem !important;
}

.tribe-events-page-template .tribe-events-c-subscribe-dropdown__button:hover {
	background: var(--wp--preset--color--base) !important;
	color: var(--wp--preset--color--contrast) !important;
}

.tribe-events-page-template .tribe-events-c-subscribe-dropdown__button-text {
	color: inherit !important;
	background: transparent !important;
	border: 0 !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-weight: 600 !important;
}

/* Caret in amber to match the rest of the page */
.tribe-events-page-template .tribe-events-c-subscribe-dropdown__button-icon svg .tribe-common-c-svgicon__svg-fill,
.tribe-events-page-template .tribe-events-c-subscribe-dropdown__button-icon path {
	fill: var(--wp--preset--color--primary) !important;
}

.tribe-events-page-template .tribe-events-c-subscribe-dropdown__button:hover .tribe-events-c-subscribe-dropdown__button-icon svg .tribe-common-c-svgicon__svg-fill,
.tribe-events-page-template .tribe-events-c-subscribe-dropdown__button:hover .tribe-events-c-subscribe-dropdown__button-icon path {
	fill: var(--wp--preset--color--contrast) !important;
}

/* Dropdown panel + list links — readable on dark theme */
.tribe-events-page-template .tribe-events-c-subscribe-dropdown__content,
.tribe-events-page-template .tribe-events-c-subscribe-dropdown__list {
	background: var(--wp--preset--color--contrast) !important;
	border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.tribe-events-page-template .tribe-events-c-subscribe-dropdown__list-item {
	background: transparent !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.tribe-events-page-template .tribe-events-c-subscribe-dropdown__list-item:last-child {
	border-bottom: 0 !important;
}

.tribe-events-page-template .tribe-events-c-subscribe-dropdown__list-item-link {
	color: var(--wp--preset--color--base) !important;
	background: transparent !important;
	font-family: var(--wp--preset--font-family--body) !important;
	padding: 0.75rem 1rem !important;
	display: block !important;
}

.tribe-events-page-template .tribe-events-c-subscribe-dropdown__list-item-link:hover,
.tribe-events-page-template .tribe-events-c-subscribe-dropdown__list-item:hover {
	color: var(--wp--preset--color--primary) !important;
	background: rgba(255, 255, 255, 0.05) !important;
}

/* --- Month view (calendar grid) — restyle for dark theme readability --- */

/* Weekday headers (M T W T F S S) */
.tribe-events-page-template .tribe-events-calendar-month__header-column-title {
	color: var(--wp--preset--color--primary) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-weight: 600 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	opacity: 1 !important;
}

/* Calendar grid cell + borders */
.tribe-events-page-template .tribe-events-calendar-month__day,
.tribe-events-page-template .tribe-events-calendar-month__day-cell {
	background: transparent !important;
	border-color: rgba(255, 255, 255, 0.15) !important;
}

.tribe-events-page-template .tribe-events-calendar-month__table {
	border-color: rgba(255, 255, 255, 0.15) !important;
}

/* Day number in each cell — Tribe colors the inner <time> daynum directly,
   so we must override on that element too (not just the wrapper). */
.tribe-events-page-template .tribe-events-calendar-month__day-date,
.tribe-events-page-template .tribe-events-calendar-month__day-date-link,
.tribe-events-page-template .tribe-events-calendar-month__day-date-daynum {
	color: var(--wp--preset--color--base) !important;
	opacity: 1 !important;
	text-decoration: none !important;
}

.tribe-events-page-template .tribe-events-calendar-month__day-date-link:hover,
.tribe-events-page-template .tribe-events-calendar-month__day-date-link:hover .tribe-events-calendar-month__day-date-daynum {
	color: var(--wp--preset--color--primary) !important;
}

/* Days from previous/next month + past days — muted */
.tribe-events-page-template .tribe-events-calendar-month__day--other-month .tribe-events-calendar-month__day-date,
.tribe-events-page-template .tribe-events-calendar-month__day--other-month .tribe-events-calendar-month__day-date-daynum,
.tribe-events-page-template .tribe-events-calendar-month__day--past .tribe-events-calendar-month__day-date,
.tribe-events-page-template .tribe-events-calendar-month__day--past .tribe-events-calendar-month__day-date-daynum {
	color: var(--wp--preset--color--muted) !important;
	opacity: 0.6 !important;
}

/* Today highlight — amber number */
.tribe-events-page-template .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date,
.tribe-events-page-template .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-link,
.tribe-events-page-template .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-daynum {
	color: var(--wp--preset--color--primary) !important;
	font-weight: 700 !important;
	opacity: 1 !important;
}

/* Event chip inside a cell */
.tribe-events-page-template .tribe-events-calendar-month__calendar-event {
	background: transparent !important;
	padding: 0.25rem 0 !important;
}

.tribe-events-page-template .tribe-events-calendar-month__calendar-event-datetime {
	color: var(--wp--preset--color--primary) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-weight: 600 !important;
	font-size: 0.75rem !important;
}

.tribe-events-page-template .tribe-events-calendar-month__calendar-event-title,
.tribe-events-page-template .tribe-events-calendar-month__calendar-event-title-link {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	line-height: 1.3 !important;
}

.tribe-events-page-template .tribe-events-calendar-month__calendar-event-title-link:hover {
	color: var(--wp--preset--color--primary) !important;
}

/* Multi-day spanning event bar */
.tribe-events-page-template .tribe-events-calendar-month__multiday-event-bar,
.tribe-events-page-template .tribe-events-calendar-month__multiday-event-bar-inner {
	background: var(--wp--preset--color--secondary) !important;
	color: var(--wp--preset--color--base) !important;
	border-color: var(--wp--preset--color--primary) !important;
}

.tribe-events-page-template .tribe-events-calendar-month__multiday-event-bar-title {
	color: var(--wp--preset--color--base) !important;
	font-weight: 600 !important;
}

/* "+N more" overflow link */
.tribe-events-page-template .tribe-events-calendar-month__more-events-link {
	color: var(--wp--preset--color--primary) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

.tribe-events-page-template .tribe-events-calendar-month__more-events-link:hover {
	text-decoration: underline !important;
}

/* Day-popup (clicking a day to see its events) */
.tribe-events-page-template .tribe-events-calendar-month__day-cell--mobile.tribe-events-calendar-month__day-cell--selected,
.tribe-events-page-template .tribe-events-calendar-month__day--current {
	background: rgba(181, 113, 42, 0.08) !important;
}

/* --- Day view — same bracket-card visual language as List view --- */

/* Time separator heading ("7:00 pm") */
.tribe-events-page-template .tribe-events-calendar-day__time-separator {
	background: transparent !important;
	border: 0 !important;
	padding: 1.5rem 0 0.75rem !important;
	margin: 0 !important;
}

.tribe-events-page-template .tribe-events-calendar-day__time-separator-heading {
	color: var(--wp--preset--color--primary) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--large) !important;
	font-weight: 600 !important;
	letter-spacing: 0.05em !important;
	text-transform: uppercase !important;
	margin: 0 !important;
	background: transparent !important;
}

.tribe-events-page-template .tribe-events-calendar-day__time-separator-heading time {
	color: inherit !important;
}

/* Event card — same bracket frame + dark gradient as List view */
.tribe-events-page-template .tribe-events-calendar-day__event {
	background: linear-gradient(135deg, rgba(0,0,0,0.7), rgba(51, 74, 90, 0.15)) !important;
	border: 1px solid rgba(255, 255, 255, 0.18) !important;
	padding: clamp(1.25rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2.5rem) !important;
	margin: 0 0 1.5rem !important;
	position: relative !important;
}

.tribe-events-page-template .tribe-events-calendar-day__event::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 28px;
	height: 28px;
	border-top: 1px solid var(--wp--preset--color--base);
	border-left: 1px solid var(--wp--preset--color--base);
}

.tribe-events-page-template .tribe-events-calendar-day__event::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: 28px;
	height: 28px;
	border-bottom: 1px solid var(--wp--preset--color--base);
	border-right: 1px solid var(--wp--preset--color--base);
}

.tribe-events-page-template .tribe-events-calendar-day__event-content,
.tribe-events-page-template .tribe-events-calendar-day__event-details,
.tribe-events-page-template .tribe-events-calendar-day__event-header {
	background: transparent !important;
	padding: 0 !important;
	border: 0 !important;
}

/* Datetime row — amber, semibold (matches list view) */
.tribe-events-page-template .tribe-events-calendar-day__event-datetime,
.tribe-events-page-template .tribe-events-calendar-day__event-datetime-wrapper,
.tribe-events-page-template .tribe-events-calendar-day__event-datetime-wrapper time {
	color: var(--wp--preset--color--primary) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	font-weight: 600 !important;
	background: transparent !important;
	margin: 0 0 0.5rem !important;
}

/* Title — white, big, heading font */
.tribe-events-page-template .tribe-events-calendar-day__event-title {
	margin: 0 0 0.75rem !important;
}

.tribe-events-page-template .tribe-events-calendar-day__event-title,
.tribe-events-page-template .tribe-events-calendar-day__event-title-link {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--heading) !important;
	font-size: var(--wp--preset--font-size--xx-large) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	line-height: 1.2 !important;
}

.tribe-events-page-template .tribe-events-calendar-day__event-title-link:hover {
	color: var(--wp--preset--color--accent) !important;
}

/* Venue line */
.tribe-events-page-template .tribe-events-calendar-day__event-venue,
.tribe-events-page-template .tribe-events-calendar-day__event-venue-title,
.tribe-events-page-template .tribe-events-calendar-day__event-venue-address {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	font-weight: 600 !important;
	font-style: normal !important;
	margin: 0 0 0.5rem !important;
}

/* Description — muted */
.tribe-events-page-template .tribe-events-calendar-day__event-description,
.tribe-events-page-template .tribe-events-calendar-day__event-description p {
	color: var(--wp--preset--color--muted) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	line-height: 1.5 !important;
	margin: 0 !important;
	background: transparent !important;
}

/* Cost badge / featured ribbon if shown */
.tribe-events-page-template .tribe-events-calendar-day__event-cost {
	color: var(--wp--preset--color--primary) !important;
	font-weight: 600 !important;
	background: transparent !important;
}

/* Event hover tooltip (powered by tooltipster — rendered as a body child,
   so styles must apply globally, not under .tribe-events-page-template) */
.tooltipster-base.tribe-events-tooltip-theme {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tooltipster-box {
	background: var(--wp--preset--color--contrast) !important;
	border: 1px solid var(--wp--preset--color--primary) !important;
	border-radius: 0 !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tooltipster-content {
	padding: 1rem 1.25rem !important;
	max-width: 320px !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tribe-events-calendar-month__calendar-event-tooltip-title {
	margin: 0.25rem 0 0.5rem !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tribe-events-calendar-month__calendar-event-tooltip-description {
	margin: 0 !important;
	line-height: 1.5 !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tooltipster-content,
.tooltipster-base.tribe-events-tooltip-theme .tribe-events-calendar-month__calendar-event-tooltip,
.tooltipster-base.tribe-events-tooltip-theme .tribe-events-calendar-month__calendar-event-tooltip-description,
.tooltipster-base.tribe-events-tooltip-theme .tribe-events-calendar-month__calendar-event-tooltip-description p {
	color: var(--wp--preset--color--base) !important;
	background: transparent !important;
	font-family: var(--wp--preset--font-family--body) !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tribe-events-calendar-month__calendar-event-tooltip-datetime {
	color: var(--wp--preset--color--primary) !important;
	font-weight: 600 !important;
	font-family: var(--wp--preset--font-family--body) !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tribe-events-calendar-month__calendar-event-tooltip-title,
.tooltipster-base.tribe-events-tooltip-theme .tribe-events-calendar-month__calendar-event-tooltip-title-link {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--heading) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

.tooltipster-base.tribe-events-tooltip-theme .tribe-events-calendar-month__calendar-event-tooltip-title-link:hover {
	color: var(--wp--preset--color--primary) !important;
}

/* Tooltipster arrow — match the amber border */
.tooltipster-base.tribe-events-tooltip-theme .tooltipster-arrow-background {
	border-color: transparent !important;
}

.tooltipster-base.tribe-events-tooltip-theme.tooltipster-top .tooltipster-arrow-border {
	border-top-color: var(--wp--preset--color--primary) !important;
}
.tooltipster-base.tribe-events-tooltip-theme.tooltipster-bottom .tooltipster-arrow-border {
	border-bottom-color: var(--wp--preset--color--primary) !important;
}
.tooltipster-base.tribe-events-tooltip-theme.tooltipster-left .tooltipster-arrow-border {
	border-left-color: var(--wp--preset--color--primary) !important;
}
.tooltipster-base.tribe-events-tooltip-theme.tooltipster-right .tooltipster-arrow-border {
	border-right-color: var(--wp--preset--color--primary) !important;
}

/* ==========================================================================
   SINGLE EVENT — same visual language as list cards
   ========================================================================== */

.gfs-single-event {
	max-width: 1100px;
	margin: 0 auto;
	padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 4vw, 2rem);
}

.gfs-single-event__meta {
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	margin: 0 0 0.75rem;
}

.gfs-single-event__title {
	font-family: var(--wp--preset--font-family--heading);
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 600;
	color: var(--wp--preset--color--base);
	margin: 0 0 2rem;
	line-height: 1.15;
}

/* Two-column layout: description + RSVP left, detail panels right */
.gfs-single-event__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: clamp(2rem, 4vw, 3.5rem);
	align-items: start;
}

@media (max-width: 900px) {
	.gfs-single-event__layout {
		grid-template-columns: 1fr;
	}
}

.gfs-single-event__content {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.6;
}

.gfs-single-event__content p {
	margin: 0 0 1rem;
}

.gfs-single-event__content h2,
.gfs-single-event__content h3 {
	font-family: var(--wp--preset--font-family--heading);
	color: var(--wp--preset--color--base);
	margin: 1.5rem 0 0.5rem;
}

/* Sidebar: stacked faint-surface panels */
.gfs-single-event__sidebar {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.gfs-single-event__panel {
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.08);
	padding: 1.75rem 1.5rem;
}

.gfs-single-event__panel--when {
	background: linear-gradient(135deg, rgba(0, 0, 0, 0.7), rgba(51, 74, 90, 0.15));
	text-align: center;
}

.gfs-single-event__panel-heading {
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 0 0 1rem;
}

.gfs-single-event__schedule {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--medium);
	margin: 1rem 0 0;
}

.gfs-single-event__cost {
	color: var(--wp--preset--color--base);
	margin: 1rem 0 0;
}

.gfs-single-event__panel-label {
	display: block;
	color: var(--wp--preset--color--primary);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 0 0 0.25rem;
}

.gfs-single-event__panel-strong {
	color: var(--wp--preset--color--base);
	font-weight: 600;
	margin: 0 0 0.25rem;
}

.gfs-single-event__panel-muted {
	color: var(--wp--preset--color--muted);
	line-height: 1.5;
	margin: 0 0 0.25rem;
}

.gfs-single-event__panel-muted a {
	color: var(--wp--preset--color--muted);
	text-decoration: none;
}

.gfs-single-event__panel-link {
	margin: 0.5rem 0 0;
}

.gfs-single-event__panel-link a {
	color: var(--wp--preset--color--primary);
	font-weight: 600;
	text-decoration: none;
}

.gfs-single-event__panel-link a:hover,
.gfs-single-event__panel-muted a:hover {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
}

.gfs-single-event__organizer + .gfs-single-event__organizer {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.gfs-single-event__date {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.gfs-single-event__date-weekday {
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 0 0 0.5rem;
}

.gfs-single-event__date-day {
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--body);
	font-size: 3.5rem;
	font-weight: 400;
	line-height: 1;
	margin: 0 0 0.25rem;
}

.gfs-single-event__date-month {
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 0;
}

/* Featured image — full container width above the two-column layout */
.gfs-single-event__featured {
	margin: 0 0 2.5rem;
}

.gfs-single-event__featured img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 480px;
	object-fit: cover;
}

/* Region / Event Type tag pills */
.gfs-single-event__tags {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0 0 1.5rem;
	padding: 0;
}

.gfs-single-event__tag {
	display: inline-block;
	padding: 0.35rem 0.85rem;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border: 1px solid var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
	background: transparent;
}

.gfs-single-event__tag--type {
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--accent);
}

.gfs-single-event__cta {
	margin: 1.5rem 0 0;
}

.gfs-single-event__back {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	text-decoration: none;
	margin: 0 0 2rem;
}

.gfs-single-event__back:hover {
	color: var(--wp--preset--color--warm-dark);
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   Event Tickets RSVP widget — dark skin
   ET ships a white card (.tribe-tickets__rsvp inside .event-tickets). These
   overrides re-surface it on the theme's dark palette; !important is needed
   because ET's tribe-common stylesheet loads after the theme's.
   -------------------------------------------------------------------------- */

.gfs-single-event .tribe-tickets__rsvp-wrapper {
	margin: 2.5rem 0 0;
	background: transparent !important;
}

/* Solid black base under the translucent gradient — ET paints the wrapper
   and card white, and a see-through gradient over white reads light gray. */
.gfs-single-event .event-tickets .tribe-tickets__rsvp {
	background: linear-gradient(135deg, rgba(0, 0, 0, 0.7), rgba(51, 74, 90, 0.15)) #000 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: var(--wp--preset--color--base) !important;
}

/* Layout: ET sizes its breakpoints from the widget's own width, so inside
   our content column it falls back to the stacked/centered mobile layout
   with awkward gaps. Impose a clean two-column card instead: counts on the
   left, action block on the right behind a faint separator. */
.gfs-single-event .event-tickets .tribe-tickets__rsvp {
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap;
	gap: 2rem;
	padding: 2rem !important;
}

.gfs-single-event .event-tickets .tribe-tickets__rsvp-details-wrapper,
.gfs-single-event .event-tickets .tribe-tickets__rsvp-actions-wrapper {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.gfs-single-event .event-tickets .tribe-tickets__rsvp-details-wrapper {
	flex: 1 1 240px;
}

.gfs-single-event .event-tickets .tribe-tickets__rsvp-actions-wrapper {
	flex: 1 1 220px;
	border-left: 1px solid rgba(255, 255, 255, 0.12) !important;
	padding-left: 2rem !important;
}

@media (max-width: 560px) {
	.gfs-single-event .event-tickets .tribe-tickets__rsvp-actions-wrapper {
		border-left: 0 !important;
		border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
		padding-left: 0 !important;
		padding-top: 1.5rem !important;
	}
}

.gfs-single-event .event-tickets .tribe-tickets__rsvp-actions,
.gfs-single-event .event-tickets .tribe-tickets__rsvp-actions-rsvp {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	display: flex !important;
	flex-direction: column;
	align-items: center;
	gap: 0.85rem;
	width: 100% !important;
}

.gfs-single-event .event-tickets .tribe-tickets__rsvp-actions-rsvp-going {
	display: flex !important;
	justify-content: center;
	margin: 0 !important;
	width: 100% !important;
}

.gfs-single-event .event-tickets .tribe-tickets__rsvp-actions-button-going {
	min-width: 170px;
}

.gfs-single-event .event-tickets .tribe-tickets__rsvp-availability {
	margin-top: 0.5rem !important;
}

.gfs-single-event .event-tickets .tribe-tickets__rsvp-availability-quantity {
	color: var(--wp--preset--color--accent) !important;
	font-weight: 600;
}

/* All of tribe-common's dark-ink typography goes white */
.gfs-single-event .event-tickets .tribe-common-h1,
.gfs-single-event .event-tickets .tribe-common-h2,
.gfs-single-event .event-tickets .tribe-common-h3,
.gfs-single-event .event-tickets .tribe-common-h4,
.gfs-single-event .event-tickets .tribe-common-h5,
.gfs-single-event .event-tickets .tribe-common-h6,
.gfs-single-event .event-tickets .tribe-common-h7,
.gfs-single-event .event-tickets .tribe-common-h8,
.gfs-single-event .event-tickets .tribe-common-b1,
.gfs-single-event .event-tickets .tribe-common-b2,
.gfs-single-event .event-tickets .tribe-common-b3 {
	color: var(--wp--preset--color--base) !important;
}

/* Secondary/quantity text reads muted */
.gfs-single-event .event-tickets .tribe-tickets__rsvp-availability,
.gfs-single-event .event-tickets .tribe-tickets__rsvp-attendance-going,
.gfs-single-event .event-tickets .tribe-tickets__rsvp-description {
	color: var(--wp--preset--color--muted) !important;
}

/* Attendance count number */
.gfs-single-event .event-tickets .tribe-tickets__rsvp-attendance-number {
	color: var(--wp--preset--color--base) !important;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600 !important;
}

/* Buttons: amber solid, square corners (theme button language) */
.gfs-single-event .event-tickets .tribe-common-c-btn,
.gfs-single-event .event-tickets a.tribe-common-c-btn,
.gfs-single-event .event-tickets button.tribe-common-c-btn {
	background-color: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--base) !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-weight: 600 !important;
}

.gfs-single-event .event-tickets .tribe-common-c-btn:hover,
.gfs-single-event .event-tickets a.tribe-common-c-btn:hover,
.gfs-single-event .event-tickets button.tribe-common-c-btn:hover,
.gfs-single-event .event-tickets .tribe-common-c-btn:focus,
.gfs-single-event .event-tickets button.tribe-common-c-btn:focus {
	background-color: var(--wp--preset--color--warm-dark) !important;
	color: var(--wp--preset--color--base) !important;
}

/* Text-style buttons/links (Cancel, "Can't go", etc.) */
.gfs-single-event .event-tickets .tribe-common-cta,
.gfs-single-event .event-tickets a.tribe-common-cta,
.gfs-single-event .event-tickets button.tribe-common-cta {
	color: var(--wp--preset--color--primary) !important;
	border-color: var(--wp--preset--color--primary) !important;
}

/* RSVP form inputs (name / email / quantity) — match theme form skin */
.gfs-single-event .event-tickets input[type="text"],
.gfs-single-event .event-tickets input[type="email"],
.gfs-single-event .event-tickets input[type="tel"],
.gfs-single-event .event-tickets input[type="number"],
.gfs-single-event .event-tickets textarea {
	background: rgba(0, 0, 0, 0.5) !important;
	color: var(--wp--preset--color--base) !important;
	border: 1px solid rgba(255, 255, 255, 0.25) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.gfs-single-event .event-tickets input:focus,
.gfs-single-event .event-tickets textarea:focus {
	border-color: var(--wp--preset--color--primary) !important;
	box-shadow: 0 0 0 1px var(--wp--preset--color--primary) !important;
	outline: 0 !important;
}

.gfs-single-event .event-tickets label,
.gfs-single-event .event-tickets .tribe-common-form-control-text__label,
.gfs-single-event .event-tickets .tribe-tickets__form-field-label {
	color: var(--wp--preset--color--muted) !important;
}

/* Success state + misc links */
.gfs-single-event .event-tickets .tribe-tickets__rsvp-message,
.gfs-single-event .event-tickets .tribe-tickets__rsvp-message--success {
	color: var(--wp--preset--color--base) !important;
	background: rgba(102, 148, 179, 0.12) !important;
}

.gfs-single-event .event-tickets .tribe-tickets__rsvp-message--success svg path {
	fill: var(--wp--preset--color--accent);
}

/* ==========================================================================
   WPFORMS — match the dark theme + amber CTA
   Overrides apply to all wpforms-container instances site-wide. Specificity
   boosted with the .wpforms-render-modern body class WPForms adds.
   ========================================================================== */

.wpforms-container {
	font-family: var(--wp--preset--font-family--body) !important;
	/* Reading-width form, centered in its container. */
	max-width: 720px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* WPForms caps each field by its builder size class (small 25% / medium 60%
   / large 100%), which leaves one form with mixed widths — uniform 100%. */
.wpforms-container .wpforms-field-small,
.wpforms-container .wpforms-field-medium,
.wpforms-container .wpforms-field-large,
.wpforms-container input.wpforms-field-small,
.wpforms-container input.wpforms-field-medium,
.wpforms-container input.wpforms-field-large,
.wpforms-container textarea.wpforms-field-small,
.wpforms-container textarea.wpforms-field-medium,
.wpforms-container textarea.wpforms-field-large,
.wpforms-container select.wpforms-field-small,
.wpforms-container select.wpforms-field-medium,
.wpforms-container select.wpforms-field-large {
	max-width: 100% !important;
}

.wpforms-container form {
	background: transparent !important;
}

/* Field wrapper spacing */
.wpforms-container .wpforms-field {
	padding: 0 0 1.25rem !important;
	margin: 0 !important;
}

/* Labels */
.wpforms-container .wpforms-field-label,
.wpforms-container .wpforms-field-sublabel,
.wpforms-container label {
	color: var(--wp--preset--color--muted) !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--small) !important;
	font-weight: 600 !important;
	letter-spacing: 0.05em !important;
	margin: 0 0 0.5rem !important;
	display: block !important;
}

.wpforms-container .wpforms-required-label {
	color: var(--wp--preset--color--primary) !important;
	margin-left: 0.25rem;
}

/* Input fields */
.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container input[type="url"],
.wpforms-container input[type="tel"],
.wpforms-container input[type="number"],
.wpforms-container input[type="password"],
.wpforms-container input[type="date"],
.wpforms-container input[type="search"],
.wpforms-container textarea,
.wpforms-container select {
	background: rgba(0, 0, 0, 0.5) !important;
	color: var(--wp--preset--color--base) !important;
	border: 1px solid rgba(255, 255, 255, 0.25) !important;
	border-radius: 0 !important;
	padding: 0.85rem 1rem !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	line-height: 1.4 !important;
	width: 100% !important;
	height: auto !important;
	box-shadow: none !important;
	appearance: none !important;
	-webkit-appearance: none !important;
	transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

.wpforms-container textarea {
	min-height: 160px !important;
	resize: vertical !important;
}

.wpforms-container select option {
	background: #000 !important;
	color: var(--wp--preset--color--base) !important;
}

.wpforms-container input::placeholder,
.wpforms-container textarea::placeholder {
	color: var(--wp--preset--color--muted) !important;
	opacity: 0.5 !important;
}

.wpforms-container input:focus,
.wpforms-container textarea:focus,
.wpforms-container select:focus {
	border-color: var(--wp--preset--color--primary) !important;
	box-shadow: 0 0 0 1px var(--wp--preset--color--primary) !important;
	outline: 0 !important;
}

/* Modern render — WPForms uses CSS vars internally, override them */
.wpforms-render-modern {
	--wpforms-field-border-color: rgba(255, 255, 255, 0.25);
	--wpforms-field-border-color-focus: var(--wp--preset--color--primary);
	--wpforms-field-background-color: rgba(0, 0, 0, 0.5);
	--wpforms-field-text-color: var(--wp--preset--color--base);
	--wpforms-label-color: var(--wp--preset--color--muted);
	--wpforms-label-sublabel-color: var(--wp--preset--color--muted);
	--wpforms-button-background-color: var(--wp--preset--color--primary);
	--wpforms-button-background-color-alt: var(--wp--preset--color--warm-dark);
	--wpforms-button-text-color: var(--wp--preset--color--base);
	--wpforms-button-border-color: var(--wp--preset--color--primary);
	--wpforms-button-border-color-alt: var(--wp--preset--color--warm-dark);
	--wpforms-button-border-radius: 0;
	--wpforms-field-border-radius: 0;
}

/* Submit button — amber filled */
.wpforms-container button.wpforms-submit,
.wpforms-container .wpforms-submit-container button[type="submit"],
.wpforms-container .wpforms-submit {
	background: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--base) !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 0.85rem 2.25rem !important;
	font-family: var(--wp--preset--font-family--body) !important;
	font-weight: 600 !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	letter-spacing: 0.02em !important;
	text-transform: none !important;
	cursor: pointer !important;
	transition: background 0.15s ease !important;
	box-shadow: none !important;
	text-shadow: none !important;
}

.wpforms-container button.wpforms-submit:hover,
.wpforms-container .wpforms-submit:hover,
.wpforms-container button.wpforms-submit:focus {
	background: var(--wp--preset--color--warm-dark) !important;
	color: var(--wp--preset--color--base) !important;
}

/* Submit container alignment */
.wpforms-container .wpforms-submit-container {
	margin-top: 0.5rem !important;
	padding: 0 !important;
}

/* Field description text */
.wpforms-container .wpforms-field-description {
	color: var(--wp--preset--color--muted) !important;
	font-size: var(--wp--preset--font-size--small) !important;
	font-weight: 400 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	margin: 0.4rem 0 0 !important;
}

/* Validation errors */
.wpforms-container .wpforms-error,
.wpforms-container label.wpforms-error {
	color: var(--wp--preset--color--highlight) !important;
	font-size: var(--wp--preset--font-size--small) !important;
	font-weight: 400 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	margin: 0.4rem 0 0 !important;
}

.wpforms-container input.wpforms-error,
.wpforms-container textarea.wpforms-error,
.wpforms-container select.wpforms-error {
	border-color: var(--wp--preset--color--highlight) !important;
}

/* Confirmation message after submit */
.wpforms-confirmation-container,
.wpforms-confirmation-container-full,
div.wpforms-confirmation-container-full {
	background: linear-gradient(135deg, rgba(0,0,0,0.7), rgba(102,148,179,0.15)) !important;
	border: 1px solid var(--wp--preset--color--accent) !important;
	border-radius: 0 !important;
	color: var(--wp--preset--color--base) !important;
	padding: 1.25rem 1.5rem !important;
	font-size: var(--wp--preset--font-size--medium) !important;
}

.wpforms-confirmation-container-full p {
	color: var(--wp--preset--color--base) !important;
	margin: 0 !important;
}

/* Checkboxes / radios — modern render mode renders custom UI */
.wpforms-container .wpforms-field-checkbox label,
.wpforms-container .wpforms-field-radio label {
	color: var(--wp--preset--color--base) !important;
	font-weight: 400 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	font-size: var(--wp--preset--font-size--medium) !important;
}

.wpforms-container input[type="checkbox"],
.wpforms-container input[type="radio"] {
	accent-color: var(--wp--preset--color--primary) !important;
	width: auto !important;
	margin-right: 0.5rem !important;
}

/* ==========================================================================
   GFS-BLOCKS PLUGIN SUPPORT
   The front page is now built from gfs/* blocks inserted into the Home page
   (post-content), without the constrained group wrappers the old template
   provided — these rules restore that spacing.
   ========================================================================== */

.gfs-stats-section {
	padding: var(--wp--preset--spacing--60, 4rem) 0;
}

.gfs-benefit-grid {
	padding-inline: 1.5rem;
}

/* ACF wraps InnerBlocks children in .acf-innerblocks-container, which would
   sit between the grid and its cells — make it layout-transparent. */
.gfs-benefit-grid > .acf-innerblocks-container,
.gfs-stats-grid > .acf-innerblocks-container {
	display: contents;
}

/* WYSIWYG block fields output <p> inside these wrappers (wpautop) — keep
   the spacing identical to the old single-paragraph markup. */
.gfs-hero__intro p,
.gfs-section__intro p,
.gfs-mentor__body p,
.gfs-cta__body p,
.gfs-benefit-card__body p,
.gfs-testimonial__quote p {
	margin: 0 0 0.75em;
}

.gfs-hero__intro p:last-child,
.gfs-section__intro p:last-child,
.gfs-mentor__body p:last-child,
.gfs-cta__body p:last-child,
.gfs-benefit-card__body p:last-child,
.gfs-testimonial__quote p:last-child {
	margin-bottom: 0;
}

/* ==========================================================================
   THE EVENTS CALENDAR — variable-level dark skin
   The override block above is scoped to body.tribe-events-page-template,
   which only exists when TEC's "Events template" DB setting is "Default
   Events Template" — so it can silently not apply on an environment (dev
   showed the stock white bar). TEC v6 components read these CSS custom
   properties, so overriding them at :root themes the events bar, view
   selector, and datepicker everywhere, with no body-class dependency.
   :root:root doubles the specificity so these win over TEC's own :root
   defaults regardless of stylesheet load order.
   ========================================================================== */

:root:root {
	--tec-color-accent-primary: var(--wp--preset--color--primary);
	--tec-color-accent-primary-hover: var(--wp--preset--color--warm-dark);
	--tec-color-accent-primary-active: var(--wp--preset--color--warm-dark);

	--tec-color-background-events: transparent;

	/* Search bar */
	--tec-color-background-events-bar: #000;
	--tec-color-border-events-bar: rgba(255, 255, 255, 0.25);
	--tec-color-icon-events-bar: var(--wp--preset--color--base);
	--tec-color-icon-events-bar-hover: var(--wp--preset--color--accent);
	--tec-color-text-events-bar-input: var(--wp--preset--color--base);
	--tec-color-text-events-bar-input-placeholder: var(--wp--preset--color--muted);
	--tec-color-background-events-bar-submit-button: var(--wp--preset--color--primary);
	--tec-color-background-events-bar-submit-button-hover: var(--wp--preset--color--warm-dark);
	--tec-color-background-events-bar-submit-button-active: var(--wp--preset--color--warm-dark);
	--tec-color-text-events-bar-submit-button: var(--wp--preset--color--base);
	--tec-color-text-events-bar-submit-button-hover: var(--wp--preset--color--base);
	--tec-color-text-events-bar-submit-button-active: var(--wp--preset--color--base);

	/* List / Month / Day view selector */
	--tec-color-background-view-selector: #000;
	--tec-color-background-view-selector-tabs: #000;
	--tec-color-background-view-selector-list-item-hover: rgba(255, 255, 255, 0.08);
	--tec-color-text-view-selector-list-item: var(--wp--preset--color--base);
	--tec-color-text-view-selector-list-item-hover: var(--wp--preset--color--base);

	/* Datepicker cell backgrounds */
	--tec-color-background-secondary-datepicker: rgba(255, 255, 255, 0.12);
	--tec-color-accent-primary-background-datepicker: rgba(181, 113, 42, 0.35);
}

/* --- Datepicker popup (the calendar under "Upcoming") --- */
.tribe-events .datepicker {
	background: #000 !important;
	border: 1px solid rgba(255, 255, 255, 0.25) !important;
	border-radius: 0 !important;
	color: var(--wp--preset--color--base) !important;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6) !important;
}

/* Month-year header + prev/next arrows */
.tribe-events .datepicker .datepicker-switch,
.tribe-events .datepicker .prev,
.tribe-events .datepicker .next {
	color: var(--wp--preset--color--base) !important;
	background: transparent !important;
}

.tribe-events .datepicker .datepicker-switch:hover,
.tribe-events .datepicker .prev:hover,
.tribe-events .datepicker .next:hover {
	background: rgba(255, 255, 255, 0.08) !important;
}

.tribe-events .datepicker .prev .tribe-events-c-top-bar__datepicker-nav-icon-svg path,
.tribe-events .datepicker .next .tribe-events-c-top-bar__datepicker-nav-icon-svg path {
	stroke: var(--wp--preset--color--base) !important;
}

/* Weekday letters */
.tribe-events .datepicker .dow {
	color: var(--wp--preset--color--muted) !important;
}

/* Day / month / year cells */
.tribe-events .datepicker .day,
.tribe-events .datepicker span.month,
.tribe-events .datepicker span.year {
	color: var(--wp--preset--color--base) !important;
	background: transparent !important;
	border-radius: 0 !important;
}

.tribe-events .datepicker .day:hover,
.tribe-events .datepicker .day.focused,
.tribe-events .datepicker span.month:hover,
.tribe-events .datepicker span.month.focused,
.tribe-events .datepicker span.year:hover,
.tribe-events .datepicker span.year.focused {
	background: rgba(255, 255, 255, 0.12) !important;
	color: var(--wp--preset--color--base) !important;
}

/* Days outside the current month / past days */
.tribe-events .datepicker .day.old,
.tribe-events .datepicker .day.new,
.tribe-events .datepicker .day.past,
.tribe-events .datepicker .month.past,
.tribe-events .datepicker .past {
	color: var(--wp--preset--color--muted) !important;
}

/* Selected day — amber */
.tribe-events .datepicker .day.active,
.tribe-events .datepicker .day.active.focused,
.tribe-events .datepicker span.month.active,
.tribe-events .datepicker span.year.active {
	background: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--base) !important;
}

/* Today — amber text so it stands out without being selected */
.tribe-events .datepicker .day.current,
.tribe-events .datepicker .day.current.focused {
	background: transparent !important;
	color: var(--wp--preset--color--primary) !important;
	font-weight: 700 !important;
}

/* ==========================================================================
   PAGE HERO — cinematic variant (gfs/page-hero WITH a background image)
   About / Partners page header: full-bleed photo, dark overlay, bracket frame.
   The flat header rules above still apply; these only kick in with a photo set.
   ========================================================================== */

.gfs-page-hero--has-image {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 620px;
	padding: clamp(4rem, 10vw, 8rem) clamp(1.5rem, 4vw, 4rem);
	background-color: #0c0805;
	background-size: cover;
	background-position: center;
	overflow: hidden;
}

.gfs-page-hero--has-image::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 75% 65% at 50% 45%, rgba(0, 0, 0, 0.45), transparent 75%),
		linear-gradient(180deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.45) 55%, rgba(0, 0, 0, 0.85) 90%, #000 100%);
}

.gfs-page-hero--has-image .gfs-page-hero__inner {
	position: relative;
	z-index: 1;
	max-width: 900px;
	width: 100%;
	text-align: center;
	padding: clamp(3rem, 6vw, 5rem) clamp(2rem, 5vw, 4.5rem);
}

.gfs-page-hero--has-image .gfs-page-hero__title {
	font-size: clamp(3rem, 8vw, 5.5rem);
	text-shadow: 0 2px 30px rgba(0, 0, 0, 0.6);
}

.gfs-page-hero--has-image .gfs-page-hero__intro {
	margin-top: 2rem;
}

/* ==========================================================================
   MEDIA + FEATURE LIST — gfs/media-feature block
   Two columns: text (heading + body + optional chevron list) and a photo.
   No photo -> the photo column isn't rendered and the text spans full width.
   ========================================================================== */

.gfs-media-feature {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(2rem, 5vw, 5rem);
	align-items: start;
	max-width: 1280px;
	margin: 0 auto;
	padding: clamp(3rem, 6vw, 5rem) clamp(1.5rem, 4vw, 3rem);
}

/* Photo on the left: swap the visual order (text stays first in the DOM). */
.gfs-media-feature--image-left .gfs-media-feature__media {
	order: -1;
}

/* No photo -> single full-width text column. */
.gfs-media-feature--text-only {
	grid-template-columns: 1fr;
	max-width: 1080px;
}

@media (max-width: 800px) {
	.gfs-media-feature {
		grid-template-columns: 1fr;
	}
	/* On mobile the photo always drops below the text, whatever side it's on. */
	.gfs-media-feature--image-left .gfs-media-feature__media {
		order: 0;
	}
}

.gfs-media-feature__heading {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 400;
	color: var(--wp--preset--color--base);
	letter-spacing: 0.02em;
	margin: 0 0 1.25rem;
}

.gfs-media-feature__body {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.5;
	margin: 0;
}

.gfs-media-feature__list {
	list-style: none;
	margin: 2rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

/*
 * Long name-only lists (the Partners roster) flow into two columns so they
 * do not run far past the photo beside them. The modifier is added by
 * render.php only when the list has 8+ rows and none of them carry body copy.
 */
.gfs-media-feature__list--columns {
	display: block;
	columns: 2;
	column-gap: clamp(1.5rem, 3vw, 2.5rem);
}

/*
 * Multi-column (rather than a 2-up grid) so an alphabetical roster reads down
 * the first column and continues in the second, the way a printed list does.
 * Each row keeps its own chevron grid and must not be split across the break.
 */
.gfs-media-feature__list--columns .gfs-media-feature__item {
	break-inside: avoid;
	page-break-inside: avoid;
	margin-bottom: 0.85rem;
}

/* One column once a half-width column would be too narrow for a name. */
@media (max-width: 600px) {
	.gfs-media-feature__list--columns {
		columns: 1;
	}
}

.gfs-media-feature__item {
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: 0.9rem;
	align-items: start;
}

.gfs-media-feature__chevron {
	color: var(--wp--preset--color--base);
	margin-top: 0.2em;
	flex: none;
}

.gfs-media-feature__item-title {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 400;
	color: var(--wp--preset--color--base);
	letter-spacing: 0.02em;
	line-height: 1.1;
	margin: 0;
}

.gfs-media-feature__item-body {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.5;
	margin: 0.4rem 0 0;
}

.gfs-media-feature__media {
	margin: 0;
}

.gfs-media-feature__img {
	display: block;
	width: 100%;
	height: auto;
}

/* WYSIWYG <p> spacing (mirrors the shared normalization block). */
.gfs-media-feature__body p,
.gfs-media-feature__item-body p {
	margin: 0 0 0.75em;
}

.gfs-media-feature__body p:last-child,
.gfs-media-feature__item-body p:last-child {
	margin-bottom: 0;
}
/* Footer logo image (optional; replaces the text wordmark). */
.gfs-wordmark__img {
	display: block;
	width: 200px;
	max-width: 100%;
	height: auto;
}

/* Accessible visually-hidden text (kept in the DOM for SEO + screen readers). */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Home hero wordmark as a logo image (replaces the Anton text). */
.gfs-hero__wordmark--image {
	margin: 0 0 1.5rem;
}

.gfs-hero__wordmark-img {
	display: block;
	width: auto;
	max-width: min(760px, 92%);
	height: auto;
	margin: 0 auto;
}
/* Page Hero optional CTA button (gfs/page-hero button link field). */
.gfs-page-hero__actions {
	margin: 2rem 0 0;
}

.gfs-page-hero--has-image .gfs-page-hero__actions {
	margin-top: 2.5rem;
}

.gfs-page-hero__cta {
	display: inline-block;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	padding: 0.85rem 2.5rem;
	border-radius: 999px;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease;
}

.gfs-page-hero__cta:hover,
.gfs-page-hero__cta:focus {
	background: var(--wp--preset--color--warm-dark);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}
/* ==========================================================================
   404 NOT FOUND — gfs/not-found block
   ========================================================================== */

.gfs-not-found {
	text-align: center;
	padding: clamp(2rem, 6vw, 4rem) 0;
}

.gfs-not-found__art {
	max-width: min(320px, 70vw);
	margin: 0 auto 2.5rem;
}

.gfs-not-found__image {
	display: block;
	width: 100%;
	height: auto;
}

.gfs-not-found__title {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2rem, 5vw, 3.5rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--base);
	margin: 0 0 1.25rem;
}

.gfs-not-found__message {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--base);
	max-width: 55ch;
	margin: 0 auto;
	line-height: 1.5;
}

.gfs-not-found__message > p {
	margin: 0 0 1rem;
}

.gfs-not-found__message > p:last-child {
	margin-bottom: 0;
}

.gfs-not-found__message a {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
}

.gfs-not-found__actions {
	margin: 2.5rem 0 0;
}

.gfs-not-found__cta {
	display: inline-block;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	padding: 0.85rem 2.5rem;
	border-radius: 999px;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease;
}

.gfs-not-found__cta:hover,
.gfs-not-found__cta:focus {
	background: var(--wp--preset--color--warm-dark);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}