/* Watermark (global family) */
.watermark{
  position: fixed; inset: 0;
  background: url('assets/logo-watermark.png') no-repeat center/500px auto;
  opacity:.05; z-index:-1; pointer-events:none;
}

/* Banner */
.banner{
  height: 250px; display:flex; justify-content:center; align-items:center;
  color:#fff; background-size:cover; background-position:center;
  text-align:center; text-shadow:0 2px 4px rgba(0,0,0,.6);
}
.banner-content h1{ font-size:2rem; font-weight:700; }

/* Tabs */
.tab-buttons{
  display:flex; justify-content:center; gap:1rem; margin:2rem auto 0;
}
.tab-btn{
  padding:.6rem 1.2rem; border:0; cursor:pointer;
  background:#002147; color:#fff; font-weight:700; border-radius:6px;
}
.tab-btn.active{ background:#0055a5; }

/* Hide inactive tab panels (FIX) */
.tab-content{ display:none; }
.tab-content.active{ display:block; }

/* Gallery Grid */
.gallery-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(250px,1fr));
  gap:1.5rem; margin-top:2rem; padding:0 1rem;
}
.gallery-grid .card{
  background:#fff; border-radius:10px; overflow:hidden;
  box-shadow:0 4px 10px rgba(0,0,0,.1); transition:transform .3s; cursor:pointer;
}
.gallery-grid .card:hover{ transform:scale(1.05); }
.gallery-grid img{ width:100%; height:200px; object-fit:cover; display:block; }
.gallery-grid .card p{ padding:.6rem .8rem; color:#0f172a; }

/* Blog Grid */
.blog-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(300px,1fr));
  gap:2rem; margin-top:2rem; padding:0 1rem;
}
.blog-card{
  background:#fff; border-radius:10px; padding:1rem;
  box-shadow:0 4px 10px rgba(0,0,0,.1); transition:transform .3s;
}
.blog-card:hover{ transform: translateY(-4px); }
.blog-card img{ width:100%; height:200px; object-fit:cover; border-radius:6px; }
.blog-card h3{ margin:1rem 0 .5rem; color:#0f172a; }
.blog-card a{ display:inline-block; margin-top:.5rem; color:#002147; font-weight:700; }

/* Lightbox */
.lightbox{
  display:none; position:fixed; inset:0; z-index:1000; padding-top:60px;
  background:rgba(0,0,0,.9);
}
.lightbox-content{ margin:auto; display:block; width:80%; max-width:760px; }
#caption{ text-align:center; color:#ccc; padding:10px; }
.close{
  position:absolute; top:24px; right:28px; color:#fff; font-size:40px;
  cursor:pointer; background:transparent; border:0; line-height:1;
}

/* Fade-in animation */
.fade-in{ animation: fadeIn .9s ease-in forwards; opacity:0; }
@keyframes fadeIn{
  from{ opacity:0; transform:scale(.96); }
  to{ opacity:1; transform:scale(1); }
}

/* Footer spacing (colors from global) */
.footer{ background:#004aad; color:#fff; padding:1.4rem 1rem; text-align:center; }

/* Responsive */
@media (max-width:768px){
  .banner{ height:220px; }
}