/* Precizan raspored u 12 kolona: nijedno prazno polje ne može da ostane. */
@media (min-width: 901px) {
  .service-grid { grid-template-columns: repeat(12, 1fr); }
  .service-grid .service.featured { grid-column: span 6; }
  .service-grid .service:nth-child(2),
  .service-grid .service:nth-child(3) { grid-column: span 3; }
  .service-grid .service:nth-child(4),
  .service-grid .service:nth-child(5) { grid-column: span 6; }
}

@media (max-width: 560px) {
  .service-grid .service:nth-child(4),
  .service-grid .service:nth-child(5) {
    grid-column: auto;
  }
}

.contact-fabs {
  position: fixed;
  right: 18px;
  bottom: 22px;
  z-index: 120;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.contact-fabs .fab {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  padding: 0;
  border-radius: 50px;
  color: #fff;
  box-shadow: 0 8px 28px rgba(0,0,0,.42);
  transition: transform .25s ease, box-shadow .25s ease;
}

.contact-fabs .fab:hover { transform: translateY(-3px) scale(1.06); box-shadow: 0 12px 34px rgba(0,0,0,.55); }
.contact-fabs .fab svg { width: 25px; height: 25px; flex: 0 0 25px; }
.contact-fabs .phone { background: #e4ff00; color: #080908; }
.contact-fabs .whatsapp { background: #25d366; }
.contact-fabs .viber { background: #7360f2; }

@media (max-width: 900px) {
  .contact-fabs { display: none; }
}

/* Galerija sa šest fotografija bez praznih polja. */
@media (min-width: 901px) {
  .gallery-grid {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 260px);
  }
  .gallery-grid button:first-child {
    grid-column: span 2;
    grid-row: span 2;
  }
  .gallery-grid button:last-child { grid-column: auto; }
  .videos { grid-template-columns: repeat(3, 1fr); }
  .videos .portrait-video { object-fit: contain; }
}

@media (max-width: 900px) {
  .gallery-grid button:first-child { grid-row: auto; }
  .videos .portrait-video { object-fit: contain; }
}

/* Bezbedan razmak redova sprečava preklapanje velikih naslova. */
h1, h2, h3 {
  line-height: 1.08;
  text-wrap: balance;
}

.hero h1 {
  font-size: clamp(54px, 7.4vw, 124px);
  line-height: 1.03;
  letter-spacing: -0.02em;
}

@media (max-width: 560px) {
  .hero h1 {
    font-size: clamp(48px, 15vw, 70px);
    line-height: 1.06;
    letter-spacing: -0.01em;
  }
}