/* Nokwal RE - Apple-style menu bar, used on the "Nokwal - Full page" template and (setting
   "Use the menu bar on every page") site-wide in place of the theme's header.
   Translucent material, scroll-edge fade instead of a divider, dropdowns that drop from their
   item, full-screen sheet on phones. Everything is scoped to .gnh-nav / body.gn-site-nav. */

/* Accent defaults; Preferences → Agent & site → Accent colour prints an override after this file. */
:root { --gnh-tint: #0071e3; --gnh-tint-hover: #0077ed; --gnh-link: #0066cc; }

.gnh-nav {
	--gnh-label: var(--gnt-label);
	--gnh-label-2: var(--gnt-label-2);
	--gnh-label-3: var(--gnt-label-3);
	--gnh-font: var(--gnt-font);
	--gnh-ease-out: var(--gnt-ease-out);
	/* critically damped spring (damping 1.0, response .3s) as CSS easing; settles in ~445ms */
	--gnh-spring-03: linear(0, .058, .183, .325, .46, .578, .676, .755, .816, .864, .899, .926, .946, .961, .972, .98, .986, .99, .993, .995, .996, .997, .998, .999, 1);
	--gnh-spring-03-dur: 445ms;
	--gnh-gutter: clamp(20px, 4.5vw, 72px);
	--gnh-wrap-wide: 82rem;
	position: sticky; top: 0; z-index: var(--gnt-z-bar); height: 52px; margin: 0; isolation: isolate; background: transparent;
	font: 400 1rem/1.47 var(--gnh-font); letter-spacing: -.022em; color: var(--gnh-label); -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent;
}
@media (min-width: 2000px) { .gnh-nav { --gnh-wrap-wide: 92rem; } }
.gnh-nav *, .gnh-nav *::before, .gnh-nav *::after { box-sizing: border-box; }
.admin-bar .gnh-nav { top: 32px; }
@media (max-width: 782px) { .admin-bar .gnh-nav { top: 46px; } }
@media (max-width: 600px) { .admin-bar .gnh-nav { top: 0; } }
/* The glass lives on ::before so it can change shape without moving any layout: full-width at
   the top of the page; on wide screens it contracts into a floating pill once the page scrolls
   (clip-path only - the links never move). ::after is the edge shadow (phones) or the pill's
   hairline + soft shadow (wide screens), faded in with opacity. */
.gnh-nav::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: rgba(253, 252, 249, .72); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
	clip-path: inset(0 0 0 0 round 0); transition: clip-path .7s var(--gnt-ease-out); }
