.primary-menu > :is(.primary-menu__service, .primary-menu__about) { display: flex; align-items: center; }
.header-service-menu__toggle { display: grid; width: 28px; height: 90px; padding: 0; border: 0; place-items: center; background: transparent; color: var(--ink); cursor: pointer; }
.header-service-menu__toggle svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .18s ease; }
:is(.primary-menu__service, .primary-menu__about).is-open .header-service-menu__toggle svg { transform: rotate(180deg); }
.header-service-menu { position: absolute; top: 100%; left: -20px; width: 180px; padding: 12px; margin: 0; list-style: none; border: 1px solid var(--line); border-radius: 6px; background: #fff; box-shadow: 0 12px 24px rgb(20 25 30 / 6%); opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-6px); transition: opacity .18s ease, transform .18s ease, visibility .18s ease; }
:is(.primary-menu__service, .primary-menu__about).is-open .header-service-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
.primary-menu .header-service-menu a { display: block; padding: 10px 12px; border-radius: 4px; color: var(--ink); font-size: var(--type-body); font-weight: var(--type-label-weight); line-height: var(--type-label-line-height); letter-spacing: var(--type-body-letter-spacing); overflow-wrap: anywhere; }
.primary-menu .header-service-menu a:hover, .primary-menu .header-service-menu a:focus-visible { color: var(--accent-dark); background: #fff7eb; }
@media (max-width: 980px) {
	.primary-menu > :is(.primary-menu__service, .primary-menu__about) { flex-wrap: wrap; }
	:is(.primary-menu__service, .primary-menu__about) > a { flex: 1; }
	.header-service-menu__toggle { width: 44px; height: 44px; }
	.header-service-menu { position: static; display: none; width: 100%; margin-bottom: 12px; box-shadow: none; transform: none; }
	:is(.primary-menu__service, .primary-menu__about).is-open .header-service-menu { display: block; }
}
@media (prefers-reduced-motion: reduce) {
	.header-service-menu, .header-service-menu__toggle svg { transition: none; }
}