/* Main CSS - Boston Robot Hackers Website
 * Compact layout with logo in navigation and full-width banner
 */

/* Navigation bar with logo */
.nav-bar-thin {
  height: 54px;
  background: #1a1a1a;
  border-bottom: 1px solid #333;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 100;
}

/* Logo in navigation bar - left justified, fills nav height */
.nav-logo {
  margin-right: auto;
  padding-left: 1rem;
  height: 100%;
  display: flex;
  align-items: center;
}

.nav-logo img {
  height: 100%;
  width: auto;
  object-fit: contain;
}

/* Banner header - full width, no logo */
.banner-header {
  width: 100%;
}

.banner {
  width: 100%;
  height: 204px;
  
  background: #1a1a1a url('../images/meetings/meeting1-1.jpg');
  background-size: cover;
  background-position: center;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.banner > div { position: relative; z-index: 1; }

.banner h1 {
  color: white;
  text-shadow: 2px 2px 4px black;
}

.banner p {
  color: white;
  text-shadow: 1px 1px 2px black;
}

.nav-bar-thin .container-fluid {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.nav-bar-thin .navbar-nav {
  height: 100%;
  align-items: center;
  justify-content: flex-end;
  margin: 0;
  margin-right: 1rem;
}

.nav-bar-thin .nav-link {
  color: #f0f0f0 !important;
  padding: 0.5rem 1rem !important;
  transition: all 0.2s ease;
}

.nav-bar-thin .nav-link:hover {
  color: #ffffff !important;
  opacity: 0.8;
  transform: translateY(-1px);
}

.hero-section {
  max-width: 60rem;
}

/* Auto-sizing hero based on content */
.hero {
  padding: 1.5rem 1rem !important;
  min-height: auto !important;
}

.hero h1 {
  margin-bottom: 0.75rem;
}

.hero p {
  margin-bottom: 0.5rem;
}

.hero *:last-child {
  margin-bottom: 0 !important;
}

.card .card-body { padding: 1rem; }
.card img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
@media (max-width: 575px) { .card img { aspect-ratio: 1 / 1; } }

/* Standardize What's New images */
.news-card img,
.news-card .bg-secondary {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0.25rem;
}

/* Force the news card image column to a consistent size */
.news-card .col-3,
.news-card .col-md-2 {
  flex: 0 0 auto;       /* fixed size, no shrink */
  display: flex;        /* allow child to fill height */
  align-items: stretch; /* match child height */
  aspect-ratio: 1 / 1;  /* square thumbnails */
  max-height: 100px;    /* adjust as needed */
}