:root{
  --bg: #FDFBF7;
  --stone-900: #1c1917;
  --stone-800: #292524;
  --stone-200: #e7e5e4;
  --stone-300: #d6d3d1;
}

html, body { height: 100%; }
body { background: var(--bg); }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

.hover-underline { position: relative; }
.hover-underline::after {
  content:'';
  position:absolute;
  width:100%;
  transform:scaleX(0);
  height:1px;
  bottom:-2px;
  left:0;
  background-color: currentColor;
  transform-origin: bottom right;
  transition: transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
}
.hover-underline:hover::after {
  transform:scaleX(1);
  transform-origin: bottom left;
}

.break-inside-avoid { break-inside: avoid; }

.focus-ring:focus{
  outline: none;
  box-shadow: 0 0 0 2px rgba(28,25,23,0.18);
}

.gallery-grid { column-count: 1; column-gap: 2rem; }
@media (min-width: 768px){ .gallery-grid { column-count: 2; } }
@media (min-width: 1280px){ .gallery-grid { column-count: 3; } }

/* Smooth image reveal */
.nd-img{ filter: saturate(.6); transition: transform 1.4s ease, filter .6s ease, opacity .6s ease; opacity: .98; }
.group:hover .nd-img{ transform: scale(1.03); filter: saturate(1); opacity: 1; }

/* Modal menu */
.nd-overlay{ background: rgba(253,251,247,.92); backdrop-filter: blur(8px); }