@media (max-width: 1024px) {
	.mkb-ds-card-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.mkb-desktop-nav {
		display: none;
	}

	.mkb-mobile-menu {
		position: relative;
		display: block;
	}

	.mkb-mobile-menu__button {
		display: grid;
		width: 44px;
		height: 44px;
		place-content: center;
		gap: 4px;
		border: 1px solid var(--mkb-color-border);
		border-radius: var(--mkb-radius-sm);
		background: var(--mkb-color-surface);
		cursor: pointer;
		list-style: none;
	}

	.mkb-mobile-menu__button::-webkit-details-marker {
		display: none;
	}

	.mkb-mobile-menu__bar {
		display: block;
		width: 18px;
		height: 2px;
		border-radius: 2px;
		background: var(--mkb-color-ink);
	}

	.mkb-mobile-menu__panel {
		position: absolute;
		top: calc(100% + 10px);
		right: 0;
		display: grid;
		width: min(320px, calc(100vw - 40px));
		padding: var(--mkb-space-3);
		border: 1px solid var(--mkb-color-border);
		border-radius: var(--mkb-radius-lg);
		background: var(--mkb-color-surface);
		box-shadow: var(--mkb-shadow-md);
	}

	.mkb-mobile-menu__link {
		justify-content: flex-start;
	}

	.mkb-mobile-submenu summary {
		padding: var(--mkb-space-3) var(--mkb-space-4);
		color: var(--mkb-color-subtle);
		font-size: var(--mkb-text-xs);
		cursor: pointer;
	}

	.mkb-mobile-submenu__links {
		display: grid;
		padding-left: var(--mkb-space-3);
	}

	.mkb-ds-cta {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 640px) {
	:root {
		--mkb-header-height: 66px;
	}

	.mkb-ds-container,
	.mkb-site-header__inner {
		width: min(100% - 32px, var(--mkb-container));
	}

	.mkb-site-brand img {
		height: 38px;
	}

	.mkb-ds-section {
		padding-block: var(--mkb-space-16);
	}

	.mkb-ds-card-grid {
		grid-template-columns: 1fr;
	}

	.mkb-ds-card {
		padding: var(--mkb-space-6);
		border-radius: var(--mkb-radius-lg);
	}

	.mkb-ds-tool-card {
		grid-template-columns: 1fr;
	}

	.mkb-ds-actions {
		flex-direction: column;
	}

	.mkb-ds-actions .mkb-ds-button {
		width: 100%;
	}

	.mkb-ds-search {
		grid-template-columns: 1fr;
	}

	.mkb-mobile-bottom-nav {
		position: fixed;
		z-index: 110;
		right: 12px;
		bottom: max(10px, env(safe-area-inset-bottom));
		left: 12px;
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		padding: 7px;
		border: 1px solid rgba(79, 124, 103, 0.15);
		border-radius: 22px;
		background: rgba(255, 255, 255, 0.94);
		box-shadow: 0 18px 50px rgba(17, 17, 17, 0.15);
		-webkit-backdrop-filter: blur(18px);
		backdrop-filter: blur(18px);
	}

	.mkb-mobile-bottom-nav a,
	.mkb-mobile-bottom-nav > span {
		display: grid;
		min-height: 48px;
		place-items: center;
		align-content: center;
		gap: 2px;
		border-radius: 15px;
		color: var(--mkb-color-subtle);
		font-size: 11px;
		font-weight: 600;
		text-decoration: none;
	}

	.mkb-mobile-bottom-nav a.is-current {
		background: var(--mkb-color-primary-soft);
		color: var(--mkb-color-primary-strong);
	}

	.mkb-mobile-bottom-nav svg {
		width: 18px;
		height: 18px;
		fill: none;
		stroke: currentColor;
		stroke-linecap: round;
		stroke-linejoin: round;
		stroke-width: 2;
	}

	.mkb-mobile-bottom-nav span,
	.mkb-mobile-bottom-nav small {
		font-size: 10px;
	}

	.mkb-mobile-bottom-nav > span.is-disabled {
		opacity: 0.45;
	}

	body {
		padding-bottom: 82px;
	}
}
