/**
 * core/navigation – links, dropdown panels, the "Columns" mega menu
 * and the mobile overlay.
 *
 * Desktop rules are scoped to the responsive container without
 * `.is-menu-open`, so the open mobile overlay keeps its own layout.
 * Panel and overlay colours come from here (not from the block's overlay
 * colour attributes), because those add `!important` preset classes.
 */

/* ---------- Links ---------- */

.wp-block-navigation .wp-block-navigation-item__content {
	text-decoration: none;
	text-underline-offset: 0.3em;
	transition: color var(--wp--custom--transition), background-color var(--wp--custom--transition);
}

.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item__content:focus-visible,
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	text-decoration: underline;
}

.wp-block-navigation .wp-block-navigation__submenu-icon svg {
	transition: transform var(--wp--custom--transition);
}

/* Open top-level item (hover or toggled): accent label, flipped chevron. */
.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .has-child:is(:hover, :has(> [aria-expanded="true"])) > :is(.wp-block-navigation-item__content, .wp-block-navigation__submenu-icon) {
	color: var(--wp--preset--color--cta);
	text-decoration: none;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .has-child:is(:hover, :has(> [aria-expanded="true"])) > .wp-block-navigation__submenu-icon svg {
	transform: rotate(180deg);
}

/* ---------- Dropdown panel (desktop) ---------- */

/*
 * Open/close runs on opacity + visibility instead of core's width/height
 * collapse, so the panel animates both ways and closing waits a short grace
 * period. The transparent top border reaches up into the menu item row, so
 * moving the pointer down never leaves the hover area.
 */
:root .wp-block-navigation__responsive-container:not(.is-menu-open) .has-child .wp-block-navigation__submenu-container {
	--rowww-panel-reach: 1.25rem;
	--rowww-panel-gap: calc(var(--wp--preset--spacing--30) + var(--rowww-panel-reach));
	--rowww-panel-radius: 1.5rem;
	--rowww-panel-ease: cubic-bezier(0.22, 1, 0.36, 1);

	/* Dark panel colours (solid, so the page does not show through). */
	--rowww-panel-bg: color-mix(in srgb, var(--wp--preset--color--contrast) 5%, var(--wp--preset--color--base));
	--rowww-panel-bg-alt: color-mix(in srgb, var(--wp--preset--color--contrast) 9%, var(--wp--preset--color--base));
	--rowww-panel-text: var(--wp--preset--color--contrast);
	--rowww-panel-muted: var(--wp--preset--color--muted);
	--rowww-panel-line: var(--wp--custom--line--subtle);
	width: auto;
	height: auto;
	min-width: 16rem;
	margin-top: calc(-1 * var(--rowww-panel-reach));
	padding: var(--wp--preset--spacing--20);
	overflow: hidden;
	visibility: hidden;
	opacity: 0;
	border: 0;
	border-top: var(--rowww-panel-gap) solid transparent;
	border-radius: var(--rowww-panel-radius) / calc(var(--rowww-panel-radius) + var(--rowww-panel-gap)) calc(var(--rowww-panel-radius) + var(--rowww-panel-gap)) var(--rowww-panel-radius) var(--rowww-panel-radius);
	background-color: var(--rowww-panel-bg);
	background-clip: padding-box;
	color: var(--rowww-panel-text);
	box-shadow: inset 0 0 0 1px var(--rowww-panel-line);
	filter: drop-shadow(0 30px 50px rgba(0, 0, 0, 0.5));
	transform: translateY(0.75rem) scale(0.98);
	transform-origin: 50% 0;
	transition:
		opacity 200ms ease 150ms,
		transform 320ms var(--rowww-panel-ease) 150ms,
		visibility 0s linear 350ms;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .has-child:is(:hover, :focus-within) > .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-container:not(.is-menu-open) .has-child > [aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
	visibility: visible;
	opacity: 1;
	transform: none;
	transition:
		opacity 220ms ease,
		transform 420ms var(--rowww-panel-ease),
		visibility 0s;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
	border-radius: 0.75rem;
	font-size: var(--wp--preset--font-size--md);
	text-decoration: none;
	transition: color var(--wp--custom--transition), transform var(--wp--custom--transition);
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content:is(:hover, :focus-visible) {
	color: var(--rowww-accent-text-start);
}

/*
 * Optional item descriptions (Navigation link → Description),
 * shown below the label.
 */
.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container .wp-block-navigation-item__content:has(.wp-block-navigation-item__description) {
	flex-direction: column;
	align-items: flex-start;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container .wp-block-navigation-item:has(> .wp-block-navigation-item__content .wp-block-navigation-item__description) + .wp-block-navigation-item {
	margin-top: var(--wp--preset--spacing--20);
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container .wp-block-navigation-item__description {
	display: block;
	max-width: 15rem;
	margin-top: 0.25rem;
	font-size: var(--wp--preset--font-size--sm);
	line-height: var(--wp--custom--line-height--base);
	color: var(--rowww-panel-muted);
}

/* ---------- "Columns" mega menu (desktop) ---------- */

/*
 * The panel is positioned against the nearest positioned ancestor (the
 * header row, see layout.css) instead of the menu item, so it is centred
 * on the page and never overflows the viewport.
 */
.wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .is-style-columns {
	position: static;
}

:root .wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container {
	left: 50%;
	display: grid;
	grid-auto-columns: max-content;
	grid-auto-flow: column;
	width: max-content;
	max-width: 100%;
	padding: 0;
	transform: translate(-50%, 0.75rem) scale(0.98);
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns:is(:hover, :focus-within) > .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > [aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
	transform: translate(-50%, 0);
}

/* Columns fade in one after the other. */
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > .wp-block-navigation-item {
	opacity: 0;
	transform: translateY(0.5rem);
	transition: opacity 200ms ease, transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns:is(:hover, :focus-within) > .wp-block-navigation__submenu-container > .wp-block-navigation-item,
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > [aria-expanded="true"] ~ .wp-block-navigation__submenu-container > .wp-block-navigation-item {
	opacity: 1;
	transform: none;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > .wp-block-navigation-item:nth-child(2) {
	transition-delay: 40ms;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > .wp-block-navigation-item:nth-child(3) {
	transition-delay: 80ms;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > .wp-block-navigation-item:nth-child(n + 4) {
	transition-delay: 120ms;
}

/* Service links: a small arrow slides in on hover. */
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container .wp-block-navigation-item__label::after {
	content: "→";
	display: inline-block;
	margin-inline-start: 0.4em;
	opacity: 0;
	transform: translateX(-0.4em);
	transition: opacity var(--wp--custom--transition), transform var(--wp--custom--transition);
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container .wp-block-navigation-item__content:is(:hover, :focus-visible) .wp-block-navigation-item__label::after {
	opacity: 1;
	transform: none;
}

/*
 * Badge after a menu label (e.g. "Free"): written into the label as
 * <span class="rowww-nav-badge">, so the text stays content. Tinted with the
 * text colour, so it works on the dark panel and in the mobile overlay too.
 */
.wp-block-navigation .rowww-nav-badge {
	display: inline-block;
	margin-inline-start: 0.5em;
	padding: 0.25em 0.7em;
	border-radius: var(--wp--preset--border-radius--pill);
	background: color-mix(in srgb, currentcolor 12%, transparent);
	font-size: 0.62em;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.4;
	text-transform: uppercase;
	vertical-align: 0.25em;
}

/* Accent badge (`rowww-nav-badge is-accent`): filled with the current accent
   gradient, smaller and on its own line above the label, for an item that
   should stand out. Write it before the label text:
   `<span class="rowww-nav-badge is-accent">AI Assist és chat</span>
   Weboldal karbantartás`. */
.wp-block-navigation .rowww-nav-badge.is-accent {
	display: block;
	width: fit-content;
	margin: 0 0 0.45em;
	padding: 0.2em 0.6em;
	background: linear-gradient(90deg, var(--rowww-accent-start), var(--rowww-accent-end));
	color: var(--rowww-accent-on);
	font-size: 0.5em;
	vertical-align: baseline;
}

/* In the mobile overlay the badge follows the label on the same line (the
   markup keeps it first, `order` moves it after); neither breaks, and on a
   narrow screen the badge wraps below the label as a whole. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label:has(> .rowww-nav-badge.is-accent) {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.3em 0.4em;
	white-space: nowrap;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:has(.rowww-nav-badge.is-accent) {
	padding-inline-end: 0;
}

/* In the overlay the badges are larger than in the desktop menu, so they
   read well next to the smaller submenu labels on a phone. */
.wp-block-navigation__responsive-container.is-menu-open .rowww-nav-badge {
	font-size: 0.8em;
	vertical-align: 0.1em;
}

.wp-block-navigation__responsive-container.is-menu-open .rowww-nav-badge.is-accent {
	order: 1;
	margin: 0;
	padding-inline: 0.6em;
	font-size: 0.78em;
	white-space: nowrap;
}

/*
 * AI mark after a menu label, for services that work differently from the
 * rest: <span class="rowww-nav-ai"></span> written into the label. The label
 * names the service, so the mark is decorative (empty, nothing to read out).
 * A small sparkle in the accent gradient that twinkles now and then.
 */
.wp-block-navigation .rowww-nav-ai {
	--rowww-sparkle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 2c.6 4.4 3.6 7.4 8 8-4.4.6-7.4 3.6-8 8-.6-4.4-3.6-7.4-8-8 4.4-.6 7.4-3.6 8-8Z'/%3E%3Cpath d='M19 14c.3 1.8 1.2 2.7 3 3-1.8.3-2.7 1.2-3 3-.3-1.8-1.2-2.7-3-3 1.8-.3 2.7-1.2 3-3Z'/%3E%3C/svg%3E");

	display: inline-block;
	width: 1.15em;
	height: 1.15em;
	margin-inline-start: 0.35em;
	background: linear-gradient(135deg, var(--rowww-accent-text-start), var(--rowww-accent-text-end));
	vertical-align: -0.2em;
	-webkit-mask: var(--rowww-sparkle) center / contain no-repeat;
	mask: var(--rowww-sparkle) center / contain no-repeat;
}

@media (prefers-reduced-motion: no-preference) {

	.wp-block-navigation .rowww-nav-ai {
		animation: rowww-nav-twinkle 3.6s ease-in-out infinite;
	}
}

@media (forced-colors: active) {

	.wp-block-navigation .rowww-nav-ai {
		background: CanvasText;
	}
}

@keyframes rowww-nav-twinkle {

	0%,
	70%,
	100% {
		transform: none;
	}

	80% {
		transform: scale(1.25) rotate(20deg);
	}

	90% {
		transform: scale(0.9);
	}
}

/* Narrower desktops: two columns per row (four need about 1230px). */
@media (max-width: 1399px) {

	:root .wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container {
		grid-auto-flow: row;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		width: 100%;
	}
}

/* One column per child submenu. */
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > .wp-block-navigation-item {
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	min-width: 13rem;
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}

/*
 * Featured column: add the `is-featured` class to a child submenu
 * (Advanced → Additional CSS classes).
 */
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > .is-featured {
	background-color: var(--rowww-panel-bg-alt);
}

/*
 * Column label: the child submenu's own link.
 * Core lets it grow; keep it at the top of the column.
 */
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	flex-grow: 0;
	margin-bottom: var(--wp--preset--spacing--30);
	padding: 0;
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--rowww-panel-muted);
}

/*
 * Columns are always open inside the panel. They inherit its visibility,
 * so links in a closed panel stay unfocusable.
 */
:root .wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container {
	position: static;
	width: auto;
	min-width: 0;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: visible;
	visibility: inherit;
	opacity: 1;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	background: none;
	filter: none;
	transform: none;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: var(--wp--preset--spacing--10) 0;
}

.is-style-columns .wp-block-navigation__submenu-container .wp-block-navigation__submenu-icon {
	display: none;
}

/*
 * Category columns: add `has-accent-N` to a child submenu (Advanced →
 * Additional CSS classes, e.g. `has-accent-2`). The column then shows its
 * category colour: a short gradient line above the label, a dot before it,
 * a tinted hover and an arrow in the accent (from the accent tokens).
 */
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > [class*="has-accent-"] {
	position: relative;
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > [class*="has-accent-"]::before {
	content: "";
	position: absolute;
	top: calc(var(--wp--preset--spacing--60) - 1rem);
	left: var(--wp--preset--spacing--50);
	width: 2.25rem;
	height: 3px;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--rowww-accent-start), var(--rowww-accent-end));
}

/* Thin divider between neighbouring category columns. */
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > [class*="has-accent-"] + [class*="has-accent-"] {
	border-inline-start: 1px solid var(--rowww-panel-line);
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > [class*="has-accent-"] > .wp-block-navigation-item__content {
	display: flex;
	gap: 0.55em;
	align-items: center;
	color: var(--rowww-panel-text);
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns > .wp-block-navigation__submenu-container > [class*="has-accent-"] > .wp-block-navigation-item__content::before {
	content: "";
	flex: none;
	width: 0.6rem;
	height: 0.6rem;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--rowww-accent-start), var(--rowww-accent-end));
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--rowww-accent-start) 15%, transparent);
}

/* Service links: tinted pill on hover, arrow in the category colour. */
.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns [class*="has-accent-"] .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	margin-inline: -0.65rem;
	padding-inline: 0.65rem;
	border-radius: var(--wp--preset--border-radius--pill);
	transition: background-color var(--wp--custom--transition);
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns [class*="has-accent-"] .wp-block-navigation__submenu-container .wp-block-navigation-item__content:is(:hover, :focus-visible) {
	background-color: color-mix(in srgb, var(--rowww-accent-start) 18%, transparent);
	color: var(--rowww-panel-text);
}

.wp-block-navigation__responsive-container:not(.is-menu-open) .is-style-columns [class*="has-accent-"] .wp-block-navigation__submenu-container .wp-block-navigation-item__label::after {
	color: var(--rowww-accent-text-start);
}

/*
 * Mobile overlay: the same dot before each category label. It hangs in the
 * margin, so the category labels line up with the "Featured" label, and it is
 * centred on the (small caps) label line.
 */
.wp-block-navigation__responsive-container.is-menu-open .is-style-columns > .wp-block-navigation__submenu-container > [class*="has-accent-"] > .wp-block-navigation-item__content {
	align-items: center;
	gap: 0;
}

.wp-block-navigation__responsive-container.is-menu-open .is-style-columns > .wp-block-navigation__submenu-container > [class*="has-accent-"] > .wp-block-navigation-item__content::before {
	content: "";
	flex: none;
	width: 0.55rem;
	height: 0.55rem;
	margin-inline: calc(-0.55rem - 0.6em) 0.6em;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--rowww-accent-start), var(--rowww-accent-end));
}

/* ---------- Mobile overlay ---------- */

:root .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
	padding: var(--wp--preset--spacing--50) var(--wp--custom--gutter);
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	text-align: start;
}

:root .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) .wp-block-navigation__submenu-container {
	border: 0;
	background: transparent;
	color: inherit;
}

/* The inner list repeats the nav's justification classes, so reset it there. */
.wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	--navigation-layout-align: flex-start;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--md);
}

