/* GROWBZ — shared stylesheet
   Pages carry the Claude Design markup with its exact inline styles; page-level design CSS
   lives in assets/css/<page>.css and hover states in assets/css/hover.css. This file only
   holds the base rules every design page shares, plus shared partial helpers. */

* { box-sizing: border-box; }

body {
  margin: 0;
  background: #F8FAFC;
  font-family: 'Manrope', 'Inter', sans-serif;
  color: #1A365D;
  -webkit-font-smoothing: antialiased;
}

a { color: #10B981; text-decoration: none; }
a:hover { color: #059669; }

/* ---------- Breadcrumb (persona pages) ---------- */
.breadcrumb {
  max-width: 1120px; margin: 0 auto; padding: 18px 32px 0;
  font-size: 13px; font-weight: 600; color: #64748B;
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
}
.breadcrumb a { color: #64748B; }
.breadcrumb a:hover { color: #059669; }
.breadcrumb .sep { color: #CBD5E1; }
.breadcrumb .current { color: #1A365D; font-weight: 700; }
@media (max-width: 640px) { .breadcrumb { padding-left: 20px; padding-right: 20px; } }

/* ---------- Public site header/footer: responsive hooks ----------
   The design is desktop-only; header.php/footer.php carry its exact inline styles and
   these rules only adapt them below desktop widths via the design's data-* hooks. */
#mobile-menu[hidden] { display: none; }
.nav-dropdown .nav-dropdown-menu { opacity: 0; visibility: hidden; transform: translateY(4px); transition: opacity .15s ease, transform .15s ease, visibility .15s; }
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.nav-dropdown:hover .nav-chevron,
.nav-dropdown:focus-within .nav-chevron { transform: rotate(180deg); }
@media (max-width: 860px) {
  [data-desktop-nav], [data-desktop-cta] { display: none !important; }
  [data-mobile-btn] { display: flex !important; }
}
@media (max-width: 900px) { [data-footer-grid] { grid-template-columns: 1fr 1fr !important; } }
@media (max-width: 560px) { [data-footer-grid] { grid-template-columns: 1fr !important; } }
