.itn-picture-wall {
  --gap: var(--itn-picture-wall-gap, 16px);
  --cols-desktop: var(--itn-picture-wall-cols-desktop, 3);
  --cols-tablet: var(--itn-picture-wall-cols-tablet, 2);
  --cols-mobile: var(--itn-picture-wall-cols-mobile, 1);
  position: relative;
  margin: 0 auto;
  border: var(--itn-picture-wall-border-width, 0px) var(--itn-picture-wall-border-style, none) var(--itn-picture-wall-border-color, transparent);
  border-radius: var(--itn-picture-wall-border-radius, 0px);
  box-sizing: border-box;
}

.itn-picture-wall > p:empty,
.itn-picture-wall-inner > p:empty,
.itn-picture-wall-item > p:empty,
.itn-picture-wall-media > p:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.itn-picture-wall-inner {
  display: grid;
  gap: var(--gap);
  grid-template-columns: repeat(var(--cols-desktop), minmax(0, 1fr));
}

.itn-picture-wall-item {
  position: relative;
  background: var(--itn-picture-wall-item-bg, transparent);
  border: var(--itn-picture-wall-item-border-width, 0px) var(--itn-picture-wall-item-border-style, solid) var(--itn-picture-wall-item-border-color, transparent);
  border-radius: var(--itn-picture-wall-item-border-radius, 20px);
  padding: var(--itn-picture-wall-padding-top, 12px) var(--itn-picture-wall-padding-right, 12px) var(--itn-picture-wall-padding-bottom, 12px) var(--itn-picture-wall-padding-left, 12px);
  margin: var(--itn-picture-wall-margin-top, 0px) var(--itn-picture-wall-margin-right, 0px) var(--itn-picture-wall-margin-bottom, 0px) var(--itn-picture-wall-margin-left, 0px);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  opacity: 1;
  transform: none;
}

.itn-picture-wall.is-enhanced .itn-picture-wall-item {
  transition: opacity var(--itn-pw-transition-duration, 320ms) ease, transform var(--itn-pw-transition-duration, 320ms) ease;
}
.itn-picture-wall-item.is-visible { opacity: 1; transform: translateY(0) scale(1); }
.itn-picture-wall.is-enhanced .itn-picture-wall-item.is-hidden { opacity: 0; transform: translateY(8px) scale(.99); }
.itn-picture-wall-item[hidden] { display: none !important; }

.itn-picture-wall-media { position: relative; overflow: hidden; border-radius: inherit; min-height: 1px; isolation: isolate; }
/* Some page builders run wpautop after the shortcode and wrap the inline overlay in a paragraph. */
.itn-picture-wall-media > p { margin: 0 !important; padding: 0 !important; font-size: 0; line-height: 0; }
.itn-picture-wall-image, .itn-picture-wall-image > a { display: block; }
.itn-picture-wall-image img { width: 100%; height: auto; display: block; border-radius: inherit; }
.itn-pw-ratio-square .itn-picture-wall-media { aspect-ratio: 1 / 1; }
.itn-pw-ratio-four-three .itn-picture-wall-media { aspect-ratio: 4 / 3; }
.itn-pw-ratio-three-two .itn-picture-wall-media { aspect-ratio: 3 / 2; }
.itn-pw-ratio-sixteen-nine .itn-picture-wall-media { aspect-ratio: 16 / 9; }
.itn-pw-ratio-custom .itn-picture-wall-media { aspect-ratio: var(--itn-picture-wall-ratio-width, 3) / var(--itn-picture-wall-ratio-height, 2); }
.itn-picture-wall[class*="itn-pw-ratio-"]:not(.itn-pw-ratio-original) .itn-picture-wall-image,
.itn-picture-wall[class*="itn-pw-ratio-"]:not(.itn-pw-ratio-original) .itn-picture-wall-image > a { width: 100%; height: 100%; }
.itn-picture-wall[class*="itn-pw-ratio-"]:not(.itn-pw-ratio-original) .itn-picture-wall-image img { width: 100%; height: 100%; object-fit: cover; }
.itn-pw-fit-contain[class*="itn-pw-ratio-"]:not(.itn-pw-ratio-original) .itn-picture-wall-image img { object-fit: contain; }

