html { scroll-behavior: smooth; }
body { line-height: 1.7; }
h1, h2, h3, h4 { font-family: "Playfair Display", serif; }
#site-header.scrolled { box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35); }
[data-nav].active { color: #c9a96a; border-bottom: 2px solid #c9a96a; }
:focus-visible { outline: 3px solid #c9a96a; outline-offset: 2px; }

.js .reveal { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease, transform 0.6s ease; }
.js .reveal.in { opacity: 1; transform: none; }

.masonry { column-count: 1; column-gap: 1rem; }
@media (min-width: 640px) { .masonry { column-count: 2; } }
@media (min-width: 1024px) { .masonry { column-count: 3; } }
.gallery-item { break-inside: avoid; margin-bottom: 1rem; }
.gallery-item img { transition: transform 0.4s ease; }
.gallery-item:hover img { transform: scale(1.04); }

.filter-btn { border: 1px solid #c9a96a; color: #1a1a1a; background: transparent; }
.filter-btn[aria-pressed="true"] { background: #c9a96a; }

#lightbox { position: fixed; inset: 0; z-index: 70; display: none; align-items: center; justify-content: center; padding: 1rem; background: rgba(0, 0, 0, 0.9); }
#lightbox.open { display: flex; }
#lightbox img { max-width: 100%; max-height: 88vh; border-radius: 0.375rem; }
#lightbox-close { position: absolute; top: 1rem; right: 1rem; padding: 0.75rem 1.25rem; background: #c9a96a; color: #1a1a1a; font-weight: 600; border-radius: 0.25rem; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js .reveal { opacity: 1; transform: none; transition: none; }
  .gallery-item img { transition: none; }
}