/* Header-owned selectors only; WooCommerce owns its cart drawer. */
.es-header-shell { display: contents; }
.wp-site-blocks > header:has(.es-header-shell) { display: contents; }
.es-announcement { box-sizing: border-box; text-align: center; max-width: none; width: 100%; margin: 0 !important; padding: .55rem 1rem; background: #202020; color: #fff; font-size: .75rem; letter-spacing: .04em; line-height: 1.5; }
.es-announcement a { color: inherit; text-underline-offset: .2em; }
.es-header { --es-line: #e5e3df; --es-gutter: clamp(1rem, 4vw, 4rem); position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 100; margin: 0 !important; background: #fff; color: #202020; border-bottom: 1px solid var(--es-line); font-family: var(--wp--preset--font-family--system-sans, sans-serif); }
.es-header *, .es-header *::before, .es-header *::after { box-sizing: border-box; }
.es-header :where(button,input) { font: inherit; }
.es-header :where(button,a) { -webkit-tap-highlight-color: transparent; }
.es-header :where(button) { cursor: pointer; }
.es-header :where(a) { color: inherit; text-decoration: none; }
.es-header :where(button) { border: 0; border-radius: 0; background: transparent; color: inherit; }
.es-header :where(a,button,input,summary):focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.es-header [hidden] { display: none !important; }
.es-toolbar { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 2rem; max-width: 1600px; margin: auto; padding: 1.5rem var(--es-gutter); }
.es-brand { grid-column: 2; grid-row: 1; width: clamp(150px, 15vw, 220px); text-align: center; }
.es-brand a { display: block; font-size: 1.3rem; font-weight: 600; line-height: 1.2; }
.es-brand img { display: block; width: 100%; height: 48px; object-fit: contain; }
.es-actions { grid-column: 3; grid-row: 1; display: flex; align-items: center; justify-content: flex-end; gap: 1.25rem; }
.es-actions > a { display: grid; place-items: center; width: 44px; height: 44px; }
.es-actions .wc-block-mini-cart__button { min-width: 44px; min-height: 44px; padding: .5rem; color: inherit; }
.es-search { position: relative; grid-column: 1; grid-row: 1; display: flex; align-items: center; max-width: 420px; min-width: 0; background: #f4f3f1; color: #202020; border: 1px solid transparent; border-radius: 2px; }
.es-search:focus-within { border-color: #777; }
.es-search input[type=search] { width: 100%; min-width: 0; height: 44px; padding: .65rem .8rem; border: none; border-radius: 0; background: transparent; color: inherit; font-size: .875rem; }
.es-search > button { display: grid; place-items: center; flex: 0 0 44px; height: 44px; padding: .5rem; }
.es-search input::placeholder { color: #666; opacity: 1; }
.es-search-results { position: absolute; inset: calc(100% + 8px) 0 auto; max-height: min(65dvh, 600px); overflow: auto; padding: 1rem; background: #fff; color: #202020; border: 1px solid var(--es-line); z-index: 4; }
.es-search-results ul { list-style: none; margin: 0; padding: 0; }
.es-search-results a { display: flex; align-items: center; gap: .75rem; padding: .75rem 0; border-bottom: 1px solid var(--es-line); font-size: .875rem; }
.es-search-results img { width: 48px; height: 48px; object-fit: contain; }
.es-search-results p { margin: 0; font-size: .8rem; }
.es-search-results button { margin-top: .75rem; min-height: 44px; text-decoration: underline; text-underline-offset: .25em; }
.es-navigation { padding-inline: var(--es-gutter); }
.es-roots { display: flex; justify-content: center; gap: clamp(1rem, 4vw, 4rem); list-style: none; margin: 0; padding: 0; }
.es-root-trigger,.es-root-link { display: block; padding: .85rem 0 1rem; min-height: 44px; font-size: .9375rem; font-weight: 500; white-space: nowrap; }
.es-root-trigger[aria-expanded=true] { text-decoration: underline; text-underline-offset: .55em; }
.es-panel { position: absolute; top: 100%; left: 0; right: 0; max-height: calc(100dvh - 170px); overflow: auto; padding: 1.5rem var(--es-gutter) 2.5rem; background: #fff; color: #202020; border-bottom: 1px solid var(--es-line); overscroll-behavior: contain; z-index: 2; }
.es-panel > .es-links { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1.5rem; max-width: 1480px; margin: auto; }
.es-links { list-style: none; padding: 0; margin: 0; }
.es-links .es-links { padding-left: 1rem; }
.es-links li { min-width: 0; }
.es-links :where(a,summary,.es-group-label) { display: flex; align-items: center; gap: .8rem; padding: .8rem 0; font-size: .875rem; line-height: 1.5; min-height: 44px; }
.es-links a:hover span { text-decoration: underline; text-underline-offset: .25em; }
.es-links img { flex-shrink: 0; width: 80px; height: 60px; object-fit: contain; }
.es-group summary { cursor: pointer; list-style: none; border-bottom: 1px solid var(--es-line); }
.es-group summary::-webkit-details-marker { display: none; }
.es-group summary::after { content: '+'; margin-left: auto; padding-inline: .5rem; }
.es-group[open] > summary::after { content: '−'; }
.es-view-all { display: block; max-width: 1480px; margin: 0 auto 1rem; padding-block: .75rem; font-size: .8rem; text-decoration: underline !important; text-underline-offset: .25em; }
.es-group .es-view-all { margin: 0; }
.es-backdrop { position: absolute; inset: 0; top: 100%; width: 100%; height: 100dvh; background: rgb(0 0 0 / .25) !important; backdrop-filter: blur(2px); z-index: 1; }
.es-menu-toggle,.es-drawer-links,.es-back { display: none; }
/* Navigation still works without the controller. */
.es-header:not(.es-ready) .es-panel { display: none; }
.es-header:not(.es-ready) .es-root:focus-within > .es-panel,.es-header:not(.es-ready) .es-root:hover > .es-panel { display: block; }
.es-header.es-transparent:not(.es-nav-open):not(:focus-within) { background: rgb(0 0 0 / .65); color: #fff; border-bottom-color: transparent; }
.es-header.es-transparent:not(.es-nav-open):not(:focus-within) .es-brand img { filter: brightness(0) invert(1); }
body.es-navigation-locked { overflow: hidden; }
@media (max-width: 900px) {
 .es-toolbar { grid-template-columns: 44px minmax(0,1fr) 88px; gap: .5rem; padding: 1rem; }
 .es-brand { width: min(100%, 180px); justify-self: center; }
 .es-brand img { height: 40px; }
 .es-actions { gap: 0; }
 .es-actions > a { width: 40px; }
 .es-menu-toggle { display: grid; place-items: center; grid-column: 1; grid-row: 1; width: 44px; height: 44px; padding: .6rem; }
 .es-close-icon { display: none; }
 .es-search { grid-column: 1 / -1; grid-row: 2; max-width: none; margin-top: .75rem; }
 .es-navigation { padding: 0; }
 .es-ready:not(.es-mobile-open) .es-navigation { display: none; }
 .es-header.es-mobile-open { position: fixed; inset: var(--wp-admin--admin-bar--height, 0px) 0 0; height: auto; display: flex; flex-direction: column; background: #fff; color: #202020; }
 .es-mobile-open .es-open-icon { display: none; }
 .es-mobile-open .es-close-icon { display: block; }
 .es-mobile-open .es-toolbar { width: 100%; margin: 0; flex-shrink: 0; }
 .es-mobile-open .es-navigation { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; border-top: 1px solid var(--es-line); }
 .es-roots { position: relative; display: grid; grid-template-columns: minmax(100px,32%) minmax(0,1fr); gap: 0; align-content: start; min-height: 100%; }
 .es-root { display: contents; }
 .es-root > :is(.es-root-trigger,.es-root-link) { grid-column: 1; padding: 1rem .75rem; white-space: normal; text-align: left; font-size: .9375rem; border-right: 1px solid var(--es-line); }
 .es-root-trigger[aria-expanded=true] { background: #f4f3f1; font-weight: 600; text-decoration: none; }
 .es-panel { top: 0; left: 32%; bottom: 0; right: 0; max-height: none; padding: 0 1rem max(2rem, env(safe-area-inset-bottom)); border-left: 1px solid var(--es-line); border-bottom: 0; }
 .es-panel > .es-links { display: block; }
 .es-panel > .es-links > li { border-bottom: 1px solid var(--es-line); }
 .es-links :where(a,summary) { font-size: .9375rem; }
 .es-links img { width: 56px; height: 48px; }
 .es-view-all { margin: 0; padding-block: 1.25rem; border-bottom: 1px solid var(--es-line); }
 .es-drawer-links { display: flex; position: sticky; z-index: 3; bottom: 0; gap: 1rem; padding: .75rem 1rem max(.75rem, env(safe-area-inset-bottom)); border-top: 1px solid var(--es-line); background: #fff; }
 .es-drawer-links a { padding: .5rem; font-size: .9375rem; min-height: 44px; }
 .es-backdrop { display: none; }
 .es-header:not(.es-ready) .es-roots { display: block; }
 .es-header:not(.es-ready) .es-root { display: block; }
 .es-header:not(.es-ready) .es-panel { position: static; }
}
@media (max-width: 359px) {
 .es-actions > a { display: none; }
 .es-toolbar { grid-template-columns: 44px minmax(0,1fr) 44px; }
 .es-roots { display: block; }
 .es-root { display: block; }
 .es-panel { position: static; }
 .es-drilled .es-root:not(.es-selected) { display: none; }
 .es-drilled .es-selected > .es-root-trigger { display: none; }
 .es-drilled .es-back { display: block; width: 100%; min-height: 44px; padding: 1rem; text-align: left; border-bottom: 1px solid var(--es-line); }
}
@media (prefers-reduced-motion: no-preference) {
 .es-header { transition: background-color .15s, color .15s; }
 .es-root-trigger { transition: color .15s; }
}

/* A homepage explicitly beginning with the supported hero can opt into overlap. */
/* Grid overlap is established by CSS before paint: no measured negative margin. */
body.home:has(main .wp-block-post-content > .es-header-hero) .wp-site-blocks { display: grid; grid-template-columns: minmax(0,1fr); }
body.home:has(main .wp-block-post-content > .es-header-hero) .es-announcement { grid-column: 1; grid-row: 1; }
body.home:has(main .wp-block-post-content > .es-header-hero) .es-header { grid-column: 1; grid-row: 2; align-self: start; }
body.home:has(main .wp-block-post-content > .es-header-hero) .wp-site-blocks > main { grid-column: 1; grid-row: 2; margin-top: 0; padding-top: 0; }
body.home:has(main .wp-block-post-content > .es-header-hero) .wp-site-blocks > footer { grid-column: 1; grid-row: 3; }
@media (max-width: 900px) {
 .es-brand { position: absolute; left: 50%; transform: translateX(-50%); top: 1rem; width: min(42vw,180px); }
}

@media (min-width: 901px) and (max-width: 1100px) { .es-panel > .es-links { grid-template-columns: repeat(3,minmax(0,1fr)); } }
