/* ============================================
   STUDIO — page styles
   ============================================ */

.service {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: stretch;
}

.service__text {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.service__images {
  display: grid;
  gap: 12px;
}

.service__images--double {
  grid-template-columns: 1fr 1fr;
}

.service__images--stacked {
  grid-template-rows: 1fr 1fr;
}

.service .placeholder {
  border: none;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-style: italic;
  opacity: 0.5;
  border-radius: 4px;
  background: var(--c-cream-dark);
  min-height: 100px;
}

.service__images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 4px;
  display: block;
}

.service__images--double img { aspect-ratio: 4/5; }
.service__images--stacked img { aspect-ratio: 1920/529; }


/* ============ RESPONSIVE ============ */
@media (max-width: 768px) {
  .h1-big { font-size: 48px; letter-spacing: -2px; }
  .h2-section { font-size: 38px; letter-spacing: -1.4px; }
  .section { padding: 32px 20px; }
  .service { grid-template-columns: 1fr; gap: 18px; }
  .service__images { min-height: 200px; }
  .service__images--double { grid-template-columns: 1fr 1fr; gap: 8px; }
  .service__images--stacked { gap: 10px; }
  .nav { padding: 16px 24px; gap: 16px; }
  .nav__links { font-size: 11px; gap: 18px; }
  .footer__cols { grid-template-columns: 1fr; }
  .footer__farewell-line { font-size: 40px; letter-spacing: -1.5px; }
}
