/* ── NAV ── */
nav {
  background: rgba(243,247,242,0.94);
  backdrop-filter: blur(16px);
  box-shadow: 0 1px 0 var(--rule);
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.1rem 3.5rem;
}

/* ── PAGE LAYOUT ── */
.page-wrap {
  max-width: 720px;
  margin: 0 auto;
  padding: 5rem 2rem 7rem;
}

.page-eyebrow {
  font-size: 0.72rem; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--sage); margin-bottom: 1rem;
  display: flex; align-items: center; gap: 0.75rem;
}
.page-eyebrow::before { content: ''; width: 24px; height: 1px; background: var(--sage); }

/* ── TYPOGRAPHY ── */
h1 {
  font-family: 'Fraunces', serif;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 300; line-height: 1.1;
  letter-spacing: -0.025em; color: var(--ink);
  margin-bottom: 0.5rem;
}

.page-meta {
  font-size: 0.82rem; color: var(--light);
  margin-bottom: 3.5rem;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid var(--rule);
}

h2 {
  font-family: 'Fraunces', serif;
  font-size: 1.3rem; font-weight: 400;
  color: var(--ink); letter-spacing: -0.01em;
  margin-top: 2.75rem; margin-bottom: 0.85rem;
}

p {
  font-size: 0.95rem; line-height: 1.8;
  color: var(--mid); margin-bottom: 1rem;
}

ul { padding-left: 1.25rem; margin-bottom: 1rem; }
ul li { font-size: 0.95rem; line-height: 1.8; color: var(--mid); margin-bottom: 0.35rem; }

a {
  color: var(--fern); text-decoration: none;
  border-bottom: 1px solid rgba(124,170,120,0.3);
  transition: color 0.2s, border-color 0.2s;
}
a:hover { color: var(--moss); border-color: var(--sage); }

/* ── HIGHLIGHT BOX ── */
.highlight-box {
  background: var(--mist); border-radius: 12px;
  padding: 1.25rem 1.5rem; margin: 2rem 0;
  border-left: 3px solid var(--sage);
}
.highlight-box p { margin: 0; color: var(--bark); }

/* ── FOOTER ── */
footer {
  background: var(--ink); padding: 2.5rem 3.5rem;
  display: flex; align-items: center; justify-content: space-between; gap: 2rem;
}
.footer-logo {
  font-family: 'Fraunces', serif; font-size: 1.25rem; font-weight: 600;
  color: var(--leaf); text-decoration: none; letter-spacing: -0.02em;
  display: flex; align-items: center; gap: 0.4rem; border: none;
}
.footer-logo:hover { color: var(--cream); }
.footer-logo-leaf { width: 16px; height: 16px; background: var(--fern); border-radius: 50% 50% 50% 0; transform: rotate(-45deg); }
.footer-note { font-size: 0.78rem; color: rgba(243,247,242,0.25); }
.footer-links { display: flex; gap: 1.75rem; list-style: none; }
.footer-links a { font-size: 0.78rem; color: rgba(243,247,242,0.35); border: none; transition: color 0.2s; }
.footer-links a:hover { color: var(--leaf); }

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
  nav { padding: 1rem 1.5rem; }
  .page-wrap { padding: 3rem 1.5rem 5rem; }
  footer { flex-direction: column; text-align: center; padding: 2rem 1.5rem; gap: 1rem; }
  .footer-links { justify-content: center; }
}
