/* TeraiFarms — unified site header
   Single source of truth for the masthead on every page.
   Token-agnostic: falls back across the --tf-*, --forest/--ink and legal
   --paddy/--ivory sets so one component works on all four page templates. */

.tfhdr{
  position: sticky; top: 0; z-index: 60;
  background: var(--tf-paper, var(--paper, var(--ivory, #E9EDE3)));
  border-bottom: 1px solid var(--tf-line-soft, var(--line, #C0C9B2));
}
.tfhdr-in{
  max-width: 1180px; margin: 0 auto; height: 72px;
  display: flex; align-items: center; gap: 16px;
  padding: 0 clamp(16px, 4vw, 24px);
}

.tfhdr-logo{ display: flex; align-items: center; text-decoration: none; flex-shrink: 0; }
.tfhdr-logo img{ height: 30px; width: auto; display: block; }

.tfhdr-links{ display: none; gap: 24px; font-size: 14px; font-weight: 500; }
.tfhdr-links a{
  color: var(--tf-ink-soft, var(--ink-soft, #4A423A));
  text-decoration: none; display: flex; align-items: center; min-height: 44px;
}
.tfhdr-links a:hover{
  color: var(--tf-forest, var(--forest, var(--paddy, #2F6B41)));
  text-decoration: none;
}
.tfhdr-links a[aria-current="page"]{
  color: var(--tf-forest, var(--forest, var(--paddy, #2F6B41))); font-weight: 600;
}

.tfhdr-right{ margin-left: auto; display: flex; align-items: center; gap: 8px; }

.tfhdr-ic{
  display: none; width: 40px; height: 40px;
  align-items: center; justify-content: center; text-decoration: none;
  color: var(--tf-ink-soft, var(--ink-soft, #4A423A));
  border-radius: 8px; transition: background .15s, color .15s;
}
.tfhdr-ic svg{ width: 21px; height: 21px; display: block; }
.tfhdr-ic:hover{
  background: var(--tf-cream, var(--cream, var(--ivory-2, #F4F1E7)));
  color: var(--tf-forest, var(--forest, var(--paddy, #2F6B41)));
}

.tfhdr-buy{
  display: none; align-items: center; min-height: 44px; padding: 0 18px;
  background: var(--tf-forest, var(--forest, var(--paddy, #2F6B41)));
  color: #FFFFFF; font-size: 14px; font-weight: 600;
  border-radius: 4px; text-decoration: none; white-space: nowrap;
  transition: background .15s;
}
.tfhdr-buy:hover{
  background: var(--tf-forest-deep, var(--forest-deep, #16241B));
  color: #FFFFFF; text-decoration: none;
}
.tfhdr-buy:active{ transform: translateY(1px); }

.tfhdr-menu{
  background: none; border: 0; font-size: 22px; line-height: 1; cursor: pointer;
  color: var(--tf-ink, var(--ink, #382820));
  min-height: 44px; min-width: 44px;
  display: flex; align-items: center; justify-content: center;
}

.tfhdr a:focus-visible, .tfhdr button:focus-visible{
  outline: 2px solid var(--tf-gold, var(--gold, #B8862F)); outline-offset: 2px;
}

@media (max-width: 767px){
  .tfhdr-links{
    position: absolute; top: 72px; left: 0; right: 0;
    flex-direction: column; gap: 0;
    background: var(--tf-paper, var(--paper, var(--ivory, #E9EDE3)));
    border-bottom: 1px solid var(--tf-line-soft, var(--line, #C0C9B2));
    padding: 8px clamp(16px, 4vw, 24px);
  }
}
@media (min-width: 768px){
  .tfhdr-links{ display: flex; }
  .tfhdr-ic{ display: flex; }
  .tfhdr-buy{ display: inline-flex; }
  .tfhdr-menu{ display: none; }
}
@media (prefers-reduced-motion: reduce){
  .tfhdr-ic, .tfhdr-buy{ transition: none; }
  .tfhdr-buy:active{ transform: none; }
}