/* Scholarly Color Theme */
:root{
  --primary: #233a59;     /* deep academic navy */
  --accent:  #8aa6c1;     /* soft scholarly accent */
  --muted:   #f5f7f9;
  --text:    #1e2a36;
}

body{
  background: var(--muted);
  color: var(--text);
  font-family: "Merriweather", serif;
  margin: 0;
}

/* Banner (fixed visual at top of content flow) */
.banner{
  background: linear-gradient(180deg, rgb(77, 125, 187) 0%, rgba(30,45,70,0.95) 100%);
  box-shadow: 0 6px 24px rgba(18,28,44,0.12);
}

/* small tweaks to banner text */
.banner h1{
  font-size: clamp(1.6rem, 2.6vw, 2.4rem);
  letter-spacing: 0.6px;
}
.banner p{ opacity: .92; }

/* Tab nav styling */
.nav-tabs .nav-link{
  color: var(--primary);
  font-weight: 600;
  border: none;
  padding: .65rem 1rem;
}
.nav-tabs .nav-link.active{
  background: var(--primary);
  color: #fff !important;
  border-radius: .45rem .45rem 0 0;
}

/* Tab content container */
.tab-content{
  border: 1px solid rgba(0,0,0,0.06);
  border-top: none;
  padding: 1.25rem;
  margin-top: -1px;
}

/* Carousel visuals */
.carousel-visual{
  height: 360px;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(10,20,30,0.08);
}

/* Caption background for better readability */
.caption-bg{
  background: rgba(0,0,0,0.35);
  padding: .5rem;
  border-radius: .35rem;
}

/* Cards */
.card{
  border: none;
  border-radius: 10px;
  box-shadow: 0 6px 20px rgba(10,20,30,0.04);
}

/* Contacts */
.contacts address{
  font-style: normal;
  line-height: 1.3;
}

/* Responsive spacing */
@media (max-width: 991px){
  .carousel-visual{ height: 240px; }
  .banner{ padding: 2.25rem 1rem; }
}

/* Subtle fade for tab pane changes implemented in HTML with Bootstrap's classes,
   but keep a reduced animation to avoid excessive motion. */
.tab-pane{
  will-change: opacity, transform;
  backface-visibility: hidden;
}