/* Ülke rehberi fotoğrafları (10 Kasım 2026).
   DESIGN.md: fotoğraf çerçevesi 12px köşe, gölgesiz (One Lift Rule); etiket atlas lejantı gibi lacivert, 2px köşe.
   Ana rehber: .r-foto--uclu (1 büyük + 2 küçük, 16:9 blok). Alt sayfa: .r-foto--tek (21:9 bant). */
.r-foto { margin-block: var(--s-7) 0; }
.article > section + .r-foto { margin-block-start: var(--s-8); }
.r-foto + section { margin-block-start: var(--s-8) !important; }
.r-foto__grid { display: grid; gap: var(--s-3); }
.r-foto__item { position: relative; margin: 0; min-block-size: 0; overflow: hidden; border-radius: 12px; background: #dfe4ee; box-shadow: inset 0 0 0 1px rgba(14,27,58,.08); }
.r-foto__item img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; }
.r-foto__item figcaption {
  position: absolute; inset-inline-start: var(--s-3); inset-block-end: var(--s-3);
  max-inline-size: calc(100% - 2 * var(--s-3));
  display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 10px; border-radius: 2px;
  background: rgba(14,27,58,.86); color: #fff;
  font-family: Montserrat, system-ui, sans-serif; font-size: 12px; font-weight: 500; line-height: 1.3; letter-spacing: .01em;
}
.r-foto__item figcaption::before { content: ""; flex: none; inline-size: 7px; block-size: 7px; border-radius: 50%; background: #d9b45f; }

.r-foto--uclu .r-foto__grid { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; aspect-ratio: 16 / 9; }
.r-foto--uclu .r-foto__item:first-child { grid-row: 1 / 3; }
.r-foto--tek .r-foto__item { aspect-ratio: 21 / 9; }

.r-foto__kaynak { margin-block-start: var(--s-2); font-size: 13px; color: #5b6478; }
.r-foto__kaynak > summary { cursor: pointer; inline-size: fit-content; text-decoration: underline; text-decoration-color: rgba(14,27,58,.25); text-underline-offset: 3px; }
.r-foto__kaynak ul { margin: var(--s-2) 0 0; padding-inline-start: 18px; }
.r-foto__kaynak li { margin-block: 2px; }

@media (max-width: 639px) {
  .r-foto--uclu .r-foto__grid { grid-template-columns: 1fr 1fr; grid-template-rows: auto; aspect-ratio: auto; gap: var(--s-2); }
  .r-foto--uclu .r-foto__item:first-child { grid-row: auto; grid-column: 1 / 3; aspect-ratio: 3 / 2; }
  .r-foto--uclu .r-foto__item:not(:first-child) { aspect-ratio: 4 / 3; }
  .r-foto--uclu .r-foto__item:not(:first-child) figcaption { font-size: 11px; padding: 4px 8px; inset-inline-start: var(--s-2); inset-block-end: var(--s-2); max-inline-size: calc(100% - 2 * var(--s-2)); }
  .r-foto--tek .r-foto__item { aspect-ratio: 3 / 2; }
}
