/* One navigation surface across public pages and the older commerce layouts. */
:root {
  --mf-nav-bg: #211a2a; --mf-nav-ink: #fff3e4; --mf-nav-line: #665269; --mf-nav-accent: #ff967d;
}
:root[data-fuego-theme="poolside"] {
  --mf-nav-bg: #e4f2ed; --mf-nav-ink: #173e40; --mf-nav-line: #93b7ac; --mf-nav-accent: #a33832;
}
:root[data-fuego-theme="printshop"] {
  --mf-nav-bg: #f7da57; --mf-nav-ink: #292036; --mf-nav-line: #967235; --mf-nav-accent: #812b38;
}
/* New looks share the existing navigation grid and font metrics. */
:root[data-fuego-theme="neonveranda"] {
  --mf-nav-bg: #12393e; --mf-nav-ink: #f2f3d9; --mf-nav-line: #67958e; --mf-nav-accent: #ffa18b;
}
:root[data-fuego-theme="paperstudio"] {
  --mf-nav-bg: #ded8cd; --mf-nav-ink: #283353; --mf-nav-line: #828493; --mf-nav-accent: #943d51;
}
.mf-site-header {
  position: relative; z-index: 20; display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center; gap: 26px; width: 100%; max-width: 1440px; margin: 0 auto; padding: 26px 64px;
  color: var(--mf-nav-ink); background: var(--mf-nav-bg); border: 0; border-bottom: 1px solid var(--mf-nav-line);
  border-radius: 0; font-family: Barlow, Arial, sans-serif;
}
.mf-site-header [hidden] { display: none !important; }
/* Older catalog layouts must use the shared header palette as well. */
.mf-catalog .mf-site-header { background: var(--mf-nav-bg); }
.mf-site-header .mf-site-brand {
  display: block; min-height: 48px; color: var(--mf-nav-ink); font: 800 28px/.78 'Barlow Condensed', sans-serif;
  letter-spacing: -.03em; text-decoration: none; text-transform: none; text-shadow: none; transform: none;
}
.mf-site-header .mf-site-brand > span { display: block; margin-top: 5px; }
.mf-site-header .mf-dot { color: var(--mf-nav-accent); margin-left: 3px; }
.mf-site-header .mf-site-primary {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 12px;
  min-width: 0; width: auto; padding: 0; border: 0; order: initial;
}
.mf-site-header .mf-site-primary > a,
.mf-site-header .mf-site-utilities > a {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-width: 44px; min-height: 44px;
  padding: 10px 8px; color: var(--mf-nav-ink); font: 600 15px/1.2 Barlow, Arial, sans-serif;
  letter-spacing: normal; text-transform: none; text-decoration: none; white-space: nowrap;
  border: 1px solid transparent; border-radius: 2px; box-sizing: border-box;
}
.mf-site-header .mf-site-primary > a:hover,
.mf-site-header .mf-site-primary > a[aria-current] {
  color: var(--mf-nav-accent); text-decoration: underline; text-underline-offset: 7px; text-decoration-thickness: 2px;
}
.mf-site-header .mf-site-utilities { display: flex; gap: 8px; align-items: center; justify-content: flex-end; }
.mf-site-header .mf-site-utilities > a { font-size: 14px; padding-inline: 12px; border-color: var(--mf-nav-line); border-radius: var(--mf-radius, 2px); }
.mf-site-header [data-site-account] { min-width: 80px; }
.mf-site-header [data-site-cart] { min-width: 64px; }
.mf-site-header .mf-site-utilities > a:hover,
.mf-site-header .mf-site-utilities > a[aria-current] { border-color: var(--mf-nav-ink); box-shadow: inset 0 0 0 1px var(--mf-nav-ink); }
.mf-site-header [data-cart-count] {
  display: inline-flex; align-items: center; justify-content: center; min-width: 19px; min-height: 19px; margin: 0; padding: 1px 4px;
  border-radius: 20px; background: var(--mf-nav-ink); color: var(--mf-nav-bg); font-size: 11px; font-variant-numeric: tabular-nums;
}
.mf-site-header a:focus-visible { outline: 3px solid var(--mf-nav-accent); outline-offset: 3px; box-shadow: none; }
@media (max-width: 1000px) {
  .mf-site-header { padding-inline: 32px; gap: 18px; }
}
@media (max-width: 900px) {
  .mf-site-header { grid-template-columns: minmax(0, 1fr) auto; padding-block: 20px; gap: 12px 18px; }
  .mf-site-header .mf-site-brand { grid-column: 1; grid-row: 1; justify-self: start; }
  .mf-site-header .mf-site-utilities { grid-column: 2; grid-row: 1; }
  .mf-site-header .mf-site-primary { grid-column: 1 / -1; grid-row: 2; padding-top: 10px; border-top: 1px solid var(--mf-nav-line); }
}
@media (max-width: 600px) {
  .mf-site-header { padding: 20px; gap: 12px; }
  .mf-site-header .mf-site-brand { font-size: 26px; }
  .mf-site-header .mf-site-utilities { gap: 6px; }
  .mf-site-header .mf-site-primary { justify-content: space-between; gap: 4px; }
  .mf-site-header .mf-site-primary > a { font-size: 14px; padding-inline: 7px; }
  .mf-site-header .mf-site-utilities > a { padding-inline: 10px; }
  .mf-site-header [data-site-account] { min-width: 76px; }
}

/* A small, static Fuego printer's mark, outside the wordmark's layout box. */
.mf-site-header .mf-site-brand { position: relative; }
.mf-site-header .mf-site-brand::after {
  content: ""; position: absolute; left: calc(100% + 7px); top: 5px; width: 18px; height: 18px;
  background: var(--mf-nav-accent); pointer-events: none;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='32' cy='32' r='23'/%3E%3Cpath d='M32 3V9M32 55V61M3 32H9M55 32H61M11.5 11.5L16 16M48 48L52.5 52.5M11.5 52.5L16 48M48 16L52.5 11.5'/%3E%3C/g%3E%3Cpath fill='black' fill-rule='evenodd' d='M33 14C36 24 46 29 44 38C43 46 36 51 29 47C20 44 18 37 23 30C24 34 26 35 28 35C25 25 31 22 33 14ZM33 33C32 37 28 39 29 42C30 45 35 45 36 42C37 38 34 37 33 33Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='32' cy='32' r='23'/%3E%3Cpath d='M32 3V9M32 55V61M3 32H9M55 32H61M11.5 11.5L16 16M48 48L52.5 52.5M11.5 52.5L16 48M48 16L52.5 11.5'/%3E%3C/g%3E%3Cpath fill='black' fill-rule='evenodd' d='M33 14C36 24 46 29 44 38C43 46 36 51 29 47C20 44 18 37 23 30C24 34 26 35 28 35C25 25 31 22 33 14ZM33 33C32 37 28 39 29 42C30 45 35 45 36 42C37 38 34 37 33 33Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
