*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#1a1a1a;line-height:1.6}.wrap{max-width:960px;margin:0 auto;padding:0 1.5rem}a{color:#0a2a6b}.site-header{border-bottom:1px solid #e3e6ec}.site-header .wrap{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:1rem 1.5rem;gap:.75rem}.site-header .brand{font-weight:700;font-size:1.25rem;color:#0a2a6b;text-decoration:none}.site-header .site-nav{display:flex;flex-wrap:wrap;gap:1.25rem;align-items:center}.site-header .site-nav a{text-decoration:none;color:#1a1a1a;font-size:.95rem}.site-header .site-nav a:hover{color:#0a2a6b}.site-header .site-nav a.active{color:#0a2a6b;font-weight:700;background:#eef1f8;padding:.3rem .7rem;border-radius:4px;box-shadow:inset 0 -2px 0 #c9a227}.site-header .site-nav .logout-form{margin:0}.site-header .site-nav .logout-form button{font:inherit;text-decoration:none;color:#1a1a1a;background:none;border:none;padding:0;cursor:pointer}.site-header .site-nav .logout-form button:hover{color:#0a2a6b}.site-header .lang-switcher{display:flex;gap:.6rem;padding-left:.75rem;border-left:1px solid #e3e6ec}.site-header .lang-switcher a{font-size:.8rem;color:#5a5f6b}.site-header .lang-switcher a:hover{color:#0a2a6b}.site-header .lang-switcher a.active{color:#0a2a6b;font-weight:700}main{max-width:960px;margin:0 auto;padding:2rem 1.5rem 4rem}h1,h2,h3{color:#0a2a6b}blockquote{border-left:4px solid #c9a227;margin:1.5rem 0;padding:.25rem 0 .25rem 1.25rem;font-size:1.25rem;font-style:italic;color:#0a2a6b}table{width:100%;border-collapse:collapse;margin:1.5rem 0}table th,table td{border:1px solid #e3e6ec;padding:.6rem .75rem;text-align:left;vertical-align:top}table th{background:#f4f6fa;color:#0a2a6b}.hero-image{width:100%;height:auto;border-radius:6px;display:block}.pillars{display:flex;flex-wrap:wrap;gap:1rem;margin:2rem 0}.pillars .pillar{flex:1 1 220px;background:#f4f6fa;border-top:3px solid #c9a227;padding:1.25rem;border-radius:4px}.pillars .pillar h3{margin-top:0;font-size:1.05rem}.pillars .pillar p{margin-bottom:0;color:#5a5f6b}.cta-row{display:flex;flex-wrap:wrap;gap:.75rem;margin:2rem 0}.button{display:inline-block;text-decoration:none;padding:.6rem 1.1rem;border:1px solid #0a2a6b;border-radius:4px;color:#0a2a6b}.button:hover{background:#f4f6fa}.button-primary{background:#0a2a6b;color:#fff}.button-primary:hover{background:rgb(6.5128205128,27.3538461538,69.6871794872)}.site-footer{border-top:1px solid #e3e6ec;margin-top:2rem}.site-footer .wrap{padding:1.5rem;color:#5a5f6b;font-size:.9rem}.site-footer p{margin:.2rem 0}.site-footer .footer-version{font-size:.75rem;color:#8a8f9b}@media(max-width: 600px){.site-header .wrap{flex-direction:column;align-items:flex-start}}
/* Bootstrap brand overrides for the membership preregistration form.
   Bootstrap is loaded before this file, so these win. No Sass pipeline in
   the Django app, so this is authored directly in the compiled CSS. */
.membership-card {
  max-width: 860px;
  margin: 1.5rem 0;
  border: 1px solid #e3e6ec;
  border-radius: 8px;
}
.membership-form .form-label {
  font-weight: 600;
  color: #0a2a6b;
}
.membership-form .form-control,
.membership-form .form-select {
  padding: 0.6rem 0.75rem;
}
/* Brand-navy focus ring instead of Bootstrap's default blue. */
.membership-form .form-control:focus,
.membership-form .form-select:focus {
  border-color: #0a2a6b;
  box-shadow: 0 0 0 0.2rem rgba(10, 42, 107, 0.15);
}
/* Keep the brand navy submit button (.button.button-primary) comfortably
   sized within the Bootstrap form. */
.membership-form .button-primary {
  padding: 0.6rem 1.5rem;
}
/* Account menu in the header nav: a native <details>/<summary> disclosure
   (no JS bundle is loaded in the header, so this avoids adding one just
   for a menu). */
.account-menu {
  position: relative;
}
.account-menu summary {
  list-style: none;
  cursor: pointer;
  color: #1a1a1a;
  font-size: .95rem;
}
.account-menu summary::-webkit-details-marker {
  display: none;
}
.account-menu summary::after {
  content: ' \25BE';
}
.account-menu summary:hover {
  color: #0a2a6b;
}
.account-menu-panel {
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  min-width: 160px;
  margin-top: .4rem;
  padding: .6rem;
  background: #fff;
  border: 1px solid #e3e6ec;
  border-radius: 4px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, .08);
}
.account-menu-panel a {
  text-decoration: none;
  color: #1a1a1a;
  font-size: .95rem;
}
.account-menu-panel a:hover {
  color: #0a2a6b;
}
.account-menu-panel a.active {
  color: #0a2a6b;
  font-weight: 700;
}
.account-menu-panel .logout-form {
  margin: 0;
}
.account-menu-panel .logout-form button {
  font: inherit;
  text-decoration: none;
  color: #1a1a1a;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-align: left;
}
.account-menu-panel .logout-form button:hover {
  color: #0a2a6b;
}
/* Match Bootstrap cards' border color to the site's own border color
   (used everywhere else: header, membership-card, tables) instead of
   Bootstrap's default. */
.card {
  border-color: #e3e6ec;
}
/* Narrow card wrapper for simple 1-3 field forms (login, password
   change) -- reads better narrow, unlike the wider .membership-card. */
.auth-card {
  max-width: 420px;
  margin: 1.5rem 0;
}