:root{
  --necds-yellow:#E0B938;
  --necds-green:#22C066;
  --necds-blue:#1F95C5;
  --radius:18px;
}

html, body { height: 100%; }

body{
  background:#fff;
  font-family: "Source Sans 3", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  color:#111;
}
p{
  font-size: 1.5rem;
}

/* Nav */
.navbar{ padding: 1.25rem 0 0 0; }
.navbar > .container { align-items: baseline; }
.navbar-brand img{ height: 95px; width:auto; }
.nav-link{ color:#000; font-weight:700;font-size: 1.5rem; }
.nav-link:hover{ color:#111; text-decoration: underline; text-underline-offset: 5px; }
.nav-link.active{ text-decoration: underline; text-underline-offset: 5px; }
@media (min-width: 992px) {
  .mt-lg-0 {
    padding-bottom: 30px;
  }
}
/* Buttons */
.btn-necds{
  background: var(--necds-blue);
  border: 2px solid var(--necds-blue);
  color:#fff;
  border-radius: 999px;
  padding: .6rem 1.25rem;
  font-weight: 700;
  font-size: 1.125rem;
}
.btn-necds:hover{ background:#167aa3; border-color:#167aa3; color:#fff; }

.btn-necds-outline{
  background: transparent;
  border: 2px solid var(--necds-blue);
  color: var(--necds-blue);
  border-radius: 999px;
  padding: .6rem 1.25rem;
  font-weight: 700;
  font-size: 1.125rem;
}
.btn-necds-outline:hover{ background: rgba(31,149,197,.08); color: var(--necds-blue); }

/* Homepage hero */
.hero{
  min-height: calc(100vh - 92px);
  display:flex;
  align-items:center;
  padding: 7.5rem 0 4rem;
  background: linear-gradient(90deg, var(--necds-green) 0%, var(--necds-yellow) 100%);
  position: relative;
  flex-direction: column;
}

.hero-card{
  border-radius: var(--radius);
  overflow:hidden;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  background:#fff;
}

.hero-copy{ padding: 2.25rem 2.25rem 2rem; }
.hero-copy h1{ font-weight:700; letter-spacing:-0.02em; margin-bottom:1rem; font-size:2.25rem}
.hero-copy p{ color:#222; line-height:1.6; margin-bottom:1.1rem; max-width:34rem; }
.hero-copy p.mb-3{ font-size: 1.5rem;}
.hero-copy p.mb-4{ font-size: 1.25rem}

.hero-media{ height:100%; min-height:320px; background:#0b2b46; }
.hero-media img{ width:100%; height:100%; object-fit:cover; display:block; }

/* Internal pages */
.site-shell{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

.page-header{
  background: var(--necds-yellow);
  padding: 3.25rem 0;
  text-align:center;
}
.page-header h1{
  color:#fff;
  font-weight:700;
  letter-spacing:-0.02em;
  margin:0;
}

.page-content{ padding: 3rem 0 4.5rem; }

/* Section headings (Contact + Members/Directors) */
.section-title{
  text-align:center;
  color: var(--necds-blue);
  font-weight: 700;
  font-size: 2.2rem;
  margin: 0;
}
.section-title img{ height:50px;width:auto;padding-right:20px; }

.section-rule{
  border:0;
  height:2px;
  background: var(--necds-blue);
  opacity:.95;
  max-width: 980px;
  margin: 1.25rem auto 2.25rem;
}

.kv-grid, .members-wrap, .directors-wrap{
  max-width: 980px;
  margin: 0 auto;
}

.kv-split{
  position: relative;
  max-width: 980px;
  margin: 0 auto;
}

/* one vertical line for the whole block */
.kv-split::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:2px;
  background: var(--necds-blue);
  opacity:.9;
  transform: translateX(-1px);
}

.kv-split .kv-row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 2.5rem;
  padding: 0.5rem 0;              /* keep your spacing, divider stays continuous */
}

.kv-split .kv-row .label{
  text-align:right;
  color: var(--necds-blue);
  font-weight:700;
  font-size: 1.5rem;
}

.kv-row a {
  color:#000;
}
.kv-row a:hover {
  color:var(--necds-blue);;
}

.members-wrap{ margin-bottom: 4.25rem; }
.members-item{
  text-align:center;
  font-size: 1.15rem;
  padding: .9rem 0;
}

.director{ text-align:center; padding: 1.1rem 0; }
.director .name{ font-weight:700; margin-bottom:.15rem; font-size:1.15rem; }
.director .role{ margin:0; line-height:1.35; font-size:1.05rem; }

/* Footer */
.site-footer{
  margin-top:auto;
  text-align:center;
  padding: 2.75rem 0 2rem;
  font-weight:700;
  font-size: 1.5rem;
}

.hero .site-footer{
  position:absolute;
  left:0;
  right:0;
  bottom:18px;
  color:#fff;
  opacity:.95;
  pointer-events:none;
  padding:0;
  margin:0;
  font-size: 1.5rem;
}

@media (max-width: 991.98px){
  .hero{ min-height:auto; padding: 2.25rem 0 1.25rem; }
  .hero-copy{ padding: 1.75rem; }
  .hero .site-footer{ position: static; padding: 1.25rem 0; color:#fff; }
  .page-header{ padding: 2.5rem 0; }
  .section-title{ font-size: 1.9rem; }
  .section-title img{ height:50px;width:auto;padding-right:20px; }
  .members-item{ font-size: 1.05rem; }
  .kv-split::before{ display:none; }
   .navbar-toggler{ margin-bottom: 20px; }

  .kv-split .kv-row{
    grid-template-columns: 1fr;
    padding: .85rem 0;
  }

  .kv-split .kv-row .label{
    text-align:left;
    padding-right:0;
  }

  .kv-split .kv-row .value{
    padding-left:0;
  }
  #mainNav div {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
  }
}