/* ============================================================
 * V1.36.50: Facebook collage layout pagrindinio puslapio kortelėms
 * ============================================================
 * Naudojamas tiesiogiai iš React bundle (`_ppC` funkcija viduje
 * Hp/AdCard komponento). Be JS hack'o, be DOM mutation observer.
 *
 * Variantai pagal nuotraukų skaičių:
 *   1 (single): pp-collage NEnaudojama — rodoma originali nuotrauka
 *   2: 2 stulpeliai
 *   3: 1 didelė kairėje + 2 mažos dešinėje (vertikaliai)
 *   4: 1 didelė kairėje + 3 mažos dešinėje (vertikaliai)
 *   5+: 1 didelė kairėje + 4 mažos dešinėje (vertikaliai) su "+N" overlay
 *
 * Veikia ant horizontalaus layout'o (md:w-48 h-36 = 192×144px desktop,
 * w-full h-36 = pilnas plotis × 144px mobile).
 * ============================================================ */

.pp-collage {
  display: grid !important;
  gap: 2px !important;
  background: #e5e7eb !important;
}

.pp-collage > .pp-collage-cell {
  position: relative;
  overflow: hidden;
  background: #e5e7eb;
}

.pp-collage > .pp-collage-cell > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.pp-collage-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  /* V1.37.10: Cormorant Garamond Italic (kaip kainos) — elegantiškas, didesnis */
  font-family: 'Cormorant Garamond', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  font-size: 36px;
  font-weight: 600;
  font-style: italic;
  letter-spacing: -0.5px;
  line-height: 1;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
  pointer-events: none;
}

/* Mobile — kiek mažesnis kvadrate, kuris yra ~75×30px */
@media (max-width: 767px) {
  .pp-collage-overlay {
    font-size: 32px;
  }
}

/* Variantai pagal nuotraukų skaičių */
.pp-collage-2 { grid-template-columns: 1fr 1fr; }
.pp-collage-3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.pp-collage-3 .pp-collage-cell:nth-child(1) { grid-row: 1 / 3; }
.pp-collage-4 { grid-template-columns: 2fr 1fr; grid-template-rows: repeat(3, 1fr); }
.pp-collage-4 .pp-collage-cell:nth-child(1) { grid-row: 1 / 4; }
.pp-collage-5 { grid-template-columns: 2fr 1fr; grid-template-rows: repeat(4, 1fr); }
.pp-collage-5 .pp-collage-cell:nth-child(1) { grid-row: 1 / 5; }