/* Krace gallery + lightbox (preview). Uses site vars --primary / --lavender. */
.g-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:0; padding:0; list-style:none; }
@media (min-width:640px)  { .g-grid { grid-template-columns:repeat(3,1fr); gap:14px; } }
@media (min-width:1024px) { .g-grid.g-4 { grid-template-columns:repeat(4,1fr); gap:16px; } }
.g-item { display:block; position:relative; aspect-ratio:4/5; border-radius:16px; overflow:hidden;
  background:#e6e5ec; box-shadow:0 6px 18px rgba(107,100,158,0.10); cursor:zoom-in;
  -webkit-tap-highlight-color:transparent; }
.g-item img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.g-item:hover img { transform:scale(1.03); }
.g-item:focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
.g-item[hidden] { display:none; }
.g-chips[hidden] { display:none; }
.g-chips { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:0 0 26px; }
.g-chip { font:inherit; font-weight:700; font-size:1rem; color:var(--primary); background:#f5f4f9;
  border:1px solid rgba(107,100,158,0.18); border-radius:999px; padding:8px 20px; cursor:pointer; }
.g-chip[aria-pressed="true"] { background:var(--primary); color:#fff; border-color:var(--primary); }
.g-more { display:inline-block; margin-top:28px; color:var(--primary); font-weight:800; font-size:1.15rem; text-decoration:underline; }
/* Lightbox */
.lb { position:fixed; inset:0; z-index:10000; background:rgba(18,14,32,0.94); display:none;
  align-items:center; justify-content:center; touch-action:pan-y; }
.lb.open { display:flex; }
.lb img { max-width:92vw; max-height:84vh; object-fit:contain; border-radius:10px; user-select:none; -webkit-user-drag:none;
  transition:transform .2s ease, opacity .2s ease; }
.lb button { position:absolute; background:rgba(255,255,255,0.14); color:#fff; border:0; cursor:pointer;
  width:48px; height:48px; border-radius:50%; font-size:1.6rem; line-height:48px; padding:0; }
.lb button:hover, .lb button:focus-visible { background:rgba(255,255,255,0.28); outline:none; }
.lb .lb-close { top:16px; right:16px; }
.lb .lb-prev { left:14px; top:50%; transform:translateY(-50%); }
.lb .lb-next { right:14px; top:50%; transform:translateY(-50%); }
.lb .lb-count { position:absolute; bottom:18px; left:0; right:0; text-align:center; color:rgba(255,255,255,0.8);
  font-size:0.95rem; letter-spacing:1px; pointer-events:none; }
@media (max-width:640px) { .lb .lb-prev, .lb .lb-next { top:auto; bottom:10px; transform:none; } .lb .lb-count { bottom:22px; } }
body.lb-lock { overflow:hidden; }
