/* Standalone Flask pages do not load a compiled storefront bundle. Supply
   the same tokens here without importing global component rules after their
   page stylesheet; doing so would reverse page-specific contrast choices. */
@import url("/site-header-tokens.css?v=20260802-brand-gap");
.skip-link{position:fixed;z-index:1000;top:10px;left:12px;transform:translateY(-160%);border:2px solid var(--color-forest-700);border-radius:var(--radius-field);background:var(--color-paper);color:var(--color-forest-700);padding:10px 14px;font:800 13px/1 "Funnel Sans",Arial,sans-serif;text-decoration:none;transition:transform .16s ease}.skip-link:focus-visible{transform:translateY(0);outline:2px solid var(--color-forest-700);outline-offset:2px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
/* Shared public-site header: every customer-facing page follows this rhythm. */
.roamnessa-site-header{box-sizing:border-box;direction:ltr;position:sticky;top:0;z-index:100;width:100%;max-width:none;height:auto;min-height:80px;margin:0;display:grid;grid-template-columns:max-content minmax(0,1fr) max-content;align-items:center;justify-content:normal;column-gap:32px;padding:16px max(24px,calc((100vw - 1180px)/2));background:var(--color-cream);border:0;overflow:visible}
.roamnessa-site-header .brand,.roamnessa-site-header .reviews-brand,.roamnessa-site-header .account-brand{display:inline-flex;flex:0 0 auto;align-items:center;gap:var(--brand-wordmark-gap);color:var(--color-ink-900);font:800 italic 17px/1 "Funnel Sans",Arial,sans-serif;letter-spacing:-.8px;text-decoration:none}
.roamnessa-site-header .brand img,.roamnessa-site-header .reviews-brand img,.roamnessa-site-header .account-brand img,.roamnessa-site-header .brand-mark{width:var(--brand-mark-size);height:var(--brand-mark-size);flex:0 0 var(--brand-mark-size);object-fit:contain;border-radius:0;background:transparent;margin:0}
.roamnessa-site-header nav{display:flex;align-items:center;justify-content:center;justify-self:center;gap:28px;margin:0}
.roamnessa-site-header nav a{color:var(--color-ink-900);font:700 14px/1.25 "Funnel Sans",Arial,sans-serif;text-decoration:none;white-space:nowrap}
.roamnessa-site-header nav a:hover,.roamnessa-site-header nav a:focus-visible,.roamnessa-site-header nav a[aria-current="page"]{color:var(--color-forest-700);text-decoration:underline;text-decoration-color:var(--color-leaf-400);text-decoration-thickness:2px;text-underline-offset:5px}
.roamnessa-site-header .nav-actions,.roamnessa-site-header .cart-header-actions{display:flex;align-items:center;justify-self:end;gap:12px}
.roamnessa-site-header .nav-actions .support{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 16px;border:1px solid var(--color-forest-700);border-radius:var(--radius-button);background:transparent;color:var(--color-ink-900);font:700 14px/1 "Funnel Sans",Arial,sans-serif;text-decoration:none;white-space:nowrap}
.roamnessa-site-header .nav-actions .support:hover,.roamnessa-site-header .nav-actions .support:focus-visible{background:var(--color-paper);border-color:var(--color-ink-900);color:var(--color-ink-900);outline:0}
.roamnessa-site-header .nav-actions .support span{margin-left:6px;font-size:16px;line-height:1}
/* The middle track is the real space between the logo and action group. The
   primary navigation is centered inside that track on every desktop page. */
@media(min-width:961px) and (max-width:1220px){
  .roamnessa-site-header{gap:20px;padding-left:24px;padding-right:24px}
  .roamnessa-site-header nav{gap:18px}
  .roamnessa-site-header .nav-actions{gap:8px}
  .roamnessa-site-header .nav-actions .support{min-height:40px;padding-left:12px;padding-right:12px;font-size:13px}
}
/* Tablet and mobile use the intentionally compact header; this is the only
   range where primary navigation is hidden. */
@media(min-width:761px) and (max-width:960px){.roamnessa-site-header{display:flex}.roamnessa-site-header>nav{display:none}.roamnessa-site-header .nav-actions{margin-left:auto}.roamnessa-site-header .nav-actions .support:not(.cart-link){display:none}}
@media(max-width:760px){.roamnessa-site-header{display:flex;min-height:64px;gap:14px;padding:12px 18px}.roamnessa-site-header .brand,.roamnessa-site-header .reviews-brand,.roamnessa-site-header .account-brand{gap:var(--brand-wordmark-gap);font-size:16px}.roamnessa-site-header .brand img,.roamnessa-site-header .reviews-brand img,.roamnessa-site-header .account-brand img,.roamnessa-site-header .brand-mark{width:var(--brand-mark-size);height:var(--brand-mark-size);flex-basis:var(--brand-mark-size)}.roamnessa-site-header>nav{display:none}.roamnessa-site-header .nav-actions{margin-left:auto;gap:8px}.roamnessa-site-header .nav-actions .support:not(.cart-link){display:none}.roamnessa-site-header .nav-actions .cart-link,.roamnessa-site-header .mobile-menu-trigger{box-sizing:border-box;inline-size:80px;height:42px;min-height:42px;padding:0 8px;font:700 14px/1 "Funnel Sans",Arial,sans-serif}.roamnessa-site-header .mobile-menu-trigger{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--color-forest-700);border-radius:var(--radius-button);background:transparent;color:var(--color-ink-900);cursor:pointer}.roamnessa-site-header .mobile-menu-trigger>span:first-child{font-size:15px;line-height:1}}
@media(max-width:360px){.roamnessa-site-header .nav-actions .cart-link,.roamnessa-site-header .mobile-menu-trigger{inline-size:76px;font-size:13px}}
