:root {
  --es-gold: #B18A50;
  --es-gold-dark: #9C7742;
  --es-gold-deep: #8C6C3C;
  --es-gold-light: #D9B36A;
  --es-cream: #FFE9BC;
  --es-sand: #EFE7DA;
  --es-ink: #0E0B07;
  --es-brown: #4A361E;
  --es-brown-dark: #3A2917;
  --es-brown-deep: #241A10;
  --es-teal-deep: #1E4A52;
  --es-text: #4A4036;
  --es-text-muted: #6B5B45;
  --es-white: #FFFFFF;
  --es-line-on-gold: rgba(255, 255, 255, 0.60);
  --es-line-gold: rgba(177, 138, 80, 0.25);
  --es-font-sans: "Raleway", "Helvetica Neue", Arial, sans-serif;
  --es-track-wide: 0.10em;
  --es-track-xwide: 0.14em;
  --es-max: 1440px;
  --es-pad-x: 52px;
  --es-hero-h: min(78vh, 700px);
  --es-nav-h: 79px;
  --es-open: 75%;
  --es-closed: 25%;
  --es-even: 50%;
  --es-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --es-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --es-dur: 0.62s;
  --es-hero-dur: 0.62s;
  --es-hero-ease: cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 1600px) {
  :root {
    --es-pad-x: 32px;
  }
}
@media (max-width: 560px) {
  :root {
    --es-pad-x: 20px;
  }
}
.es-gal__wrap {
  max-width: var(--es-max);
  margin: 0 auto;
  padding: 3rem var(--es-pad-x) 5rem;
}

/* --- Filtrinupud ----------------------------------------------------------- */
.es-gal__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 2.5rem;
}

.es-page .es-gal__tab {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  padding: 10px 18px;
  border: 1px solid var(--es-line-gold);
  border-radius: 0;
  background: transparent;
  font-family: var(--es-font-sans);
  font-size: 11.5px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--es-track-wide);
  color: var(--es-text-muted);
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}
.es-page .es-gal__tab:hover, .es-page .es-gal__tab:focus {
  background: var(--es-sand);
  color: var(--es-gold-deep);
}
.es-page .es-gal__tab.is-current {
  background: var(--es-gold);
  border-color: var(--es-gold);
  color: #fff;
}

.es-gal__count {
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.06em;
  opacity: 0.7;
}

/* --- Grupid ---------------------------------------------------------------- */
.es-gal__group {
  margin-bottom: 3.5rem;
  scroll-margin-top: calc(var(--es-nav-h) + 16px);
}
.es-gal__group:last-child {
  margin-bottom: 0;
}
.es-gal__group[hidden] {
  display: none;
}

.es-gal__h2 {
  margin: 0 0 1.5rem;
  font-family: var(--es-font-sans);
  font-size: clamp(19px, 2.2vw, 25px);
  font-weight: 200;
  text-transform: uppercase;
  letter-spacing: 0.13em;
  color: var(--es-ink);
}

.es-gal__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 14px;
}

.es-page .es-gal__item {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--es-line-gold);
  background: var(--es-sand);
}
.es-page .es-gal__item img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  transition: transform 0.45s ease;
}
.es-page .es-gal__item:hover img,
.es-page .es-gal__item img:focus {
  transform: scale(1.04);
}

@media (max-width: 700px) {
  .es-gal__wrap {
    padding-top: 2.25rem;
  }
  .es-gal__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .es-gal__group {
    margin-bottom: 2.5rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .es-page .es-gal__item img {
    transition: none;
  }
}