/* Shared site styles — header + nav + footer centralised here */
:root{
  --accent: #6f42c1;
  --accent-600: #5a35a8;
  --muted: #f4f4f7;
  --site-header-height: 100px; /* adjust if you change logo size */
}

body{
  font-family: 'Poppins', system-ui, -apple-system, "Segoe UI", Roboto, Arial;
  margin:0;
  padding-top: var(--site-header-height);
  background-color: var(--muted);
  scroll-padding-top: var(--site-header-height);
}

/* Header / Navbar */
header.navbar-fixed{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1100;
  background: rgba(255,255,255,0.96);
  border-bottom: 1px solid rgba(0,0,0,0.06);
  backdrop-filter: blur(4px);
}
.brand-logos { display:flex; align-items:center; gap:12px; }
.brand-logos img { max-height:72px; width:auto; display:block; height:auto; }

/* Navigation */
.nav-main { display:flex; align-items:center; gap:16px; }
.nav-main a {
  color: #222;
  text-decoration: none;
  padding:6px 8px;
  border-radius:6px;
  transition: background .12s, color .12s;
  font-weight:500;
}
.nav-main a:hover { background: rgba(111,66,193,0.06); color: var(--accent); }
.nav-main a.active { color: var(--accent); background: rgba(111,66,193,0.08); }

/* Mobile offcanvas button */
.offcanvas-toggle-btn { display:block; }

/* Footer */
.site-footer{
  background: var(--accent);
  color: #fff;
  padding:28px 0;
  font-size:0.95rem;
}
.site-footer a { color: rgba(255,255,255,0.95); text-decoration:none; }
.site-footer .muted { color: rgba(255,255,255,0.85); }

/* Buttons using accent */
.btn-accent, .btn-primary {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
}
.btn-accent:hover, .btn-primary:hover {
  background-color: var(--accent-600) !important;
  border-color: var(--accent-600) !important;
}

/* Minor responsive tweaks */
.brand-logos img { max-height:72px; }
.newsletter-img { max-height:160px; width:100%; height:auto; object-fit:cover; }

@media (max-width: 767px) {
  .brand-logos img { max-height:40px; }
  :root{ --site-header-height: 78px; }
  .nav-main { display:none; }
  .offcanvas-toggle-btn { display:block; }

  .hero { flex-direction: column; padding: 30px 5%; }
  .hero .overlay { padding: 20px; }
  .hero-text { max-width: 100%; }
  .newsletter-img { max-height:160px; }
}