/* ===== Base Typography ===== */
body {
  font-family: 'Raleway', sans-serif; /* 'Open Sans'*/
  line-height: 1.8;
  color: #333;
  background-color: #fafafa;
}

h1, h2, h3, h4, h5 {
  font-family: 'Lora', serif;    /* 'Merriweather', serif; */
}

/* ===== Navbar ===== */
.navbar {
  background-color: #1b2a49; /* Navy blue */
}

.navbar-brand, .nav-link {
  color: #fff !important;
  transition: color 0.3s ease;
}

.nav-link:hover {
  color: #7d2427 !important; /* Dark red hover */
}

/* ===== Profile Photo ===== */

.profile-photo {
  width: 240px;
  height: 300px;          /* taller than wide = ellipse */
  object-fit: cover;      /* keeps proportions correct */
  border-radius: 50% / 40%;  /* makes it elliptical */
  border: 4px solid #1b2a49; /* border: 3px solid #5b684e; */ /* optional, camouflage green border */
  transition: transform 0.3s ease;
}

.profile-photo:hover {
  transform: scale(1.02);
}

/* ===== Links ===== */
a {
  color: #1b2a49;
  transition: color 0.2s ease;
}

a:hover {
  color: #5b684e; /* Camouflage green */
  text-decoration: underline;
}

/* ===== Social Icons ===== */
.social-icons a {
  color: #5b684e; /* Camouflage green */     /* #1b2a49; navy blue */
  transition: color 0.25s ease;
}

.social-icons a:hover {
  color: #7d2427; /* Dark red hover */
}

/* ===== Research Cards ===== */
.research-card {
  border-top: 5px solid #1b2a49;
  transition: all 0.3s ease;
}

.research-card i {
  color: #5b684e; /* Green icons */
  transition: color 0.3s ease;
}

.research-card:hover {
  transform: translateY(-5px);
  border-top-color: #7d2427; /* Red accent on hover */
}

.research-card:hover i {
  color: #7d2427;
}

/* Gentle hover motion */
.profile-photo:hover {
  transform: scale(1.02);
  transition: transform 0.3s ease;
}

.research-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 8px 15px rgba(0,0,0,0.1);
}

/* ===== Section Title ===== */
.section-title {
  color: #1b2a49;
  border-bottom: 2px solid #7d2427;
  display: inline-block;
  padding-bottom: 5px;
}

/* ===== Footer ===== */
footer {
  background-color: #f5f5f5;
  color: #444;
  font-size: 0.9rem;
}
footer a {
  color: #1b2a49;
}
footer a:hover {
  color: #7d2427;
}