.gnh-nav::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 14px; pointer-events: none; opacity: 0; background: linear-gradient(rgba(60, 45, 20, .07), rgba(60, 45, 20, 0)); transition: opacity .3s var(--gnt-ease-out); }
.gnh-nav.is-scrolled::after { opacity: 1; }
@media (min-width: 961px) {
	.gnh-nav { --gnh-pill-x: max(8px, calc(max(var(--gnh-gutter), (100% - var(--gnh-wrap-wide)) / 2) - 18px)); }
	.gnh-nav.is-scrolled::before { clip-path: inset(6px var(--gnh-pill-x) 6px var(--gnh-pill-x) round 20px); }
	.gnh-nav::after { top: 6px; bottom: 6px; left: var(--gnh-pill-x); right: var(--gnh-pill-x); height: auto; border-radius: 20px; background: none;
		box-shadow: 0 0 0 1px var(--gnt-bezel-ring), 0 14px 34px -16px rgba(60, 45, 20, .3); transition: opacity .5s var(--gnt-ease-out) .1s; }
	.gnh-nav:not(.is-scrolled)::after { transition-delay: 0s; transition-duration: .2s; }
	/* 1.49.1: with the floating pill, the strip around it (top gap and sides) is softly blurred too, so the
	   page doesn't show sharp around the pill. Fades out over the last part of its height (no hard edge). */
	.gnh-nav-haze { position: absolute; inset: 0 0 -10px; z-index: -2; pointer-events: none; opacity: 0;
		background: rgba(253, 252, 249, .18); -webkit-backdrop-filter: blur(10px) saturate(140%); backdrop-filter: blur(10px) saturate(140%);
		-webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent);
		transition: opacity .5s var(--gnt-ease-out); }
	.gnh-nav.is-scrolled .gnh-nav-haze { opacity: 1; }
}
.gnh-nav-haze { display: none; }
@media (min-width: 961px) { .gnh-nav-haze { display: block; } }
.gnh-nav :focus-visible { outline: 3px solid rgba(0, 113, 227, .6); outline-offset: 3px; border-radius: 8px; }
.gnh-nav .gnh-wrap-wide { width: min(100% - 2 * var(--gnh-gutter), var(--gnh-wrap-wide)); margin-inline: auto; }
.gnh-nav-row { height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.gnh-nav .gnh-brand { font-weight: 600; font-size: 1.0625rem; color: var(--gnh-label); text-decoration: none; white-space: nowrap; }
.gnh-nav .gnh-brand span { color: var(--gnh-label-3); font-weight: 400; }
.gnh-skip { position: absolute; left: 12px; top: -60px; z-index: var(--gnt-z-skip); background: var(--gnt-label); color: #fff; padding: 10px 16px; border-radius: 10px; text-decoration: none; font-family: var(--gnt-font); }
.gnh-skip:focus { top: 12px; color: #fff; }

/* Links + button */
.gnh-links { display: flex; align-items: center; gap: 28px; min-width: 0; }
.gnh-menu { display: flex; align-items: center; gap: 26px; list-style: none; margin: 0; padding: 0; }
.gnh-menu li { position: relative; margin: 0; padding: 0; list-style: none; }
.gnh-menu li::before, .gnh-menu li::marker { content: none; }
.gnh-links a:not(.gnh-btn) { display: inline-flex; align-items: center; gap: 5px; font-size: .8125rem; line-height: 44px; letter-spacing: -.01em; color: rgba(0, 0, 0, .8); text-decoration: none; white-space: nowrap; transition: color .2s var(--gnt-ease-out), opacity 200ms var(--gnh-ease-out); }
.gnh-links a:not(.gnh-btn):hover { color: var(--gnh-label); text-decoration: none; }
.gnh-links a:not(.gnh-btn):active { opacity: .55; transition-duration: 0s; }
.gnh-menu .current-menu-item > a, .gnh-menu .current_page_item > a, .gnh-menu .current-menu-ancestor > a, .gnh-links a[aria-current] { color: var(--gnh-label); font-weight: 600; }
.gnh-nav .gnh-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 30px; padding: 0 14px; border: 0; border-radius: 980px; cursor: pointer;
	font: 400 .8125rem/1 var(--gnh-font); letter-spacing: -.01em; text-decoration: none; white-space: nowrap; background: var(--gnh-tint); color: #fff;
	transition: transform var(--gnh-spring-03-dur) var(--gnh-spring-03), background-color .2s var(--gnt-ease-out); }
.gnh-nav .gnh-btn:hover { background: var(--gnh-tint-hover); color: #fff; text-decoration: none; }
.gnh-nav .gnh-btn:active { transform: scale(.97); transition: transform 100ms var(--gnt-ease-out); }

/* Dropdowns: a solid rounded panel that drops from its item (a blur nested inside the blurred
   bar can't see the page behind it, so the panel is opaque). Entrance 150-180ms, instant close. */
.gnh-menu .menu-item-has-children > a::after { content: ""; width: .42em; height: .42em; border-right: 1.4px solid currentColor; border-bottom: 1.4px solid currentColor; transform: translateY(-2px) rotate(45deg); opacity: .6; transition: transform .2s var(--gnh-ease-out); }
.gnh-menu .sub-menu { position: absolute; top: calc(100% - 2px); left: -14px; min-width: 220px; margin: 0; padding: 6px; list-style: none; display: block;
	background: var(--gnt-bg); border-radius: 14px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .05), 0 16px 36px -10px rgba(0, 0, 0, .22);
	opacity: 0; visibility: hidden; transform: translateY(-4px) scale(.98); transform-origin: top left;
	transition: opacity 150ms var(--gnh-ease-out), transform 180ms var(--gnh-ease-out), visibility 0s linear 180ms; }
.gnh-menu .sub-menu .sub-menu { top: -6px; left: 100%; }
.gnh-menu li:hover > .sub-menu, .gnh-menu li:focus-within > .sub-menu, .gnh-menu li.is-open > .sub-menu { opacity: 1; visibility: visible; transform: none; transition: opacity 150ms var(--gnh-ease-out), transform 180ms var(--gnh-ease-out); }
.gnh-menu li:hover > a::after, .gnh-menu li.is-open > a::after { transform: translateY(1px) rotate(-135deg); }
.gnh-menu .sub-menu li { display: block; }
.gnh-links .sub-menu a:not(.gnh-btn) { display: flex; line-height: 1.3; padding: 9px 12px; border-radius: 9px; font-size: .8125rem; letter-spacing: -.01em; color: var(--gnh-label); white-space: normal; } /* same size as the menu headings (1.48.1) */
@media (hover: hover) and (pointer: fine) { .gnh-links .sub-menu a:not(.gnh-btn):hover { background: rgba(0, 0, 0, .045); } }
.gnh-links .sub-menu a:not(.gnh-btn):active { background: rgba(0, 0, 0, .08); opacity: 1; }
/* an invisible bridge so the panel doesn't close while the pointer travels down to it */
.gnh-menu .menu-item-has-children::after { content: ""; position: absolute; left: -14px; right: -14px; top: 100%; height: 8px; }

/* Menu toggle (phones) */
.gnh-menu-btn { display: none; width: 44px; height: 44px; margin-right: -10px; padding: 0; border: 0; background: none; cursor: pointer; color: var(--gnh-label); border-radius: 10px; }
.gnh-menu-btn svg line { transition: transform var(--gnh-spring-03-dur) var(--gnh-spring-03); transform-origin: center; }
.gnh-menu-btn[aria-expanded="true"] .l1 { transform: translateY(3.5px) rotate(45deg); }
.gnh-menu-btn[aria-expanded="true"] .l2 { transform: translateY(-3.5px) rotate(-45deg); }
@media (max-width: 960px) {
	.gnh-menu-btn { display: grid; place-items: center; }
	/* the sheet comes out from under the bar and leaves the same way; scrolls if the menu is long */
	.gnh-links { position: fixed; left: 0; right: 0; top: 52px; max-height: calc(100vh - 52px); max-height: calc(100dvh - 52px); overflow-y: auto; overscroll-behavior: contain;
		flex-direction: column; align-items: stretch; gap: 0; padding: 8px 32px calc(28px + env(safe-area-inset-bottom));
		background: var(--gnt-bg); box-shadow: 0 30px 40px -20px rgba(0, 0, 0, .12);
		transform: translateY(-12px); opacity: 0; visibility: hidden;
		transition: transform var(--gnh-spring-03-dur) var(--gnh-spring-03), opacity .2s var(--gnt-ease-out), visibility 0s linear var(--gnh-spring-03-dur); }
	.admin-bar .gnh-links { max-height: calc(100dvh - 98px); }
	.gnh-links.is-open { transform: none; opacity: 1; visibility: visible; transition: transform var(--gnh-spring-03-dur) var(--gnh-spring-03), opacity .2s var(--gnt-ease-out); }
	.gnh-menu { flex-direction: column; align-items: stretch; gap: 0; }
	.gnh-links a:not(.gnh-btn) { display: flex; font-size: 1.75rem; line-height: 1.14; letter-spacing: -.025em; font-weight: 600; padding: 10px 0; color: var(--gnh-label); white-space: normal; }
	.gnh-menu .menu-item-has-children > a::after, .gnh-menu .menu-item-has-children::after { display: none; }
	/* sub-items are listed under their parent, always visible */
	/* visibility: inherit (never "visible"): a child set to visible stays clickable inside the
	   hidden sheet, so invisible sub-menu links would sit over the page and swallow taps. */
	.gnh-menu .sub-menu,
	.gnh-menu li:hover > .sub-menu, .gnh-menu li:focus-within > .sub-menu, .gnh-menu li.is-open > .sub-menu { position: static; min-width: 0; padding: 0 0 8px 2px; background: none; box-shadow: none; border-radius: 0; opacity: 1; visibility: inherit; transform: none; transition: none; }
	.gnh-links .sub-menu a:not(.gnh-btn) { font-size: 1.125rem; font-weight: 500; letter-spacing: -.016em; padding: 8px 0; color: var(--gnh-label-2); background: none; }
	.gnh-nav .gnh-links .gnh-btn { margin-top: 18px; font-size: 1.0625rem; min-height: 48px; align-self: flex-start; padding: 0 28px; }
	/* Staggered reveal: the items rise into place one after another as the sheet opens.
	   Opacity/transform only; the sheet's own visibility still decides what is tappable. */
	.gnh-links .gnh-menu > li, .gnh-links > .gnh-acct, .gnh-links > .gnh-btn { opacity: 0; transform: translateY(16px);
		transition: opacity .2s var(--gnt-ease-out), transform .2s var(--gnt-ease-out); }
	.gnh-links.is-open .gnh-menu > li, .gnh-links.is-open > .gnh-acct, .gnh-links.is-open > .gnh-btn { opacity: 1; transform: none;
		transition: opacity .45s var(--gnt-ease-out), transform .6s var(--gnt-ease-out); transition-delay: calc(40ms + var(--gnh-i, 0) * 45ms); }
	.gnh-menu > li:nth-child(2) { --gnh-i: 1; } .gnh-menu > li:nth-child(3) { --gnh-i: 2; } .gnh-menu > li:nth-child(4) { --gnh-i: 3; }
	.gnh-menu > li:nth-child(5) { --gnh-i: 4; } .gnh-menu > li:nth-child(6) { --gnh-i: 5; } .gnh-menu > li:nth-child(7) { --gnh-i: 6; }
	.gnh-menu > li:nth-child(8) { --gnh-i: 7; } .gnh-menu > li:nth-child(n + 9) { --gnh-i: 8; }
	.gnh-links > .gnh-acct { --gnh-i: 8; } .gnh-links > .gnh-btn { --gnh-i: 9; }
}
@media (max-width: 960px) and (prefers-reduced-motion: reduce) {
	.gnh-links .gnh-menu > li, .gnh-links > .gnh-acct, .gnh-links > .gnh-btn { transform: none; transition: opacity .2s linear; }
}

/* Collapsible sections in the phone menu (1.48.0, setting "Phone menu: sub-menus"; nav.js adds
   .gnh-sub-collapsible and an arrow button per parent item). Wide screens keep the dropdowns. */
.gnh-sub-toggle { display: none; }
@media (max-width: 960px) {
	.gnh-sub-collapsible .gnh-menu .menu-item-has-children { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
	.gnh-sub-collapsible .gnh-menu .menu-item-has-children > .sub-menu { grid-column: 1 / -1; }
	.gnh-nav .gnh-sub-toggle {
		display: grid; place-items: center; width: 44px; height: 44px; margin: 0 -10px 0 8px; padding: 0; border: 0; border-radius: 12px;
		background: none; box-shadow: none; color: var(--gnh-label-2); cursor: pointer; -webkit-tap-highlight-color: transparent;
	}
	.gnh-nav .gnh-sub-toggle::before {
		content: ""; width: 10px; height: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
		transform: translateY(-3px) rotate(45deg); transition: transform .3s var(--gnt-ease-out);
	}
	.gnh-nav .gnh-sub-toggle:active { background: rgba(0, 0, 0, .06); }
	.gnh-nav .is-expanded > .gnh-sub-toggle::before { transform: translateY(2px) rotate(-135deg); }
	.gnh-nav .gnh-sub-toggle:focus-visible { outline: 2px solid var(--gnh-tint); outline-offset: 2px; }
	/* closed: no height and not tappable (visibility hidden, never "visible" - see the GOTCHA above) */
	.gnh-sub-collapsible .gnh-menu .menu-item-has-children > .sub-menu,
	.gnh-sub-collapsible .gnh-menu li:hover > .sub-menu, .gnh-sub-collapsible .gnh-menu li:focus-within > .sub-menu, .gnh-sub-collapsible .gnh-menu li.is-open > .sub-menu {
		max-height: 0; overflow: hidden; opacity: 0; visibility: hidden; padding-bottom: 0;
		transition: max-height .32s var(--gnt-ease-out), opacity .2s var(--gnt-ease-out), padding .32s var(--gnt-ease-out), visibility 0s linear .32s;
	}
	.gnh-sub-collapsible .gnh-menu li.is-expanded > .sub-menu {
		max-height: var(--gnh-sub-h, 60rem); opacity: 1; visibility: inherit; padding-bottom: 8px;
		transition: max-height .38s var(--gnt-ease-out), opacity .3s var(--gnt-ease-out) .05s, padding .38s var(--gnt-ease-out);
	}
}
@media (max-width: 960px) and (prefers-reduced-motion: reduce) {
	.gnh-sub-collapsible .gnh-menu .menu-item-has-children > .sub-menu, .gnh-sub-collapsible .gnh-menu li.is-expanded > .sub-menu, .gnh-nav .gnh-sub-toggle::before { transition: none; }
}

/* Footer: full-page template, the listing pages' own frame, and (setting "Footer on every
   page") every page in place of the theme's footer. Self-contained tokens so it looks the
   same inside any theme. */
.gnh-footer { --gnh-font: var(--gnt-font); --gnh-gutter: clamp(20px, 4.5vw, 72px); --gnh-wrap-wide: 82rem;
	clear: both; margin: 0; background: var(--gnt-bg-alt); color: var(--gnt-label-2); font: 400 .75rem/1.33 var(--gnh-font); letter-spacing: -.01em; padding: 22px 0 calc(24px + env(safe-area-inset-bottom)); -webkit-font-smoothing: antialiased; }
@media (min-width: 2000px) { .gnh-footer { --gnh-wrap-wide: 92rem; } }
.gnh-footer *, .gnh-footer *::before, .gnh-footer *::after { box-sizing: border-box; }
.gnh-footer .gnh-wrap-wide { width: min(100% - 2 * var(--gnh-gutter), var(--gnh-wrap-wide)); margin-inline: auto; }
.gnh-footer p { font-size: inherit; line-height: inherit; }
.gnh-foot-note { margin: 0; padding-bottom: 16px; border-bottom: 1px solid var(--gnt-line); color: var(--gnt-label-3); }
.gnh-foot-links { display: flex; flex-wrap: wrap; gap: 6px 22px; padding: 16px 0; }
.gnh-foot-links .gnh-menu { display: flex; flex-wrap: wrap; gap: 6px 22px; list-style: none; margin: 0; padding: 0; }
.gnh-foot-links li { margin: 0; padding: 0; list-style: none; }
.gnh-foot-links li::before, .gnh-foot-links li::marker { content: none; }
.gnh-footer a { color: #424245; text-decoration: none; }
.gnh-footer a:hover { color: var(--gnt-label); text-decoration: underline; }
.gnh-footer :focus-visible { outline: 3px solid rgba(0, 113, 227, .6); outline-offset: 2px; border-radius: 4px; }
.gnh-foot-legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; padding-top: 16px; border-top: 1px solid var(--gnt-line); }
.gnh-foot-agent strong { color: #424245; font-weight: 600; }

/* Own frame (listing pages in block themes): a plain canvas, footer at the bottom */
body.gn-own-frame { margin: 0; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
body.gn-own-frame > #gnh-main { flex: 1 0 auto; width: 100%; }

/* Site-wide: hide the theme's own footer when the plugin footer replaces it */
body.gn-site-footer:has(.gnh-footer) #colophon:not(.gnh-footer),
body.gn-site-footer:has(.gnh-footer) .site-footer:not(.gnh-footer),
body.gn-site-footer:has(.gnh-footer) footer.wp-block-template-part { display: none !important; }

/* Site-wide: hide the theme's own header when the menu bar replaces it */
body.gn-site-nav:has(.gnh-nav) #masthead,
body.gn-site-nav:has(.gnh-nav) #mobile-header,
body.gn-site-nav:has(.gnh-nav) .site-header:not(.gnh-nav),
body.gn-site-nav:has(.gnh-nav) header.wp-block-template-part { display: none !important; }

@media (prefers-reduced-motion: reduce) {
	.gnh-nav, .gnh-nav * { transition-property: opacity, color, background-color !important; }
	.gnh-menu .sub-menu { transform: none; }
}
@media (prefers-reduced-transparency: reduce) {
	.gnh-nav::before { background: var(--gnt-bg); -webkit-backdrop-filter: none; backdrop-filter: none; }
	.gnh-nav .gnh-nav-haze { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.gnh-nav::before { transition: none; }
}
@media (prefers-contrast: more) {
	.gnh-nav::before { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
	.gnh-nav { border-bottom: 1px solid var(--gnt-label); }
	.gnh-nav.is-scrolled::before { clip-path: none; }
	.gnh-nav::after { display: none; }
	.gnh-nav .gnh-nav-haze { display: none; }
	.gnh-links a:not(.gnh-btn) { color: #000; }
}

/* Phone numbers / emails in the footer never break across lines (a split link's tap target spans two lines). */
.gnh-foot-agent a { white-space: nowrap; }