
/*
 * Tony Lane — KEEP residue only.
 *
 * Layout, color, typography, surfaces, and hovers for .tl-* components live in
 * GenerateBlocks → Styles (Global Classes) and per-block styles in the editor.
 * Do not re-add spacing/color overrides for those components here.
 *
 * Tokens: GP Customizer Colors (var(--primary), etc.). Local :root tokens below
 * remain for any residual rules that still reference them.
 */

:root {
	--gb-container-width: 1280px;
	--tl-container-width: min(90%, 1280px);
	--tl-radius: 1rem;
	--tl-radius-lg: 1.25rem;
	--tl-space-md: 1.5rem;
	--tl-space-lg: 2.5rem;
	--tl-h2-margin-bottom: 40px;
	--tl-h3-margin-bottom: 30px;
	--tl-heading-margin-top: 20px;
}

/* Featured images — 1:1 square crop on all display surfaces */
.tl-featured-image-link,
.tl-music-project-card__image-link,
.tl-wedding-service-card__image-link,
.gb-loop-item > a.gb-element:has(> .tl-featured-image),
.gb-loop-item > a.gb-element:has(> img.gb-media[src*="wp-content/uploads"]) {
	aspect-ratio: 1 / 1;
	display: block;
	overflow: hidden;
}

.tl-featured-image,
.tl-music-project-card__image,
.tl-wedding-service-card__image,
.tl-page-hero__media.tl-featured-image,
.gb-loop-item > a.gb-element > .tl-featured-image,
.gb-loop-item > a.gb-element > img.gb-media {
	aspect-ratio: 1 / 1;
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.gb-element-prjhero02:has(> .tl-page-hero__media) {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	position: relative;
}

.gb-element-prjhero02 > .tl-page-hero__media {
	border-radius: 0;
	box-shadow: none;
	height: 100%;
	inset: 0;
	object-fit: cover;
	position: absolute;
	width: 100%;
}

/* Project singles — unlock GP container */
.single-tl_project .site.grid-container.container {
	max-width: none;
	width: 100%;
}

/* GP default page title — hidden via PHP + CSS fallback */
.page .entry-header,
.single-tl_project .entry-header {
	display: none !important;
}

.single-tl_project .featured-image.page-header-image-single {
	display: none !important;
}

.single-tl_project .entry-content {
	background-color: var(--base-2);
	padding-bottom: 0;
	padding-top: 0;
}

/* Alignfull direct child fallback when block has no container class yet */
.site-main section.alignfull > .gb-element.gb-element {
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
	max-width: 1280px;
	width: 90%;
}

.tl-site-header > .gb-element-hdr001 {
	width: 100%;
}

/* Hide social blocks when no links are configured in the editor */
.tl-header-social:not(:has(a)),
.gb-element-socnav:not(:has(a)),
.tl-contact-social:not(:has(a)) {
	display: none;
}

.gb-element-soc001:not(:has(.gb-element-socnav a)) {
	display: none;
}

.tl-contact-sidebar__social-title:has(+ .tl-contact-social:not(:has(a))) {
	display: none;
}

.tl-header-bar:not(:has(.tl-header-social a)) {
	grid-template-columns: minmax(0, 1fr) auto;
}

.tl-header-social a,
.gb-element-socnav a,
.tl-contact-social__link {
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.tl-header-social a:hover,
.tl-header-social a:focus,
.gb-element-socnav a:hover,
.gb-element-socnav a:focus,
.tl-contact-social__link:hover,
.tl-contact-social__link:focus {
	background-color: var(--tertiary) !important;
	border-color: var(--tertiary) !important;
	color: var(--primary) !important;
}

.tl-header-brand img,
.tl-header-logo {
	display: block;
	height: auto;
	max-height: 3.25rem;
	width: auto;
}

.tl-header-brand:not(:has(img)) {
	color: var(--tertiary) !important;
	font-family: "Roboto Slab", serif;
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2;
	text-shadow: 0 1px 14px rgba(0, 0, 0, 0.4);
}

.tl-header-brand:not(:has(img)) .tl-header-site-title {
	margin-bottom: 0;
}

/*
 * Header navigation — horizontal layout + link colours ONLY.
 * Submenu open/close/position is handled by GB Pro (classic-menu-style.css).
 * NEVER add: pointer-events on .gb-submenu-toggle, position/display overrides
 * on .gb-sub-menu, or .gb-menu-container mobile overlay rules.
 */

.tl-header-nav .tl-header-gb-nav,
.tl-header-nav .gb-navigation {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
	justify-content: center;
	width: 100%;
}

@media (min-width: 901px) {
	.tl-header-nav .gb-menu-toggle {
		display: none;
	}
}

.tl-header-nav .gb-menu {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem 1.75rem;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.tl-header-nav .gb-menu-item {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

.tl-header-nav .gb-menu-link {
	align-items: center;
	color: var(--base-2) !important;
	column-gap: 0.35rem;
	display: inline-flex;
	font-family: Nunito,"Nunito Fallback", sans-serif;
	font-size: 1rem;
	font-weight: 600;
	padding: 0;
	text-decoration: none !important;
}

.tl-header-nav .gb-menu-link:hover,
.tl-header-nav .gb-menu-link:focus,
.tl-header-nav .current-menu-item > .gb-menu-link,
.tl-header-nav .current-menu-ancestor > .gb-menu-link {
	color: var(--tertiary) !important;
}

.tl-header-nav .tl-menu-live > .gb-menu-link {
	background-color: var(--tertiary) !important;
	border-radius: 999px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.28);
	color: var(--primary) !important;
	font-size: 0.95rem;
	font-weight: 700;
	padding: 0.75rem 1.45rem;
}

.tl-header-nav .tl-menu-live > .gb-menu-link:hover,
.tl-header-nav .tl-menu-live > .gb-menu-link:focus {
	background-color: var(--base-2) !important;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
	color: var(--primary) !important;
}

/* Submenu chevron — cosmetic only */
.tl-header-nav .gb-submenu-toggle {
	align-items: center;
	display: inline-flex;
	flex-shrink: 0;
	line-height: 0;
	margin-left: 0.15rem;
}

.tl-header-nav .gb-submenu-toggle-icon {
	height: 0.85em;
	transition: transform 0.2s ease;
	width: 0.85em;
}

.tl-header-nav .gb-submenu-toggle[aria-expanded="true"] .gb-submenu-toggle-icon {
	transform: rotate(180deg);
}

/* Desktop dropdown panel — cosmetic only (GB Pro controls display/position) */
@media (min-width: 901px) {
	.tl-header-nav .gb-sub-menu {
		background-color: var(--primary);
		border: 1px solid rgba(232, 184, 109, 0.28);
		border-radius: 0.75rem;
		box-shadow: 0 16px 40px rgba(0, 0, 0, 0.38);
		list-style: none;
		margin: 0;
		min-width: 12.5rem;
		padding: 0.45rem;
		z-index: 120;
	}

	.tl-header-nav .gb-sub-menu .gb-menu-item {
		width: 100%;
	}

	.tl-header-nav .gb-sub-menu .gb-menu-link {
		border-radius: 0.5rem;
		display: block;
		font-size: 0.95rem;
		padding: 0.6rem 0.85rem;
		white-space: nowrap;
		width: 100%;
	}

	.tl-header-nav .gb-sub-menu .gb-menu-link:hover,
	.tl-header-nav .gb-sub-menu .gb-menu-link:focus {
		background-color: rgba(232, 184, 109, 0.14);
		color: var(--tertiary) !important;
	}
}

.tl-header-brand:hover,
.tl-header-brand:focus {
	color: var(--base-2) !important;
}

.tl-header-cta:hover,
.tl-header-cta:focus {
	background-color: var(--base-2) !important;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
	color: var(--primary) !important;
}

@media (max-width: 900px) {
	.tl-site-header {
		padding-bottom: 2rem;
		padding-top: 2rem;
	}

	.tl-header-bar {
		grid-template-areas:
			"brand social"
			"nav nav";
		grid-template-columns: 1fr 1fr;
	}

	.tl-header-brand {
		grid-area: brand;
		justify-self: start;
	}

	.tl-header-social {
		grid-area: social;
		justify-self: end;
	}

	.tl-header-bar:not(:has(.tl-header-social a)) {
		grid-template-areas: "brand" "nav";
		grid-template-columns: minmax(0, 1fr);
	}

	.tl-header-nav {
		grid-area: nav;
		justify-content: center;
		width: 100%;
	}

	.tl-header-nav .tl-header-gb-nav {
		justify-content: flex-end;
	}

	.tl-header-nav .gb-menu-toggle {
		align-items: center;
		background: transparent;
		border: 1px solid rgba(232, 184, 109, 0.28);
		border-radius: 0.5rem;
		color: var(--base-2);
		display: inline-flex;
		justify-content: center;
		margin-left: auto;
		padding: 0.55rem;
	}

	.tl-header-nav .gb-menu-toggle:hover,
	.tl-header-nav .gb-menu-toggle:focus {
		background-color: rgba(232, 184, 109, 0.12);
		border-color: var(--tertiary);
		color: var(--tertiary);
	}

	.tl-header-nav .gb-menu-toggle svg {
		fill: currentColor;
		height: 1.35rem;
		width: 1.35rem;
	}

	/* GB Pro full-overlay clones the toggle into the panel; hide the duplicate upper X. */
	.tl-header-nav .gb-menu-toggle--clone {
		display: none !important;
	}

	.tl-header-nav .gb-menu-container--mobile,
	.tl-header-nav .gb-menu-container.gb-menu-container--open {
		background: linear-gradient(180deg, var(--primary) 0%, #1a100c 100%);
		color: var(--base-2);
		padding: 1.25rem 1.35rem 2.75rem;
	}

	.tl-header-nav .gb-menu-container--mobile .gb-menu,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .gb-menu {
		align-items: stretch;
		flex-direction: column;
		flex-wrap: nowrap;
		gap: 0;
		width: 100%;
	}

	.tl-header-nav .gb-menu-container--mobile > .gb-menu > .gb-menu-item,
	.tl-header-nav .gb-menu-container.gb-menu-container--open > .gb-menu > .gb-menu-item {
		border-bottom: 1px solid rgba(232, 184, 109, 0.14);
	}

	.tl-header-nav .gb-menu-container--mobile > .gb-menu > .gb-menu-item:last-child,
	.tl-header-nav .gb-menu-container.gb-menu-container--open > .gb-menu > .gb-menu-item:last-child {
		border-bottom: 0;
	}

	.tl-header-nav .gb-menu-container--mobile .gb-menu-link,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .gb-menu-link {
		justify-content: space-between;
		padding: 0.95rem 0.35rem;
		width: 100%;
	}

	.tl-header-nav .gb-menu-container--mobile .menu-item-has-children > .gb-menu-link,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .menu-item-has-children > .gb-menu-link {
		color: var(--tertiary) !important;
		font-weight: 700;
	}

	.tl-header-nav .gb-menu-container--mobile .gb-submenu-toggle,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .gb-submenu-toggle {
		align-items: center;
		background: rgba(232, 184, 109, 0.1);
		border-radius: 0.4rem;
		color: var(--tertiary);
		display: inline-flex;
		justify-content: center;
		margin-left: 0.75rem;
		min-height: 2rem;
		min-width: 2rem;
		padding: 0.35rem;
	}

	.tl-header-nav .gb-menu-container--mobile .gb-sub-menu,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .gb-sub-menu {
		background: rgba(0, 0, 0, 0.22);
		border-left: 2px solid rgba(232, 184, 109, 0.38);
		border-radius: 0 0.5rem 0.5rem 0;
		list-style: none;
		margin: 0.15rem 0 0.65rem 0.65rem;
		padding: 0.35rem 0.5rem 0.5rem;
	}

	.tl-header-nav .gb-menu-container--mobile .gb-sub-menu .gb-menu-link,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .gb-sub-menu .gb-menu-link {
		border-radius: 0.4rem;
		display: flex;
		font-size: 0.95rem;
		font-weight: 600;
		justify-content: flex-start;
		padding: 0.72rem 0.55rem;
		white-space: normal;
		width: 100%;
	}

	.tl-header-nav .gb-menu-container--mobile .gb-sub-menu .gb-menu-link:hover,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .gb-sub-menu .gb-menu-link:hover,
	.tl-header-nav .gb-menu-container--mobile .gb-sub-menu .gb-menu-link:focus,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .gb-sub-menu .gb-menu-link:focus {
		background-color: rgba(232, 184, 109, 0.12);
		color: var(--tertiary) !important;
	}

	.tl-header-nav .gb-menu-container--mobile .tl-menu-live,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .tl-menu-live {
		border-bottom: 0;
		margin-top: 0.75rem;
		padding-top: 0.5rem;
	}

	.tl-header-nav .gb-menu-container--mobile .tl-menu-live > .gb-menu-link,
	.tl-header-nav .gb-menu-container.gb-menu-container--open .tl-menu-live > .gb-menu-link {
		justify-content: center;
		text-align: center;
	}
}

/* Footer text link hovers */
.gb-element-ftr001 a.tl-footer-link:hover,
.gb-element-ftr001 a.tl-footer-link:focus {
	color: var(--tertiary) !important;
}

/* Global heading spacing (theme content, not GB section heads) */
h2 {
	margin-bottom: var(--tl-h2-margin-bottom);
	margin-top: var(--tl-heading-margin-top);
}

h3 {
	margin-bottom: var(--tl-h3-margin-bottom);
	margin-top: var(--tl-heading-margin-top);
}

/* Embed / iframe fill — plugin markup */
.tl-project-embed__player,
.tl-project-youtube-embed__player {
	aspect-ratio: 16 / 9;
	background: #000;
	border-radius: 0.5rem;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.tl-project-embed__iframe,
.tl-project-youtube-embed__player iframe {
	border: 0;
	display: block;
	height: 100%;
	width: 100%;
}

.tl-project-body__embed.tl-project-embed,
.tl-project-body__embed.tl-project-youtube-embed {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.tl-project-body__extras .wp-block-embed,
.tl-project-body__videos .wp-block-embed,
.tl-project-body__embed .wp-block-embed,
.tl-music-embed-card .wp-block-embed {
	margin: 0;
}

.tl-project-youtube-thumb-link {
	aspect-ratio: 16 / 9;
	background-color: #000;
	border-radius: 0.5rem;
	display: block;
	overflow: hidden;
	position: relative;
}

.tl-project-youtube-thumb-link .tl-project-youtube-thumb__img {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.tl-project-youtube-thumb-link .tl-project-youtube-thumb__play {
	background-color: rgba(0, 0, 0, 0.72);
	border-radius: 999px;
	height: 3rem;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 3rem;
}

.tl-project-youtube-thumb-link .tl-project-youtube-thumb__play::after {
	border-color: transparent transparent transparent #fff;
	border-style: solid;
	border-width: 0.55rem 0 0.55rem 0.95rem;
	content: "";
	height: 0;
	left: 54%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 0;
}

.tl-project-youtube-thumb-link:hover .tl-project-youtube-thumb__play,
.tl-project-youtube-thumb-link:focus .tl-project-youtube-thumb__play {
	background-color: var(--secondary);
}

/* Stream SVG icons (core/html icons until Shape blocks) */
.tl-music-stream-link__icon {
	align-items: center;
	color: var(--secondary);
	display: flex;
	height: 1.5rem;
	justify-content: center;
	margin-bottom: 0.1rem;
	width: 100%;
}

.tl-music-stream-link__icon svg {
	fill: currentColor;
	height: 1.5rem;
	width: 1.5rem;
}

.tl-music-stream-link__icon--bandcamp svg {
	height: 1.5rem;
	max-width: 2.75rem;
	width: auto;
}

.tl-project-body__logo-img,
.tl-project-body__photo-img {
	border-radius: 0.25rem;
	display: block;
	height: auto;
	max-width: 100%;
}

/* Project hero — title/logo above photo when stacked; don't stretch panel */
@media (max-width: 900px) {
	.gb-element-prjhero01 .tl-page-hero__panel,
	.gb-element-prjhero01 .tl-page-hero__panel.tl-section-head--dark {
		height: auto;
		min-height: 0 !important;
		order: -1;
	}

	.gb-element-prjhero01 .gb-element-prjhero02 {
		align-self: stretch;
	}
}

