:root{
    --navy:#081a2b;
    --gold:#c9a64d;
    --steel:#e7edf3;
}

body{
    font-family:'Inter',sans-serif;
    background:var(--steel);
}

.navbar{
    background:rgba(8,26,43,.92);
}

/* HERO */
.gallery-hero{
    background:
    linear-gradient(rgba(8,26,43,.75),rgba(8,26,43,.75)),
    url("../images/gog-op.jpg");
    background-size:cover;
    background-position:center;
    color:#fff;
    padding:140px 0 90px;
    text-align:center;
}

.gallery-hero h1{
    font-weight:800;
    letter-spacing:1px;
}

/* GALLERY GRID */
.gallery-item{
    position:relative;
    overflow:hidden;
    cursor:pointer;
    border-radius:6px;
}

.gallery-item img{
    width:100%;
    height:260px;
    object-fit:cover;
    transition:transform .4s ease;
}

.gallery-item:hover img{
    transform:scale(1.08);
}

.gallery-overlay{
    position:absolute;
    inset:0;
    background:rgba(8,26,43,.55);
    display:flex;
    align-items:center;
    justify-content:center;
    opacity:0;
    transition:.3s;
    color:#fff;
    font-size:2rem;
}

.gallery-item:hover .gallery-overlay{
    opacity:1;
}

/* SECTION */
section{
    padding:80px 0;
}

.section-title{
    font-weight:800;
    color:var(--navy);
    text-transform:uppercase;
    letter-spacing:1px;
    margin-bottom:15px;
}

/* FOOTER */
footer{
    background:var(--navy);
    color:#fff;
    padding:40px 0;
}


/* VIDEO OVERLAY */
.video-card .video-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.video-card .video-overlay i {
  font-size: 4rem;
  color: #f8c146; /* matches your gold accent */
  opacity: 0.9;
}

/* Hover effect */
.video-card:hover .video-overlay {
  background: rgba(0, 0, 0, 0.55);
  transform: scale(1.02);
}

/* Mobile adjustment */
@media (max-width: 576px) {
  .media-card img {
    height: 200px;
  }

  .video-card .video-overlay i {
    font-size: 3rem;
  }
}



.gallery-caption {
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  padding: 12px 14px;
}

.gallery-caption h6 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
}

.gallery-caption small {
  font-size: 0.75rem;
  opacity: 0.85;
}