.itn-picture-wall-overlay { position: absolute; inset: 0; z-index: 1; background: var(--itn-hover-overlay-color, rgba(0,0,0,.3)); opacity: 0; pointer-events: none; transition: opacity var(--itn-pw-transition-duration, 320ms) ease; }
.itn-pw-overlay-enabled .itn-picture-wall-item:hover .itn-picture-wall-overlay,
.itn-pw-overlay-enabled .itn-picture-wall-item:focus-within .itn-picture-wall-overlay { opacity: 1; }

.itn-picture-wall-content { position: absolute; z-index: 3; box-sizing: border-box; max-width: 100%; margin: 0; pointer-events: none; }
.itn-picture-wall-content a, .itn-picture-wall-content button { pointer-events: auto; }
.itn-picture-wall-content > :first-child { margin-top: 0; }
.itn-picture-wall-content > :last-child { margin-bottom: 0; }
.itn-picture-wall-content-always {
  --itn-pw-content-margin-top: var(--itn-pw-always-margin-top, 12px);
  --itn-pw-content-margin-right: var(--itn-pw-always-margin-right, 12px);
  --itn-pw-content-margin-bottom: var(--itn-pw-always-margin-bottom, 12px);
  --itn-pw-content-margin-left: var(--itn-pw-always-margin-left, 12px);
  --itn-pw-content-center-x: var(--itn-pw-always-margin-center-x, 0px);
  --itn-pw-content-center-y: var(--itn-pw-always-margin-center-y, 0px);
  width: var(--itn-pw-always-width, 100%); color: var(--itn-pw-always-color, #fff); background: var(--itn-pw-always-background, rgba(0,0,0,.45));
  max-width: max(0px, calc(100% - var(--itn-pw-always-margin-left, 12px) - var(--itn-pw-always-margin-right, 12px)));
  padding: var(--itn-pw-always-padding, 12px); border: var(--itn-pw-always-border, 0 solid transparent);
  border-radius: var(--itn-pw-always-radius, 0); text-align: var(--itn-pw-always-text-align, left); font-size: var(--itn-pw-always-font-size, 16px); line-height: var(--itn-pw-always-line-height, 1.4);
}
.itn-picture-wall-content-hover {
  --itn-pw-content-margin-top: var(--itn-pw-hover-margin-top, 0px);
  --itn-pw-content-margin-right: var(--itn-pw-hover-margin-right, 0px);
  --itn-pw-content-margin-bottom: var(--itn-pw-hover-margin-bottom, 0px);
  --itn-pw-content-margin-left: var(--itn-pw-hover-margin-left, 0px);
  --itn-pw-content-center-x: var(--itn-pw-hover-margin-center-x, 0px);
  --itn-pw-content-center-y: var(--itn-pw-hover-margin-center-y, 0px);
  width: var(--itn-pw-hover-width, 100%); color: var(--itn-pw-hover-color, #fff); background: var(--itn-pw-hover-background, transparent);
  max-width: max(0px, calc(100% - var(--itn-pw-hover-margin-left, 0px) - var(--itn-pw-hover-margin-right, 0px)));
  padding: var(--itn-pw-hover-padding, 20px); border: var(--itn-pw-hover-border, 0 solid transparent);
  border-radius: var(--itn-pw-hover-radius, 0); text-align: var(--itn-pw-hover-text-align, center); font-size: var(--itn-pw-hover-font-size, 16px); line-height: var(--itn-pw-hover-line-height, 1.4);
  opacity: 0; visibility: hidden; transition: opacity var(--itn-pw-transition-duration, 320ms) ease, transform var(--itn-pw-transition-duration, 320ms) ease;
}
.itn-picture-wall-item:hover .itn-picture-wall-content-hover,
.itn-picture-wall-item:focus-within .itn-picture-wall-content-hover { opacity: 1; visibility: visible; transform: translate(0,0) scale(1) rotateX(0); }

.itn-pw-position-top-left { top: var(--itn-pw-content-margin-top); left: var(--itn-pw-content-margin-left); }
.itn-pw-position-top-center { top: var(--itn-pw-content-margin-top); left: calc(50% + var(--itn-pw-content-center-x)); translate: -50% 0; }
.itn-pw-position-top-right { top: var(--itn-pw-content-margin-top); right: var(--itn-pw-content-margin-right); }
.itn-pw-position-center-left { top: calc(50% + var(--itn-pw-content-center-y)); left: var(--itn-pw-content-margin-left); translate: 0 -50%; }
.itn-pw-position-center { top: calc(50% + var(--itn-pw-content-center-y)); left: calc(50% + var(--itn-pw-content-center-x)); translate: -50% -50%; }
.itn-pw-position-center-right { top: calc(50% + var(--itn-pw-content-center-y)); right: var(--itn-pw-content-margin-right); translate: 0 -50%; }
.itn-pw-position-bottom-left { bottom: var(--itn-pw-content-margin-bottom); left: var(--itn-pw-content-margin-left); }
.itn-pw-position-bottom-center { bottom: var(--itn-pw-content-margin-bottom); left: calc(50% + var(--itn-pw-content-center-x)); translate: -50% 0; }
.itn-pw-position-bottom-right { bottom: var(--itn-pw-content-margin-bottom); right: var(--itn-pw-content-margin-right); }

.itn-pw-animation-slide-up .itn-picture-wall-content-hover { transform: translateY(28px); }
.itn-pw-animation-slide-down .itn-picture-wall-content-hover { transform: translateY(-28px); }
.itn-pw-animation-slide-left .itn-picture-wall-content-hover { transform: translateX(28px); }
.itn-pw-animation-slide-right .itn-picture-wall-content-hover { transform: translateX(-28px); }
.itn-pw-animation-zoom .itn-picture-wall-content-hover { transform: scale(.78); }
.itn-pw-animation-flip .itn-picture-wall-content-hover { transform: rotateX(70deg); transform-origin: center; }

.itn-picture-wall-fulllink { position: absolute; inset: 0; z-index: 2; border-radius: var(--itn-picture-wall-item-border-radius, 20px); }

.itn-pw-hover-zoom .itn-picture-wall-item {
  overflow: hidden;
}
.itn-pw-hover-zoom .itn-picture-wall-image img {
  transition: transform var(--itn-pw-transition-duration, 320ms) ease;
}
.itn-pw-hover-zoom .itn-picture-wall-item:hover .itn-picture-wall-image img,
.itn-pw-hover-zoom .itn-picture-wall-item:focus-within .itn-picture-wall-image img {
  transform: scale(1.05);
}

@media (hover: none) {
  .itn-picture-wall-content-hover { opacity: 1; visibility: visible; transform: none; }
  .itn-pw-overlay-enabled .itn-picture-wall-overlay { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .itn-picture-wall *, .itn-picture-wall *::before, .itn-picture-wall *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

.itn-pw-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.itn-pw-filter-button,
.itn-pw-load-more {
  cursor: pointer;
  border: 1px solid #008f88;
  color: #008f88;
  background: #fff;
  padding: 8px 14px;
  transition: all .25s ease;
}
.itn-pw-filter-button.is-active,
.itn-pw-filter-button:hover,
.itn-pw-load-more:hover { background: #008f88; color: #fff; }

.itn-pw-filter-style-pill .itn-pw-filter-button,
.itn-pw-load-more-style-pill { border-radius: 999px; }
.itn-pw-filter-style-solid .itn-pw-filter-button,
.itn-pw-load-more-style-solid { background: #008f88; color: #fff; border-radius: 8px; }
.itn-pw-filter-style-outline .itn-pw-filter-button,
.itn-pw-load-more-style-outline { border-radius: 8px; }

.itn-pw-load-more-wrap { margin-top: 16px; text-align: center; }

.itn-picture-wall.itn-pw-layout-masonry .itn-picture-wall-inner {
  column-count: var(--cols-desktop);
  column-gap: var(--gap);
  display: block;
}
.itn-picture-wall.itn-pw-layout-masonry .itn-picture-wall-item {
  break-inside: avoid;
  margin-bottom: var(--gap);
  width: 100%;
}

.itn-picture-wall.itn-pw-layout-mosaic .itn-picture-wall-inner {
  grid-auto-flow: dense;
}
.itn-picture-wall.itn-pw-layout-mosaic .itn-picture-wall-item:nth-child(6n+1),
.itn-picture-wall.itn-pw-layout-mosaic .itn-picture-wall-item:nth-child(6n+4) {
  grid-column: span 2;
}

.itn-picture-wall-edit-link-wrap { margin: 12px 0 0; }
.itn-picture-wall-edit-link { display: inline-block; padding: 6px 12px; border: 1px solid #2271b1; background: #f6f7f7; text-decoration: none !important; }