
/* BUILD 17 — COMPACT GALLERIES + VISITOR COUNTER */

/* Compact image galleries */
.project-grid,
.case-grid,
.video-preview-grid,
.video-gallery{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px !important;
  columns:auto !important;
}

.project-card,
.case-grid img,
.video-preview-tile,
.video-gallery-tile{
  aspect-ratio:1/1 !important;
  width:100% !important;
  min-height:0 !important;
  height:auto !important;
  overflow:hidden !important;
}

.project-card img,
.case-grid img,
.video-preview-tile img,
.video-gallery-tile video{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

.case-grid img{
  margin:0 !important;
}

.project-card span{
  padding:12px 14px !important;
}

.spotlight-comparison{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}
.spotlight-comparison figure{
  min-height:0 !important;
  aspect-ratio:4/3 !important;
}
.spotlight-comparison img{
  position:absolute !important;
  inset:0 !important;
}

/* Smaller video play button */
.gallery-play{
  width:54px !important;
  height:54px !important;
  font-size:1rem !important;
}

/* Slimmer mobile call bar */
.mobile-call,
.sticky-call{
  min-height:44px !important;
  padding:10px 16px !important;
  font-size:.84rem !important;
  border-radius:12px !important;
}

/* Visitor counter */
.visitor-counter-section{
  width:100%;
  padding:24px 16px;
  display:flex;
  justify-content:center;
  background:#050505;
  border-top:1px solid #222;
}
.visitor-counter-card{
  min-width:240px;
  text-align:center;
  padding:18px 28px;
  border:1px solid #303030;
  background:rgba(10,10,10,.94);
}
.visitor-counter-label{
  display:block;
  color:#888;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.68rem;
  margin-bottom:7px;
}
#visitorCounter{
  display:block;
  color:#fff;
  font-size:1.8rem;
  line-height:1;
  font-variant-numeric:tabular-nums;
}

/* Tablet */
@media(max-width:1050px){
  .project-grid,
  .case-grid,
  .video-preview-grid,
  .video-gallery{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* Mobile: two tiles per row */
@media(max-width:700px){
  .project-grid,
  .case-grid,
  .video-preview-grid,
  .video-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .project-card span{
    display:none !important;
  }

  .spotlight-comparison{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .visitor-counter-card{
    min-width:210px;
    padding:15px 20px;
  }
}

/* Very narrow phones */
@media(max-width:380px){
  .project-grid,
  .case-grid,
  .video-preview-grid,
  .video-gallery{
    grid-template-columns:1fr 1fr !important;
  }
}
