/*
Theme Name: Fotograf Ante
Template: enso
Version: 2.1.0.1761598544
*/


.copyright a, .copyright a:hover {
  font-weight: normal !important;
}


.post-content-container.port-below-gallery {
  margin-top: 3%;
}


/* ==========================================================================
   Portfolio "Image grid" item format (3 per row)
   ========================================================================== */

.port-image-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.port-image-grid .port-grid-item {
  margin: 0;
  overflow: hidden;
  /* The theme hides .image-wrapper until its JS reveals it; these tiles are
     static, so keep them visible. */
  opacity: 1;
  visibility: visible;
}

.port-image-grid .port-grid-item a,
.port-image-grid .port-grid-item .image-only {
  display: block;
}

/* Uniform square tiles; images fill the tile using the thumbnail source. */
.port-image-grid .port-grid-item img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* Caption is only for the lightbox — keep it out of the grid. */
.port-image-grid .port-grid-item .image-caption {
  display: none;
}

/* Responsive: 2 per row on tablets, 1 per row on phones. */
@media only screen and (max-width: 768px) {
  .port-image-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
  }
}

@media only screen and (max-width: 480px) {
  .port-image-grid {
    grid-template-columns: 1fr;
  }
}


/* ==========================================================================
   Portfolio "Image masonry" item format (3 columns, CSS columns)
   ========================================================================== */

.port-image-masonry {
  column-count: 3;
  column-gap: 20px;
  position: relative;
}

/* When the masonry JS is active it positions tiles absolutely instead. */
.port-image-masonry.masonry-enabled {
  column-count: auto;
  column-gap: 0;
}

.port-image-masonry.masonry-enabled .port-masonry-item {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
}

/* Keep each image whole within a single column. */
.port-image-masonry .port-masonry-item {
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  margin: 0 0 20px;
  /* The theme hides .image-wrapper until its JS reveals it; these tiles are
     static, so keep them visible. */
  opacity: 1;
  visibility: visible;
}

.port-image-masonry .port-masonry-item a,
.port-image-masonry .port-masonry-item .image-only {
  display: block;
}

/* Masonry keeps each image's natural aspect ratio. */
.port-image-masonry .port-masonry-item img {
  display: block;
  width: 100%;
  height: auto;
}

/* Caption is only for the lightbox — keep it out of the layout. */
.port-image-masonry .port-masonry-item .image-caption {
  display: none;
}

/* Responsive: 2 columns on tablets, 1 on phones. */
@media only screen and (max-width: 768px) {
  .port-image-masonry {
    column-count: 2;
    column-gap: 15px;
  }
}

@media only screen and (max-width: 480px) {
  .port-image-masonry {
    column-count: 1;
  }
}

/* ==========================================================================
   Portfolio image preloader (all formats: Image, Mixed, Grid, Masonry)
   ========================================================================== */

/* Per-image placeholders replace the theme's single "Loading" bar. */
.single-uxbarn_portfolio .portfolio-loading {
  display: none;
}

/* Don't lock the stacked "Image" format to a fixed height while loading. */
.single-uxbarn_portfolio .image-slideshow .port-format-content {
  height: auto;
}

.port-format-content .fotoante-media {
  position: relative;
}

/* Animated shimmer shown over the slot while the image loads. */
.port-format-content .fotoante-media.fotoante-loading::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  pointer-events: none;
  background-color: #ececec;
  background-image: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.6) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  background-size: 200% 100%;
  background-repeat: no-repeat;
  animation: fotoante-shimmer 1.4s ease-in-out infinite;
}

@keyframes fotoante-shimmer {
  0%   { background-position: 150% 0; }
  100% { background-position: -150% 0; }
}

/* Fade the image in once it has loaded. */
.port-format-content .fotoante-media img {
  transition: opacity 0.5s ease;
}

.port-format-content .fotoante-media.fotoante-loading img {
  opacity: 0;
}

.port-format-content .fotoante-media.fotoante-loaded img {
  opacity: 1;
}

/* Respect reduced-motion preferences: no shimmer animation, still fades. */
@media (prefers-reduced-motion: reduce) {
  .port-format-content .fotoante-media.fotoante-loading::before {
    animation: none;
  }
}


/* Below-gallery WYSIWYG content: full width, no float, spaced from the gallery. */
.port-below-gallery .post-content-wrapper {
  width: 100%;
  float: none;
  margin-top: 3%;
}


/* Portfolio single: portrait images are served from the 1280px size (sharper),
   but shown 600px wide on desktop. Tablet/mobile keep the fluid width. */
@media only screen and (min-width: 769px) {
  .single-uxbarn_portfolio .image-wrapper.portrait img {
    width: 600px;
    max-width: 100%;
    height: auto;
  }
}


/* Portfolio single: uploaded (media library) videos use the native player,
   in the same 16:9 box the theme gives YouTube / Vimeo embeds. */
.video-wrapper.video-native video {
  background: #000;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}


/* Video captions: video + caption are one block; the block carries the spacing
   the theme normally puts on .video-wrapper. */
.video-item {
  margin-bottom: 11.7%; /* same as .video-wrapper */
}

.video-item:last-child {
  margin-bottom: 0;
}

.video-item .video-wrapper {
  margin-bottom: 0;
}

.video-item .video-caption {
  font-size: 0.92em;
  margin: 1em 0 0;
  text-align: right;
}