/* Veri Kalıntıları: featured image, three-column contact sheet, fullscreen viewer. */
.sd-project .project-page { width: min(1120px, calc(100% - 64px)); margin: 28px auto 64px; background: transparent; }
.sd-project .sd-back { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 0; border: 0; color: #111; background: transparent; font: 12px/1.3 'Times New Roman', serif; text-decoration: none; }
.sd-project .sd-back:hover { color: #111; background: transparent; text-decoration: underline; }
.sd-project .sd-hero { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(8px, 2vw, 28px); width: min(600px, 100%); margin: 0 auto 48px; }
.sd-project .sd-hero img { display: block; width: 100%; height: auto; margin: 0; object-fit: contain; }
.vk-gallery { max-width: 960px; margin: 0 auto 80px; }
.vk-featured { margin: 0 0 26px; }
.vk-featured-open, .vk-thumbnail { display: block; width: 100%; padding: 0; border: 0; border-radius: 0; background: #f5f5f5; aspect-ratio: 4/3; overflow: hidden; }
.vk-featured-open { cursor: zoom-in; }
.vk-featured-open img, .vk-thumbnail img { display: block; width: 100%; height: 100%; object-fit: contain; }
.sd-project .vk-featured figcaption { font: 12px/1.5 'Courier New', monospace; color: #555; text-align: right; margin-top: 10px; }
.vk-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.vk-thumbnail { cursor: pointer; }
.vk-thumbnail:hover { outline: 1px solid #111; outline-offset: 3px; }
.sd-project :focus-visible { outline: 2px solid #111; outline-offset: 5px; }
.vk-essay { max-width: 720px; margin: 0 auto; font: 19px/1.75 Georgia, serif; }
.vk-essay p { margin: 0 0 1.35em; }
.vk-essay a { color: inherit; text-decoration-color: #aaa; text-underline-offset: 3px; overflow-wrap: anywhere; }
.vk-essay a:hover { text-decoration-color: #111; }
.vk-sources { max-width: 720px; margin: 32px auto 48px; padding: 20px 0; border-block: 1px solid #d5d5d5; }
.vk-sources summary { cursor: pointer; font: 14px/1.5 'Courier New', monospace; padding: 8px 0; }
.vk-sources ol { margin: 20px 0 0 22px; font: 14px/1.7 Georgia, serif; }
.vk-sources li { padding-left: 5px; margin-bottom: 16px; }
.vk-sources a { color: #333; text-underline-offset: 3px; overflow-wrap: anywhere; }
.vk-viewer, .vk-viewer:fullscreen { position: fixed; inset: 0; width: 100%; height: 100dvh; max-width: none; max-height: none; padding: 0; margin: 0; border: 0; overflow: hidden; background: #080808; color: #fff; }
.vk-viewer::backdrop { background: #080808; }
.vk-viewer-image-close { position: absolute; inset: 56px 70px; display: block; width: calc(100% - 140px); height: calc(100% - 112px); padding: 0; border: 0; background: transparent; cursor: zoom-out; }
.vk-viewer-image { display: block; width: 100%; height: 100%; object-fit: contain; }
.vk-viewer-close, .vk-viewer-arrow { position: absolute; z-index: 1; display: grid; place-items: center; width: 48px; height: 48px; min-height: 48px; padding: 0; border: 0; background: transparent; color: #fff; font: 32px/1 Arial, sans-serif; text-shadow: 0 1px 5px #000; cursor: pointer; transition: opacity 180ms ease; }
.vk-viewer-close { top: 12px; right: 12px; }
.vk-viewer-arrow { top: calc(50% - 24px); }
.vk-viewer-prev { left: 12px; }
.vk-viewer-next { right: 12px; }
.vk-viewer-close:hover, .vk-viewer-arrow:hover { color: #bbb; }
.vk-viewer.controls-idle .vk-viewer-close,
.vk-viewer.controls-idle .vk-viewer-arrow { opacity: 0; pointer-events: none; }
.vk-viewer.controls-idle, .vk-viewer.controls-idle .vk-viewer-image-close { cursor: none; }
.sd-project .vk-viewer :focus-visible { outline-color: #fff; outline-offset: 3px; }
.vk-viewer-count { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); font: 13px/1.5 'Courier New', monospace; pointer-events: none; }
.viewer-open { overflow: hidden; }
.sd-project [hidden] { display: none !important; }
@media (max-width: 600px) {
  .sd-project .project-page { width: calc(100% - 32px); margin-top: 16px; }
  .sd-project .sd-hero { margin: 0 auto 36px; }
  .vk-gallery { margin-bottom: 48px; }
  .vk-featured { margin-bottom: 16px; }
  .vk-grid { gap: 8px; }
  .vk-essay { font-size: 17px; line-height: 1.7; }
  .vk-viewer-image-close { inset: 64px 8px 88px; width: calc(100% - 16px); height: calc(100% - 152px); }
  .vk-viewer-arrow { top: auto; bottom: 16px; }
  .vk-viewer-prev { left: 16px; }
  .vk-viewer-next { right: 16px; }
  .vk-viewer-count { bottom: 30px; }
}
