/*
 * Runtime bridge between the Site Stilleri panel and every public module.
 * Values are injected as custom properties; selectors remain stable.
 */
body {
	font-family: var(--bgm-font-sans);
	font-size: var(--bgm-style-body-size, 16px);
	font-weight: var(--bgm-style-body-weight, 400);
	line-height: var(--bgm-line-body);
	letter-spacing: var(--bgm-style-body-letter, 0);
}

h1 {
	font-family: var(--bgm-font-heading);
	font-weight: var(--bgm-weight-extrabold);
	line-height: var(--bgm-leading-hero);
	letter-spacing: var(--bgm-tracking-hero);
}

h2 {
	font-family: var(--bgm-font-heading);
	font-weight: var(--bgm-weight-extrabold);
	line-height: var(--bgm-leading-section);
	letter-spacing: var(--bgm-tracking-section);
}

h3 {
	font-family: var(--bgm-font-heading);
	font-weight: var(--bgm-weight-bold);
	line-height: var(--bgm-leading-card);
	letter-spacing: var(--bgm-tracking-card);
}

h4,
h5,
h6 {
	font-family: var(--bgm-font-heading);
	font-weight: var(--bgm-style-heading-weight, 800);
	line-height: var(--bgm-line-heading);
	letter-spacing: var(--bgm-style-heading-letter, -0.04em);
}

main :where(a:not(.bgm-button):not([class*="button"])) {
	--bgm-link-local: var(--bgm-style-link);
	--bgm-link-hover-local: var(--bgm-style-link-hover);
	color: var(--bgm-link-local);
	font-weight: var(--bgm-style-link-weight);
}

main :where(a:not(.bgm-button):not([class*="button"]):visited) {
	color: var(--bgm-style-link-visited);
}

main :where(a:not(.bgm-button):not([class*="button"]):hover, a:not(.bgm-button):not([class*="button"]):focus-visible) {
	color: var(--bgm-link-hover-local);
}

:where(a, button, input, select, textarea):focus-visible {
	outline-color: var(--bgm-style-focus);
}

.bgm-button {
	min-height: var(--bgm-button-height);
	padding: var(--bgm-button-padding);
	border: var(--bgm-border-width) solid var(--bgm-button-border);
	border-radius: var(--bgm-button-radius);
	background-color: var(--bgm-button-bg);
	color: var(--bgm-button-text);
	font-size: var(--bgm-style-button-size, 14px);
	font-weight: var(--bgm-style-button-weight, 700);
}

.bgm-button:hover {
	background-color: var(--bgm-button-bg-hover);
	color: var(--bgm-button-text);
}

.bgm-hero,
.bgm-hero-layout {
	min-height: min(var(--bgm-home-hero-height), calc(100svh - var(--bgm-header-height)));
}

.bgm-hero-media {
	background-image: var(--bgm-home-hero-image);
	background-position: var(--bgm-home-hero-x) var(--bgm-home-hero-y);
}

.bgm-hero h1 {
	font-size: var(--bgm-text-hero);
	line-height: var(--bgm-leading-hero);
	letter-spacing: var(--bgm-tracking-hero);
}

.bgm-hero-shade {
	opacity: var(--bgm-home-hero-overlay);
}

.bgm-nav-list {
	gap: var(--bgm-menu-gap);
}

a.bgm-menu-item-link {
	--bgm-item-text: var(--bgm-menu-text);
	--bgm-item-text-hover: var(--bgm-menu-text-hover);
	--bgm-item-bg: var(--bgm-menu-bg);
	--bgm-item-bg-hover: var(--bgm-menu-bg-hover);
	--bgm-item-px: var(--bgm-menu-padding-x);
	--bgm-item-py: var(--bgm-menu-padding-y);
	--bgm-item-radius: var(--bgm-menu-radius);
	--bgm-item-icon: currentColor;
	--bgm-item-icon-size: 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--bgm-space-2);
	padding: var(--bgm-item-py) var(--bgm-item-px);
	border-radius: var(--bgm-item-radius);
	background: var(--bgm-item-bg);
	color: var(--bgm-item-text);
	font-size: var(--bgm-menu-font-size);
	font-weight: var(--bgm-menu-font-weight);
	transition: color var(--bgm-duration-fast), background-color var(--bgm-duration-fast), transform var(--bgm-duration-fast);
}

a.bgm-menu-item-link:is(:hover, :focus-visible),
.current-menu-item > a.bgm-menu-item-link {
	background: var(--bgm-item-bg-hover);
	color: var(--bgm-item-text-hover);
}

.bgm-menu-icon-right {
	flex-direction: row;
}

.bgm-menu-icon-top {
	flex-direction: column;
}

.bgm-menu-item-icon {
	flex: 0 0 auto;
	width: var(--bgm-item-icon-size);
	height: var(--bgm-item-icon-size);
	fill: none;
	stroke: var(--bgm-item-icon);
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.75;
}

@media (max-width: 1023px) {
	a.bgm-menu-item-link {
		display: flex;
		width: 100%;
		justify-content: flex-start;
	}
}