.wp-block-navigation__responsive-container.is-menu-open .is-style-columns > .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--sm);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}

/*
 * Mobile overlay, category columns: the label sits as far from the list
 * above it as from its own first item (the core's submenu top padding
 * alone left it twice as far below).
 */
:root .wp-block-navigation__responsive-container.is-menu-open .is-style-columns > .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation__submenu-container {
	padding-top: var(--wp--preset--spacing--10);
}

.wp-block-navigation__responsive-container.is-menu-open .is-style-columns > .wp-block-navigation__submenu-container > .wp-block-navigation-item + .wp-block-navigation-item {
	margin-top: var(--wp--preset--spacing--10);
}

/*
 * Mobile overlay: top-level submenus (e.g. Services) start collapsed. The
 * toggle button sits at the end of the row and opens them (assets/js/
 * navigation.js sets `is-rowww-open`); the panel slides open. Nested groups
 * (category columns) stay open inside it.
 */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .has-child {
	flex-flow: row wrap;
	align-items: center;
	width: 100%;
}

:root .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .has-child > .wp-block-navigation__submenu-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	margin-inline-start: auto;
	padding: 0;
	border: 1px solid var(--wp--custom--line--default);
	border-radius: 50%;
	color: inherit;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .has-child > .wp-block-navigation__submenu-icon svg {
	width: 0.75rem;
	height: 0.75rem;
	transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .has-child.is-rowww-open > .wp-block-navigation__submenu-icon svg {
	transform: rotate(180deg);
}

:root .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .has-child > .wp-block-navigation__submenu-container {
	flex-basis: 100%;
	max-height: 0;
	margin-block: 0;
	padding-block: 0;
	overflow: hidden;
	opacity: 0;
	transition: max-height 500ms cubic-bezier(0.22, 1, 0.36, 1), opacity 300ms ease, padding 300ms ease;
}

:root .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .has-child.is-rowww-open > .wp-block-navigation__submenu-container {
	max-height: 120rem;
	padding-block: var(--wp--preset--spacing--30) 0;
	opacity: 1;
}

/*
 * Mobile overlay background: two faint, very wide accent lights, painted as
 * background layers of the overlay itself. A scroll container's background
 * stays put while its content scrolls, so the lights cover the screen at
 * any scroll position and never extend past it. The light falls off in
 * eased steps over a large radius, so it reads as a soft haze, not as two
 * circles.
 */
:root .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
	background-image:
		radial-gradient(circle closest-side, color-mix(in srgb, var(--rowww-accent-end) 30%, transparent) 0%, color-mix(in srgb, var(--rowww-accent-end) 20%, transparent) 25%, color-mix(in srgb, var(--rowww-accent-end) 7%, transparent) 55%, color-mix(in srgb, var(--rowww-accent-end) 2%, transparent) 80%, transparent 100%),
		radial-gradient(circle closest-side, color-mix(in srgb, var(--rowww-accent-start) 28%, transparent) 0%, color-mix(in srgb, var(--rowww-accent-start) 19%, transparent) 25%, color-mix(in srgb, var(--rowww-accent-start) 6%, transparent) 55%, color-mix(in srgb, var(--rowww-accent-start) 2%, transparent) 80%, transparent 100%);
	background-repeat: no-repeat;
	background-position: right -75vmax top -75vmax, left -80vmax bottom -85vmax;
	background-size: 150vmax 150vmax;
}

@media (prefers-reduced-motion: no-preference) {

	:root .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
		animation: rowww-menu-glow 16s ease-in-out infinite alternate;
	}
}

@keyframes rowww-menu-glow {

	to {
		background-position: right -60vmax top -62vmax, left -66vmax bottom -72vmax;
	}
}