/**
 * Stellshi Blocksy Mobile Menu 1.1.1
 * Совместимо с фактической разметкой Blocksy 2.1.49.
 */

@media (max-width: 999.98px) {
	#offcanvas {
		--smm-panel-width: min(86vw, 380px);
		--smm-bg: #ffffff;
		--smm-surface: #f7f7f8;
		--smm-text: #101828;
		--smm-muted: #667085;
		--smm-accent: #002fa7;
		--smm-accent-soft: rgba(0, 47, 167, 0.08);
		--smm-line: rgba(16, 24, 40, 0.12);
		--side-panel-width: var(--smm-panel-width);
		background: rgba(16, 24, 40, 0.46);
		backdrop-filter: blur(4px);
		-webkit-backdrop-filter: blur(4px);
	}

	html.st-theme-dark #offcanvas {
		--smm-bg: #11151c;
		--smm-surface: #191f29;
		--smm-text: #f8fafc;
		--smm-muted: #98a2b3;
		--smm-accent: #5b8cff;
		--smm-accent-soft: rgba(91, 140, 255, 0.14);
		--smm-line: rgba(255, 255, 255, 0.11);
		background: rgba(2, 6, 12, 0.62);
	}

	#offcanvas .ct-panel-inner {
		background: var(--smm-bg);
		box-shadow: -18px 0 52px rgba(0, 0, 0, 0.22);
	}

	html.st-theme-dark #offcanvas .ct-panel-inner {
		background: var(--smm-bg);
		box-shadow: -18px 0 52px rgba(0, 0, 0, 0.42);
	}

	#offcanvas .ct-panel-actions {
		min-height: 64px;
		padding: 10px 18px;
		border-bottom: 1px solid var(--smm-line);
		background: var(--smm-bg);
	}

	#offcanvas .smm-brand {
		display: inline-flex;
		align-items: center;
		gap: 9px;
		width: max-content;
		min-height: 44px;
		margin: 0 0 12px;
		color: var(--smm-text);
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
		text-decoration: none;
	}

	#offcanvas .ct-panel-actions .smm-brand {
		min-width: 0;
		margin: 0;
	}

	#offcanvas .smm-brand__mark {
		display: grid;
		flex: 0 0 34px;
		place-items: center;
		width: 34px;
		height: 34px;
		border: 1px solid var(--smm-accent);
		border-radius: 12px;
		color: var(--smm-accent);
		font-size: 19px;
		font-weight: 760;
		line-height: 1;
	}

	#offcanvas .smm-brand__word {
		overflow: hidden;
		color: var(--smm-text);
		font-size: 18px;
		font-weight: 720;
		line-height: 1;
		letter-spacing: 0.105em;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	#offcanvas .ct-panel-actions .ct-toggle-close {
		--toggle-button-margin-end: 0;
		--toggle-button-margin-block: 0;
		--toggle-button-padding: 0;
		--theme-icon-size: 16px;
		flex: 0 0 42px;
		width: 42px;
		height: 42px;
		min-width: 42px;
		min-height: 42px;
		margin-inline-start: auto;
		border: 1px solid var(--smm-line);
		border-radius: 50%;
		color: var(--smm-text);
		background: transparent;
	}

	#offcanvas .ct-panel-actions .ct-toggle-close .ct-icon {
		fill: currentColor;
	}

	#offcanvas .ct-panel-content-inner {
		align-items: stretch;
		padding: 16px 18px 28px;
	}

	#offcanvas .mobile-menu[data-id="mobile-menu"],
	#offcanvas .mobile-menu[data-id^="mobile-menu"] {
		--horizontal-alignment: stretch;
		--text-horizontal-alignment: left;
		--has-indentation: 0;
		--items-vertical-spacing: 0px;
		--mobile-menu-divider: none;
		--theme-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
		--theme-font-size: 17px;
		--theme-font-weight: 700;
		--theme-font-style: normal;
		--theme-line-height: 1.25;
		--theme-letter-spacing: -0.012em;
		--theme-text-transform: none;
		--theme-text-decoration: none;
		--theme-link-initial-color: var(--smm-text);
		--theme-link-hover-color: var(--smm-accent);
		--theme-link-active-color: var(--smm-accent);
		width: 100%;
		margin: 0;
		padding: 0;
		color: var(--smm-text);
		background: transparent;
	}

	#offcanvas .mobile-menu > ul {
		width: 100%;
		margin: 0;
		padding: 0;
		border: 0;
		list-style: none;
	}

	#offcanvas .mobile-menu li {
		align-items: stretch;
		width: 100%;
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		list-style: none;
	}

	#offcanvas .mobile-menu > ul > li {
		padding-block: 3px;
		border-bottom: 1px solid var(--smm-line);
	}

	#offcanvas .mobile-menu > ul > li:last-child {
		border-bottom: 0;
	}

	#offcanvas .mobile-menu .ct-sub-menu-parent {
		width: 100%;
		column-gap: 4px;
		color: var(--smm-text);
	}

	#offcanvas .mobile-menu > ul > li > a,
	#offcanvas .mobile-menu > ul > li > .ct-sub-menu-parent > a {
		position: relative;
		display: flex;
		flex: 1 1 auto;
		align-items: center;
		justify-content: flex-start;
		min-height: 50px;
		padding: 11px 12px;
		border-radius: 0;
		color: var(--smm-text);
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
		font-size: 17px;
		font-weight: 700;
		font-style: normal;
		line-height: 1.25;
		letter-spacing: -0.012em;
		text-transform: none;
		text-align: left;
		text-decoration: none;
		background: transparent;
		box-shadow: none;
	}

	#offcanvas .mobile-menu .ct-toggle-dropdown-mobile {
		--toggle-button-size: 40px;
		--toggle-button-margin-end: 0;
		--theme-icon-size: 14px;
		flex: 0 0 40px;
		width: 40px;
		height: 40px;
		margin: 0 4px 0 0;
		border: 0;
		border-radius: 50%;
		color: var(--smm-muted);
		background: transparent;
	}

	#offcanvas .mobile-menu .ct-toggle-dropdown-mobile .ct-icon {
		fill: currentColor;
	}

	#offcanvas .mobile-menu .sub-menu {
		--theme-font-size: 15.5px;
		--theme-font-weight: 600;
		--theme-line-height: 1.35;
		--theme-letter-spacing: -0.006em;
		--theme-link-initial-color: var(--smm-text);
		--theme-link-hover-color: var(--smm-accent);
		--theme-link-active-color: var(--smm-accent);
		width: auto;
		margin: 2px 0 8px 12px;
		padding: 4px 0 4px 14px;
		overflow: hidden;
		border: 0;
		border-left: 1px solid var(--smm-line);
		border-radius: 0;
		background: transparent;
		box-shadow: none;
	}

	#offcanvas .mobile-menu .sub-menu.is-animating {
		will-change: height;
	}

	#offcanvas .smm-actions {
		display: grid;
		grid-template-columns: 52px minmax(0, 1fr);
		gap: 10px;
		width: 100%;
		margin: 24px 0 0;
		padding-top: 20px;
		border-top: 1px solid var(--smm-line);
	}

	#offcanvas .smm-actions a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-height: 52px;
		border: 1px solid var(--smm-accent);
		border-radius: 12px;
		color: var(--smm-accent);
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
		font-size: 16px;
		font-weight: 700;
		line-height: 1;
		text-decoration: none;
		transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease;
	}

	#offcanvas .smm-actions__telegram {
		width: 52px;
		padding: 0;
		background: transparent;
	}

	#offcanvas .smm-actions__telegram svg {
		width: 22px;
		height: 22px;
		fill: currentColor;
	}

	#offcanvas .smm-actions .smm-actions__contact {
		justify-content: space-between;
		gap: 10px;
		padding: 0 17px;
		color: #ffffff;
		background: var(--smm-accent);
	}

	#offcanvas .smm-actions__contact svg {
		flex: 0 0 20px;
		width: 20px;
		height: 20px;
	}

	#offcanvas .smm-actions a:focus-visible,
	#offcanvas .smm-brand:focus-visible {
		outline: 2px solid var(--smm-accent);
		outline-offset: 3px;
	}

	#offcanvas .mobile-menu .sub-menu li,
	#offcanvas .mobile-menu .sub-menu li:last-child {
		border: 0;
	}

	#offcanvas .mobile-menu .sub-menu a,
	#offcanvas .mobile-menu .sub-menu .ct-menu-link {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		width: 100%;
		min-height: 42px;
		padding: 9px 12px;
		border-radius: 6px;
		color: var(--smm-text);
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
		font-size: 15.5px;
		font-weight: 600;
		font-style: normal;
		line-height: 1.35;
		letter-spacing: -0.006em;
		text-transform: none;
		text-align: left;
		text-decoration: none;
		background: transparent;
		box-shadow: none;
	}

	/* Blocksy data-submenu-dots рисует исходные точки и тире через a::before. */
	#offcanvas .mobile-menu[data-submenu-dots] .sub-menu a:not(:empty)::before {
		display: none;
		width: 0;
		height: 0;
		content: none;
	}

	#offcanvas .mobile-menu > ul > li.current-menu-ancestor > .ct-sub-menu-parent > a,
	#offcanvas .mobile-menu > ul > li.current-menu-parent > .ct-sub-menu-parent > a,
	#offcanvas .mobile-menu > ul > li.current-menu-item > a {
		color: var(--smm-accent);
	}

	#offcanvas .mobile-menu .sub-menu li.current-menu-item > a,
	#offcanvas .mobile-menu .sub-menu li.current-menu-item > .ct-menu-link {
		padding-left: 14px;
		color: var(--smm-accent);
		background: var(--smm-accent-soft);
	}

	#offcanvas .mobile-menu .sub-menu li.current-menu-item > a::after,
	#offcanvas .mobile-menu .sub-menu li.current-menu-item > .ct-menu-link::after {
		position: absolute;
		top: 10px;
		bottom: 10px;
		left: 0;
		width: 3px;
		border-radius: 0 3px 3px 0;
		background: var(--smm-accent);
		content: "";
	}

	#offcanvas .mobile-menu a:focus-visible,
	#offcanvas .mobile-menu button:focus-visible,
	#offcanvas .ct-toggle-close:focus-visible {
		outline: 2px solid var(--smm-accent);
		outline-offset: 2px;
	}

	@media (hover: hover) {
		#offcanvas .smm-brand:hover .smm-brand__word {
			color: var(--smm-accent);
		}

		#offcanvas .smm-actions__telegram:hover {
			color: #ffffff;
			background: var(--smm-accent);
		}

		#offcanvas .smm-actions .smm-actions__contact:hover {
			border-color: var(--smm-text);
			color: var(--smm-bg);
			background: var(--smm-text);
		}

		#offcanvas .mobile-menu > ul > li > a:hover,
		#offcanvas .mobile-menu > ul > li > .ct-sub-menu-parent > a:hover,
		#offcanvas .mobile-menu .sub-menu a:hover {
			color: var(--smm-accent);
			background: var(--smm-accent-soft);
		}

		#offcanvas .mobile-menu .ct-toggle-dropdown-mobile:hover,
		#offcanvas .ct-panel-actions .ct-toggle-close:hover {
			color: var(--smm-accent);
			background: var(--smm-accent-soft);
		}
	}

	/*
	 * Blocksy может выводить тёмный off-canvas из Customizer отдельными
	 * динамическими правилами. В светлой теме принудительно синхронизируем
	 * фон всех внутренних слоёв и цвет ссылок.
	 */
	html:not(.st-theme-dark) #offcanvas {
		--smm-bg: #ffffff;
		--smm-surface: #f7f7f8;
		--smm-text: #101828;
		--smm-muted: #667085;
		--smm-accent: #002fa7;
		--smm-accent-soft: rgba(0, 47, 167, 0.08);
		--smm-line: rgba(16, 24, 40, 0.12);
	}

	html:not(.st-theme-dark) #offcanvas .ct-panel-inner,
	html:not(.st-theme-dark) #offcanvas .ct-panel-actions,
	html:not(.st-theme-dark) #offcanvas .ct-panel-content,
	html:not(.st-theme-dark) #offcanvas .ct-panel-content-inner {
		color: var(--smm-text) !important;
		background: var(--smm-bg) !important;
		background-image: none !important;
	}

	html:not(.st-theme-dark) #offcanvas .mobile-menu,
	html:not(.st-theme-dark) #offcanvas .mobile-menu ul,
	html:not(.st-theme-dark) #offcanvas .mobile-menu li,
	html:not(.st-theme-dark) #offcanvas .mobile-menu .ct-sub-menu-parent {
		color: var(--smm-text) !important;
		background: transparent !important;
		background-image: none !important;
	}

	html:not(.st-theme-dark) #offcanvas .mobile-menu a,
	html:not(.st-theme-dark) #offcanvas .mobile-menu .ct-menu-link {
		color: var(--smm-text) !important;
	}

	html:not(.st-theme-dark) #offcanvas .mobile-menu .ct-toggle-dropdown-mobile,
	html:not(.st-theme-dark) #offcanvas .ct-panel-actions .ct-toggle-close {
		color: var(--smm-muted) !important;
	}

	html:not(.st-theme-dark) #offcanvas .mobile-menu > ul > li.current-menu-ancestor > .ct-sub-menu-parent > a,
	html:not(.st-theme-dark) #offcanvas .mobile-menu > ul > li.current-menu-parent > .ct-sub-menu-parent > a,
	html:not(.st-theme-dark) #offcanvas .mobile-menu > ul > li.current-menu-item > a,
	html:not(.st-theme-dark) #offcanvas .mobile-menu .sub-menu li.current-menu-item > a {
		color: var(--smm-accent) !important;
	}

	html:not(.st-theme-dark) #offcanvas .mobile-menu .sub-menu li.current-menu-item > a {
		background: var(--smm-accent-soft) !important;
	}

	html:not(.st-theme-dark) #offcanvas .smm-brand,
	html:not(.st-theme-dark) #offcanvas .smm-brand__word {
		color: var(--smm-text) !important;
	}

	html:not(.st-theme-dark) #offcanvas .smm-actions__telegram {
		color: var(--smm-accent) !important;
		background: transparent !important;
	}

	html:not(.st-theme-dark) #offcanvas .smm-actions .smm-actions__contact {
		color: #ffffff !important;
		background: var(--smm-accent) !important;
	}

	@media (hover: hover) {
		html:not(.st-theme-dark) #offcanvas .smm-brand:hover .smm-brand__word {
			color: var(--smm-accent) !important;
		}

		html:not(.st-theme-dark) #offcanvas .smm-actions__telegram:hover {
			color: #ffffff !important;
			background: var(--smm-accent) !important;
		}

		html:not(.st-theme-dark) #offcanvas .smm-actions .smm-actions__contact:hover {
			border-color: var(--smm-text) !important;
			color: var(--smm-bg) !important;
			background: var(--smm-text) !important;
		}
	}
}

@media (max-width: 359.98px) {
	#offcanvas {
		--smm-panel-width: 91vw;
	}

	#offcanvas .ct-panel-content-inner {
		padding-right: 14px;
		padding-left: 14px;
	}

	#offcanvas .smm-brand__word {
		font-size: 16px;
		letter-spacing: 0.08em;
	}
}

@media (prefers-reduced-motion: reduce) {
	#offcanvas,
	#offcanvas .ct-panel-inner,
	#offcanvas .ct-icon,
	#offcanvas .smm-actions a {
		transition: none;
	}
}