/* ========= HOME.CSS (McKinsey / deck cover) ========= */

:root{
  --navy:#031940;
  --ink:#031940;
  --muted:rgba(3,25,64,.6);
  --line:#E5E7EB;
  --panel:#F9FAFB;
  --paper:#FFFFFF;

  --radius:14px;
  --shadow: 0 10px 26px rgba(17,24,39,.08);
  --shadow-soft: 0 6px 16px rgba(17,24,39,.06);
}

/* Title block */
#welcome{
  padding: 2.5rem 0 1.25rem;
  border-bottom: 1px solid var(--line);
  margin-bottom: 1.5rem;
}

#welcome h2:first-child{
  font-size: clamp(2.1rem, 3.4vw, 2.8rem);
  line-height: 1.06;
  letter-spacing: -.5px;
  color: var(--ink);
  margin-bottom: .45rem;
}

#welcome h2:nth-child(2){
  font-size: clamp(1.15rem, 1.9vw, 1.35rem);
  font-weight: 650;
  color: #031940;
  letter-spacing: .1px;
}

/* Image card */
#teampic{
  margin: 1.25rem 0 3rem;
}

#teampic figure{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 1rem;
  box-shadow: var(--shadow);
}

#teampic img{
  width: 100%;
  height: min(460px, 56vw);
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

/* Caption looks like a report footnote */
#teampic figcaption{
  margin-top: .75rem;
  color: #031940;
  font-size: .95rem;
  line-height: 1.35;
}

/* Small “deck polish” on hover, very subtle */
#teampic figure:hover{
  border-color: rgba(3,25,64,.18);
  box-shadow: 0 14px 32px rgba(17,24,39,.10);
}

/* Responsive tightening */
@media (max-width: 520px){
  #welcome{
    padding: 2rem 0 1rem;
  }
  #teampic figure{
    padding: .85rem;
  }
}