/*
 * BK Marine global responsive behavior.
 *
 * Breakpoint-specific overrides are centralized here to make responsive intent
 * discoverable and to avoid scattered media queries across component modules.
 * Route-only breakpoint rules remain in routes.css because they are tightly
 * coupled to those components and originally followed this global layer.
 */

/* Responsive navigation and content reflow. */
@media (max-width: 1080px) {
	.bk-primary-nav {
		gap: 0;
	}

	.bk-primary-nav a {
		font-size: clamp(.78rem, 1.2vw, .84rem);
		padding-inline: clamp(.22rem, .45vw, .35rem);
	}

	.bk-service-row {
		grid-template-columns: 52px minmax(0, 1fr) minmax(250px, 34%);
		gap: 1.5rem;
	}
}

@media (max-width: 900px) {
	.bk-header__brand-inner {
		min-height: 92px;
	}

	/* Compact tool controls preserve header balance without sacrificing clarity. */
	.bk-language,
	.bk-search-toggle,
	.bk-menu-toggle {
		width: 40px;
		height: 40px;
	}

	.bk-language {
		width: auto;
		min-width: 58px;
		padding-inline: .45rem;
	}

	.bk-language:hover,
	.bk-search-toggle:hover,
	.bk-menu-toggle:hover,
	.bk-language:focus-visible,
	.bk-search-toggle:focus-visible,
	.bk-menu-toggle:focus-visible {
		border-color: var(--bk-magenta);
		background: rgba(228, 0, 69, .16);
		box-shadow: 0 0 0 2px rgba(228, 0, 69, .12);
	}

	.bk-menu-toggle {
		display: inline-grid;
	}

	.bk-primary-nav {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		justify-content: stretch;
		max-height: 0;
		overflow: hidden;
		background: var(--bk-white);
		box-shadow: var(--bk-shadow);
		transition: max-height 300ms ease;
	}

	.bk-primary-nav.is-open {
		max-height: 560px;
		border-top: 1px solid var(--bk-line);
	}

	.bk-primary-nav a {
		width: 100%;
		min-height: 44px;
		padding: .7rem 1.125rem;
		border-bottom: 1px solid var(--bk-soft);
		font-size: clamp(.88rem, 2.2vw, .94rem);
		line-height: 1.25;
		white-space: normal;
	}

	.bk-primary-nav a:hover,
	.bk-primary-nav a:focus-visible,
	.bk-primary-nav a.is-current,
	.bk-primary-nav a[aria-current="page"] {
		background: linear-gradient(90deg, rgba(228, 0, 69, .1), rgba(228, 0, 69, .018));
		box-shadow: inset 3px 0 0 var(--bk-magenta);
		color: var(--bk-magenta) !important;
		transform: none;
	}

	.bk-primary-nav a::after {
		top: 0;
		left: 0;
		right: auto;
		bottom: 0;
		width: 3px;
		height: auto;
		transform: scaleY(0);
	}

	.bk-primary-nav a:hover::after,
	.bk-primary-nav a:focus-visible::after,
	.bk-primary-nav a.is-current::after,
	.bk-primary-nav a[aria-current="page"]::after {
		transform: scaleY(1);
	}

	.bk-nav-row {
		height: 0;
	}

	.bk-search-form {
		top: 12px;
		right: 0;
	}

	.bk-intro__grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.bk-engine-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.bk-service-row {
		grid-template-columns: 44px 1fr;
	}

	.bk-service-row__image {
		grid-column: 2;
		width: min(480px, 100%);
	}

	.bk-overhaul__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 620px) {
	.bk-container {
		width: min(calc(100% - 32px), var(--bk-container));
	}

	.bk-header__brand-inner {
		min-height: 72px;
	}

	.bk-header__logo img {
		width: min(200px, 48vw);
	}

	.bk-language,
	.bk-search-toggle,
	.bk-menu-toggle {
		width: 38px;
		height: 38px;
	}

	.bk-language {
		width: auto;
		min-width: 54px;
		padding-inline: .4rem;
		font-size: .82rem;
	}

	.bk-language__flag { font-size: .9rem; }
	.bk-search-toggle svg { width: 19px; height: 19px; }
	.bk-menu-toggle { padding-inline: 9px; }
	.bk-menu-toggle > span:not(.screen-reader-text) { width: 18px; }

	.bk-hero {
		padding: 1rem 0 2.5rem;
	}

	.bk-hero__frame {
		width: calc(100% - 20px);
		min-height: 520px;
	}

	.bk-hero__frame { --bk-hero-image-height: 310px; }

	.bk-hero__image-link {
		height: var(--bk-hero-image-height);
		padding: .5rem;
	}

	.bk-hero__content {
		left: 1rem;
		right: 1rem;
		bottom: 2.1rem;
		grid-template-columns: 1fr;
		gap: .45rem;
		padding: 1.15rem;
	}

	.bk-hero__content h2,
	.bk-hero__eyebrow,
	.bk-button--light {
		grid-column: 1;
		grid-row: auto;
	}

	.bk-button--light {
		justify-self: start;
		margin-top: .35rem;
	}

	.bk-hero__control {
		top: 31%;
		width: 40px;
		height: 40px;
	}

	.bk-hero__control--prev { left: .5rem; }
	.bk-hero__control--next { right: .5rem; }

	.bk-engine-grid,
	.bk-overhaul__grid,
	.bk-footer__grid {
		grid-template-columns: 1fr;
	}

	.bk-service-row {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.bk-service-row__image {
		grid-column: 1;
	}

	.bk-footer__grid {
		gap: 2.5rem;
		text-align: center;
	}

	.bk-footer__bottom-inner {
		grid-template-columns: 1fr;
		gap: 1rem;
		justify-items: center;
		text-align: center;
	}

	.bk-footer__partner {
		text-align: center;
	}
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.bk-site *,
	.bk-site *::before,
	.bk-site *::after {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
	}
}
