/* Shared navigation, scoped so page content and the homepage keep their styles. */
.pf-header {
  box-sizing: border-box;
  width: 100%;
  max-width: 1250px;
  margin: 0 auto;
  padding: 0 32px;
  background: #f5efdf;
  color: #352a22;
}
.pf-header .pf-navigation {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  margin: 0;
  padding: 24px 0;
  border: 0;
  border-bottom: 1px solid #ded3bd;
  border-radius: 0;
  background: transparent;
  font: 13px/1.55 system-ui, sans-serif;
  text-align: left;
}
.pf-navigation .pf-brand { display: block; grid-column: 2; letter-spacing: 2px; font-weight: 700; text-align: center; }
.pf-navigation a { color: #762f3c; text-decoration: underline; background: transparent; }
.pf-navigation .pf-home { justify-self: start; }
.pf-navigation .pf-section { grid-column: 3; justify-self: end; text-align: right; }
.pf-navigation a:hover { color: #54212b; text-decoration-thickness: 2px; }
.pf-navigation a:focus-visible { outline: 3px solid #a58043; outline-offset: 4px; }
@media (max-width: 900px) { .pf-header { padding: 0 18px; } }
@media (max-width: 680px) {
  .pf-header .pf-navigation { grid-template-columns: 1fr 1fr; gap: 12px; }
  .pf-navigation .pf-brand { display: none; }
  .pf-navigation .pf-section { grid-column: 2; }
}
@media print { .pf-header { display: none; } }
