/* =============================================================
   NICHENCY — HEADER
   layout/header.css
   ============================================================= */

/* ── SITE HEADER ── */
.site-header { padding: 20px 40px; border-bottom: 1px solid var(--border); background: var(--white); margin-bottom: 0 !important; position: sticky; top: 0; z-index: 1000; }

/* Gap fix: kill all WordPress wrapper spacing between header and first hero section */
#masthead { margin-bottom: 0 !important; padding-bottom: 0 !important; }
#content, .site-content, .site-main { margin-top: 0 !important; padding-top: 0 !important; }
.entry-content, .wp-block-post-content, .hentry, .type-page { margin-top: 0 !important; padding-top: 0 !important; }
.site-main > *:first-child, .entry-content > *:first-child { margin-top: 0 !important; padding-top: 0 !important; }
/* On single posts, strip all WordPress wrapper padding so .article-wrap is the sole layout constraint */
.single-post .hentry,
.single-post .entry-content,
.single-post .site-main { padding: 0 !important; margin: 0 !important; max-width: 100% !important; width: 100% !important; }
/* Kill the <p> tag wpautop generates from HTML comments at the top of editor content */
.entry-content > p:first-child:empty,
.entry-content > p:first-child:not(:has(*)) { display: none !important; margin: 0 !important; padding: 0 !important; }
.page-content > p:first-child:empty { display: none !important; }
.site-main p:empty { display: none !important; margin: 0 !important; }

.header-inner { max-width: var(--max); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
.site-title-link { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 1.2rem; color: var(--dark-blue); text-decoration: none; }

/* Custom logo — constrains any image uploaded via Appearance → Customize → Site Identity */
.site-branding { flex-shrink: 0; }
.custom-logo-link { display: flex; align-items: center; text-decoration: none !important; }
.custom-logo-link img,
.custom-logo-link .custom-logo {
  height: 44px;
  width: auto;
  max-width: 200px;
  display: block;
  object-fit: contain;
}

/* ── HAMBURGER MENU ──
   Base .nav-toggle rules live in components/navigation.css
   Only the open/close animation states are retained here for proximity to header context */
/* Animate to X when open */
.nav-toggle.is-open span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

/* ── RESPONSIVE — 900px ── */
@media screen and (max-width: 900px) {
  .site-header { padding: 16px 24px; }
}

/* ── RESPONSIVE — 600px ── */
@media screen and (max-width: 600px) {
  .site-header { padding: 14px 20px; }
}