/* ManuTech – galéria (2026-10-31), a site.css színeire építve */
.chips .n { font-size: 0.75rem; opacity: .7; margin-left: 4px; font-variant-numeric: tabular-nums; }
.chip-alkatresz[aria-pressed="true"] { background: var(--steel); border-color: var(--steel); color: var(--bg); }

.gal { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 1000px) { .gal { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px)  { .gal { grid-template-columns: repeat(2, 1fr); gap: 8px; } }
.gal li { min-width: 0; }
.gal a { position: relative; display: block; border-radius: var(--r); overflow: hidden; background: var(--bg-e); aspect-ratio: 4 / 3; }
.gal picture, .gal img { display: block; width: 100%; height: 100%; }
.gal img { object-fit: cover; transition: transform .35s ease; }
.gal a:hover img { transform: scale(1.04); }
.gal .cap { position: absolute; inset: auto 0 0 0; padding: 26px 12px 10px; display: grid; gap: 1px;
  background: linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,0)); color: #fff; opacity: 0; transition: opacity .2s; }
.gal a:hover .cap, .gal a:focus-visible .cap { opacity: 1; }
@media (hover: none) { .gal .cap { opacity: 1; } }
.gal .nm { font-weight: 600; font-size: 0.875rem; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gal .ct { font-size: 0.75rem; opacity: .8; }
.gal-none { color: var(--fg-m); margin-top: 18px; }

.gal-empty { border: 1px dashed var(--border); border-radius: var(--r); padding: 40px 24px; text-align: center; display: grid; gap: 12px; justify-items: center; }
.gal-empty p { color: var(--fg-m); max-width: 56ch; }
.gal-empty-cta { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-top: 6px; }

/* nagyító */
body.lb-open { overflow: hidden; }
.lb { border: 0; padding: 0; margin: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; background: rgba(8, 8, 7, .94); color: #fff; }
.lb::backdrop { background: rgba(8, 8, 7, .92); }
.lb-in { position: relative; width: 100%; height: 100%; display: grid; place-items: center; padding: 56px 64px 24px; }
.lb figure { margin: 0; display: grid; gap: 14px; max-width: min(1200px, 100%); max-height: 100%; grid-template-rows: minmax(0, 1fr) auto; }
.lb picture { min-height: 0; display: flex; justify-content: center; }
.lb img { max-width: 100%; max-height: calc(100dvh - 190px); object-fit: contain; border-radius: 4px; }
.lb figcaption { display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.lb figcaption strong { display: block; font-family: var(--d); font-size: 1.0625rem; }
.lb figcaption span { color: rgba(255,255,255,.7); font-size: 0.875rem; }
.lb-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.lb .btn-ghost { color: #fff; border-color: rgba(255,255,255,.35); }
.lb-x, .lb-nav { position: absolute; background: rgba(255,255,255,.1); color: #fff; border: 0; cursor: pointer; border-radius: 999px;
  display: grid; place-items: center; font-size: 1.5rem; line-height: 1; }
.lb-x { top: 12px; right: 12px; width: 44px; height: 44px; font-size: 1.125rem; }
.lb-nav { top: 50%; transform: translateY(-50%); width: 48px; height: 48px; font-size: 2rem; }
.lb-prev { left: 10px; } .lb-next { right: 10px; }
.lb-x:hover, .lb-nav:hover { background: rgba(255,255,255,.2); }
.lb-count { position: absolute; top: 20px; left: 20px; font-size: 0.8125rem; color: rgba(255,255,255,.7); font-variant-numeric: tabular-nums; }
@media (max-width: 700px) {
  .lb-in { padding: 56px 10px 16px; }
  .lb-nav { top: auto; bottom: 14px; transform: none; width: 44px; height: 44px; }
  .lb figure { padding-bottom: 56px; }
  .lb img { max-height: calc(100dvh - 260px); }
}
@media (prefers-reduced-motion: reduce) { .gal img { transition: none; } .gal a:hover img { transform: none; } }