/* ══════════════════════════════════════════════════════════
   LAYOUT — header, navigation, content area, footer
   (former Additional CSS sections 3, 4, 12)

   These rules previously targeted Kadence-generated markup:
     #masthead, .kadence-sticky-header, .kadence-site-title,
     #site-navigation, .kadence-navigation, #colophon
   The theme now authors this markup itself (header.php /
   footer.php), so the selectors below are theme-owned:
     .ks-header, .ks-brand, .ks-nav, .ks-footer
   Visual values are unchanged.
   ══════════════════════════════════════════════════════════ */

/* ── Site header ─────────────────────────────────────────── */

.ks-header {
  background-color: var(--paper);
  border-bottom: 1px solid var(--rule);
  box-shadow: none;
  position: sticky;   /* matches previous Kadence sticky-header behavior;
                         delete these two lines for a static header */
  top: 0;
  z-index: 50;
}

.ks-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: 1.1rem 3rem;
}

/* Site title — serves as the home link (no "Home" nav item) */
.ks-brand,
.ks-brand a {
  font-family: var(--mono);
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
}

/* Hover signals the title is the home link (no "Home" nav item).
   Replaces the a.brand:hover / .site-title workaround you built
   for Kadence's nested-<p> DOM — here the title IS the link, so
   one plain rule does it. */
.ks-brand a:hover {
  color: var(--accent);
}

/* Primary navigation */
.ks-nav ul {
  display: flex;
  gap: 1.75rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ks-nav a {
  font-family: var(--mono);
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mid);
  text-decoration: none;
  transition: color 0.2s;
}

.ks-nav a:hover {
  color: var(--accent);
}


/* ── Content area ────────────────────────────────────────── */

.site-content {
  background-color: var(--paper);
}


/* ── Footer ──────────────────────────────────────────────── */

.ks-footer {
  background-color: #0a0a09;
  color: #3a3a38;
  padding: 1.5rem 3rem;
  font-family: var(--mono);
  font-size: 0.65rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.ks-footer__inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
}

.ks-footer a {
  font-family: var(--mono);
  font-size: 0.65rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3a3a38;
}

.ks-footer a:hover {
  color: var(--accent);
}

/* Copyright line + link — replaces the .footer-html-inner rules
   that targeted Kadence's footer HTML block. Same treatment:
   mid grey-brown text, underlined link, accent on hover. */
.ks-footer p {
  color: var(--mid);
  margin: 0;
  font-family: var(--mono);
  font-size: 0.65rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.ks-footer p a {
  color: var(--mid);
  text-decoration: underline;
}

.ks-footer p a:hover {
  color: var(--accent);
}


/* ── Responsive (from former section 13) ─────────────────── */

@media (max-width: 768px) {
  .ks-header__inner {
    padding: 1rem 1.5rem;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
  }

  .ks-nav ul {
    gap: 1.1rem;
    flex-wrap: wrap;
  }

  .ks-footer {
    padding: 1.5rem;
  }
}
