/* KMC Advice & Partners — shared site stylesheet
   Base reset + the handful of rules verified identical across every Phase 5
   artboard, plus the responsive dual-block toggle and the new mobile nav
   drawer (not part of the original design-canvas mockups — added so the
   mobile hamburger icon actually opens a menu on the real site). Everything
   else (buttons, cards, form fields, etc.) is intentionally kept as a
   per-page scoped <style> block in each page's own <head>, because several
   of these classes render differently from one page to the next (e.g. a
   light-page vs dark-hero contact form) — deduping them into one shared rule
   would silently change pages that were already reviewed pixel-for-pixel. */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #F7F6F1; font-family: 'Inter', system-ui, sans-serif; }
a { text-decoration: none; color: #289146; }
.serif { font-family: 'Source Serif 4', Georgia, serif; }
.textlink { color: #141414; font-size: 14.5px; font-weight: 600; display: inline-flex; align-items: center; gap: 8px; }

/* Responsive dual-block pattern: each page ships a desktop layout (>=768px)
   and a separately hand-tuned mobile layout (<768px), both already reviewed
   pixel-for-pixel in Phase 5. Rather than force both into one fluid DOM, each
   page wraps its content in .kmc-desktop / .kmc-mobile and CSS toggles which
   one paints. */
.kmc-mobile { display: none; }
.kmc-desktop { width: 100%; max-width: 1440px; margin: 0 auto; background: #F7F6F1; }
@media (max-width: 767px) {
  .kmc-desktop { display: none; }
  .kmc-mobile { display: block; width: 100%; max-width: 390px; margin: 0 auto; background: #F7F6F1; position: relative; }
}

/* --- Mobile nav drawer (new — the original mockups had a decorative
   hamburger icon with no menu behind it) --- */
.mnav-toggle { background: none; border: none; padding: 0; display: flex; cursor: pointer; }
.mnav-panel {
  display: none;
  background: #141414;
  padding: 8px 20px 28px 20px;
}
.mnav-panel.open { display: block; }
.mnav-panel a.navlink {
  display: block;
  color: #e6e6e6;
  font-size: 16px;
  font-weight: 500;
  padding: 14px 0;
  border-bottom: 1px solid #2a2a2a;
}
.mnav-panel a.navlink.active { color: #fff; font-weight: 700; }
.mnav-panel .mnav-lang { display: flex; gap: 16px; padding-top: 18px; }
.mnav-panel .mnav-lang a { color: #9a9a9a; font-size: 13px; font-weight: 600; letter-spacing: .03em; }
.mnav-panel .mnav-lang a.active { color: #fff; }
