/**
 * Yorkmi front-end styles.
 * Tokens live in global.css — do not redeclare body/heading/link bases here.
 */

/* Skip link */
.skip-link,
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal;
}

.skip-link:focus,
.screen-reader-text:focus {
	background: var(--yorkmi-button-bg);
	clip: auto;
	clip-path: none;
	color: var(--yorkmi-button-fg);
	display: block;
	font-size: 1rem;
	font-weight: 600;
	height: auto;
	inset-inline-start: 1rem;
	top: 1rem;
	left: 1rem;
	line-height: normal;
	padding: 0.75rem 1rem;
	text-decoration: none;
	width: auto;
	z-index: 100000;
}

/* Header link contrast on crimson */
header a:focus-visible,
.yorkmi-site-header a:focus-visible {
	outline: 2px solid var(--yorkmi-color-header-fg);
	outline-offset: 3px;
}

.wp-block-heading {
	font-family: var(--yorkmi-font-display);
	line-height: var(--yorkmi-line-height-heading);
	font-weight: var(--yorkmi-font-weight-semibold);
	color: var(--yorkmi-color-heading);
}

/* Layout */
.yorkmi-content,
.entry-content {
	max-width: var(--yorkmi-content-width);
	margin-inline: auto;
}

.alignwide {
	max-width: var(--yorkmi-wide-width);
	margin-inline: auto;
	width: calc(100% + (var(--yorkmi-wide-width) - var(--yorkmi-content-width)) * 0.5);
	max-width: min(100vw - 2rem, var(--yorkmi-wide-width));
}

.alignfull {
	max-width: none;
	width: 100%;
	margin-inline: 0;
}

.yorkmi-elementor-blank .site-header,
.yorkmi-elementor-blank .site-footer {
	display: none;
}

/* Native / CF7 buttons — scoped; Elementor buttons handled lightly below */
.wp-block-button__link,
.wp-element-button,
button[type="submit"],
.wpcf7-submit {
	display: inline-block;
	font-family: var(--yorkmi-font-body);
	font-weight: var(--yorkmi-font-weight-semibold);
	background: var(--yorkmi-button-bg);
	color: var(--yorkmi-button-fg);
	border: 0;
	border-radius: var(--yorkmi-button-radius);
	padding: var(--yorkmi-button-pad-y) var(--yorkmi-button-pad-x);
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--yorkmi-transition), color var(--yorkmi-transition);
}

.wp-block-button__link:hover,
.wp-element-button:hover,
button[type="submit"]:hover,
.wpcf7-submit:hover {
	background: var(--yorkmi-button-bg-hover);
	color: var(--yorkmi-button-fg-hover);
}

.wp-block-button__link:active,
.wp-element-button:active,
button[type="submit"]:active {
	background: var(--yorkmi-button-bg-active);
}

.wp-block-button__link:focus-visible,
.wp-element-button:focus-visible {
	outline: 2px solid var(--yorkmi-color-secondary);
	outline-offset: 2px;
}

/* Ghost / outline — block editor only */
.yorkmi-btn-outline,
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--yorkmi-color-primary);
	box-shadow: inset 0 0 0 2px var(--yorkmi-color-primary);
}

.yorkmi-btn-outline:hover,
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--yorkmi-color-primary);
	color: var(--yorkmi-button-fg);
}

/*
 * Elementor buttons: soft defaults only when kit/widget has not set colors.
 * Avoid !important so Global Kit and per-widget styles win.
 */
.elementor-widget-button .elementor-button {
	font-family: var(--yorkmi-font-body);
	font-weight: var(--yorkmi-font-weight-semibold);
	border-radius: var(--yorkmi-button-radius);
	transition: background-color var(--yorkmi-transition), color var(--yorkmi-transition), opacity var(--yorkmi-transition);
}

.elementor-widget-button .elementor-button:focus-visible {
	outline: 2px solid var(--yorkmi-color-secondary);
	outline-offset: 2px;
}

/* Forms */
label {
	display: block;
	margin-bottom: var(--yorkmi-space-xs);
	font-weight: var(--yorkmi-font-weight-semibold);
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="search"],
textarea,
select {
	width: 100%;
	max-width: 100%;
	padding: var(--yorkmi-input-pad);
	border: 1px solid var(--yorkmi-input-border);
	border-radius: var(--yorkmi-input-radius);
	font-family: inherit;
	font-size: 1rem;
	color: var(--yorkmi-color-contrast);
	background: var(--yorkmi-color-base);
	transition: border-color var(--yorkmi-transition), box-shadow var(--yorkmi-transition);
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--yorkmi-color-primary);
	outline: 2px solid var(--yorkmi-color-focus);
	outline-offset: 1px;
}

input[aria-invalid="true"],
.wpcf7-not-valid {
	border-color: var(--yorkmi-color-error);
}

/* Header nav — uppercase English labels on crimson bar */
.yorkmi-nav,
.yorkmi-site-header .elementor-nav-menu > li > a,
header.wp-block-group .wp-block-navigation-item__content {
	font-family: var(--yorkmi-font-body);
	font-size: var(--yorkmi-text-nav);
	font-weight: var(--yorkmi-font-weight-semibold);
	letter-spacing: var(--yorkmi-letter-spacing-nav);
	text-transform: uppercase;
	line-height: var(--yorkmi-line-height-nav);
	color: var(--yorkmi-color-header-fg);
	text-decoration: none;
}

.yorkmi-site-header .elementor-nav-menu > li > a:hover,
header.wp-block-group .wp-block-navigation-item__content:hover {
	text-decoration: underline;
	color: var(--yorkmi-color-header-fg);
}

/* Containers / section rhythm */
.yorkmi-section {
	padding-block: var(--yorkmi-space-2xl);
}

.yorkmi-section--tight {
	padding-block: var(--yorkmi-space-xl);
}

.elementor-section.elementor-section-boxed > .elementor-container,
.e-con {
	--container-max-width: var(--yorkmi-content-width);
}

/* Header nav on crimson bar */
header.wp-block-group a {
	text-decoration: none;
	color: var(--yorkmi-color-header-fg);
}

header.wp-block-group a:hover {
	text-decoration: underline;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms;
		animation-iteration-count: 1;
		transition-duration: 0.01ms;
	}
}

@media (max-width: 1024px) {
	.yorkmi-content,
	.entry-content {
		max-width: 100%;
	}

	.alignwide {
		width: 100%;
		max-width: 100%;
	}
}

@media (max-width: 767px) {
	header.wp-block-group,
	footer.wp-block-group {
		padding-inline: var(--yorkmi-space-md);
	}

	.yorkmi-section {
		padding-block: var(--yorkmi-space-xl);
	}
}