/*
 * Illustration gallery styles.
 * Moved out from style.css to keep the Illustration CPT isolated from portfolio-gallery and single-portfolio styles.
 */

/* ================================================
   ILLUSTRATIONS SHORTCODE GALLERY
   independent from single-portfolio
   ================================================ */

.illustrations-gallery-shortcode {
  width: 100%;
  max-width: 100vw;
  overflow-x: clip;
  box-sizing: border-box;
}

.illustrations-gallery-shortcode .illustrations-grid {
  display: flex;
  flex-direction: column;
  gap: var(--illustrations-grid-gap-vertical, 3px);
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
  box-sizing: border-box;
}

.illustrations-gallery-shortcode .illustrations-grid-row {
  --illustrations-row-height: 200px;
  --illustrations-row-gap-count: 0;
  display: flex;
  flex-wrap: nowrap;
  column-gap: var(--illustrations-grid-gap-horizontal, 3px);
  width: 100%;
  max-width: 100%;
  min-height: var(--illustrations-row-height);
  overflow-x: clip;
  box-sizing: border-box;
}

.illustrations-gallery-shortcode .illustrations-grid-row[hidden],
.illustrations-gallery-shortcode .illustrations-grid-item[hidden],
.illustrations-gallery-shortcode .illustrations-grid-item-text-card[hidden] {
  display: none !important;
}

.illustrations-gallery-shortcode .illustrations-grid-row:first-child .illustrations-grid-item {
  margin-top: 0;
}

.illustrations-gallery-shortcode .illustrations-grid-item {
  position: relative;
  display: block;
  flex: 0 0 var(--illustrations-item-width, 100%);
  width: var(--illustrations-item-width, 100%);
  flex-basis: calc((100% - (var(--illustrations-grid-gap-horizontal, 3px) * var(--illustrations-row-gap-count, 0))) * var(--illustrations-item-factor, 1));
  width: calc((100% - (var(--illustrations-grid-gap-horizontal, 3px) * var(--illustrations-row-gap-count, 0))) * var(--illustrations-item-factor, 1));
  max-width: 100%;
  min-width: 0;
  height: var(--illustrations-row-height);
  border: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
  cursor: pointer;
  background: #0e0e0e;
  border-radius: var(--illustrations-grid-corner-radius, 5px);
  border-style: var(--illustrations-grid-border-style, none);
  border-width: var(--illustrations-grid-border-size, 0px);
  border-color: var(--illustrations-grid-border-color, #000000);
  -webkit-appearance: none;
  appearance: none;
  isolation: isolate;
}

.illustrations-gallery-shortcode .illustrations-grid-item:active,
.illustrations-gallery-shortcode .illustrations-grid-item:focus,
.illustrations-gallery-shortcode .illustrations-grid-item:focus-visible {
  outline: none;
}

.illustrations-gallery-shortcode .illustrations-grid-item img {
  position: relative;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1);
  transform-origin: center center;
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1), filter 0.5s ease;
  will-change: transform;
}

.illustrations-gallery-shortcode .illustrations-grid-item:hover img {
  transform: scale(1.06);
}

/* full-cover texture layer only */
.illustrations-gallery-shortcode .illustrations-grid-overlay {
  position: absolute;
  inset: 0;
  background-image: url("https://milomassacci.com/wp-content/uploads/2025/12/diagonal-lines_v001-01.png");
  background-color: rgba(100, 142, 151, 0.55);;
  background-size: var(--illustrations-overlay-pattern-size, 320px 320px);
  background-position: top left;
  background-repeat: repeat;
  mix-blend-mode: multiply;
  opacity: 0;
  pointer-events: none;
  z-index: 1;
  transition: opacity 0.4s ease;
}

.illustrations-grid-meta {
  transition: opacity 0.4s ease 0.05s, transform 0.4s ease 0.05s;
}

.illustrations-gallery-shortcode .illustrations-grid-meta {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% - 32px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  text-align: center;
  color: #fff;
  opacity: 0;
  transform: translate(-50%, -50%) translateY(20px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  z-index: 4;
  pointer-events: none;
}

.illustrations-gallery-shortcode .illustrations-grid-meta.is-empty {
  display: none;
}

.illustrations-gallery-shortcode .illustrations-grid-item:hover .illustrations-grid-overlay,
.illustrations-gallery-shortcode .illustrations-grid-item:focus-visible .illustrations-grid-overlay,
.illustrations-gallery-shortcode .illustrations-grid-item:active .illustrations-grid-overlay {
  opacity: 1;
}

.illustrations-gallery-shortcode .illustrations-grid-item:hover .illustrations-grid-meta,
.illustrations-gallery-shortcode .illustrations-grid-item:focus-visible .illustrations-grid-meta,
.illustrations-gallery-shortcode .illustrations-grid-item:active .illustrations-grid-meta {
  opacity: 1;
  transform: translate(-50%, -50%) translateY(0);
}

.illustrations-gallery-shortcode .illustrations-grid-meta .caption-title,
.illustrations-gallery-shortcode .illustrations-grid-meta .caption-role {
  display: block;
  max-width: 100%;
  color: #fff;
  pointer-events: none;
}

.illustrations-gallery-shortcode .illustrations-grid-meta .caption-title {
  overflow: hidden;
  text-overflow: ellipsis;
}


.illustrations-gallery-shortcode .illustrations-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
}

.illustrations-gallery-shortcode .illustrations-lightbox-backdrop {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(0, 0, 0, 0.88);
  pointer-events: auto;
}

.illustrations-gallery-shortcode .illustrations-lightbox-dialog {
  position: relative;
  z-index: 2;
  width: 80vw;
  max-width: 80vw;
  height: 100vh;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.illustrations-gallery-shortcode .illustrations-lightbox-media-wrap {
  position: relative;
  z-index: 2;
  width: 100%;
  height: min(88vh, 900px);
  max-width: 100%;
  max-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
}

.illustrations-gallery-shortcode .illustrations-lightbox-image {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  display: block;
  border-radius: 6px;
  margin-top: 0;
  object-fit: contain;
}

.illustrations-gallery-shortcode .illustrations-lightbox-close,
.illustrations-gallery-shortcode .illustrations-lightbox-nav {
  appearance: none;
  position: fixed;
  /*border: 0;*/
  padding: 0;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(34, 34, 34, 0.65) !important;
  border-style: solid!important;
  border-radius: 999px !important;
  border-color: #2d2d2daa!important;
  border-width: 2px!important;	
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: background 0.25s ease, opacity 0.25s ease, transform 0.25s ease;
}

.illustrations-gallery-shortcode .illustrations-lightbox-close {
  top: 50px;
  right: 50px;
  width: 56px;
  height: 56px;
  border-radius: 5px;
  background: rgba(34, 34, 34, 0.65);
  z-index: 5;
}

.illustrations-gallery-shortcode .illustrations-lightbox-nav {
  top: 50%;
  width: 56px;
  height: 56px;
  border-radius: 5px;
  background: rgba(34, 34, 34, 0.65);
  z-index: 4;
  transform: translateY(-50%) scale(1);
}

.illustrations-gallery-shortcode .illustrations-lightbox-prev {
  left: 50px;
}

.illustrations-gallery-shortcode .illustrations-lightbox-next {
  right: 50px;
}

.illustrations-gallery-shortcode .illustrations-lightbox-close:hover,
.illustrations-gallery-shortcode .illustrations-lightbox-nav:hover {
  background: #648e97;
}

.illustrations-gallery-shortcode .illustrations-lightbox-close:active,
.illustrations-gallery-shortcode .illustrations-lightbox-nav:active {
  transform: translateY(-50%) scale(0.96);
}

.illustrations-gallery-shortcode .illustrations-lightbox-close:active {
  transform: scale(0.96);
}

.illustrations-gallery-shortcode .illustrations-lightbox-close:focus-visible,
.illustrations-gallery-shortcode .illustrations-lightbox-nav:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.9);
  outline-offset: 3px;
}

.illustrations-gallery-shortcode .illustrations-lightbox-close img {
  display: block;
  width: 18px;
  height: 18px;
  object-fit: contain;
  pointer-events: none;
  transition: transform 0.25s ease;
}

.illustrations-gallery-shortcode .illustrations-lightbox-nav img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  display: block;
  pointer-events: none;
  transition: transform 0.25s ease;
}

.illustrations-gallery-shortcode .illustrations-lightbox-prev:hover img {
  transform: translateX(6px);
}

.illustrations-gallery-shortcode .illustrations-lightbox-next:hover img {
  transform: translateX(-6px);
}

.illustrations-gallery-shortcode .illustrations-lightbox-close:hover img {
  transform: scale(0.9);
}

body.illustrations-lightbox-open {
  overflow: hidden;
}

@media (max-width: 768px) {
  .illustrations-gallery-shortcode .illustrations-grid-row {
    flex-wrap: wrap;
    row-gap: var(--illustrations-grid-gap-vertical, 3px);
    aspect-ratio: auto;
    min-height: 0;
  }

  .illustrations-gallery-shortcode .illustrations-grid-item {
    flex-basis: 100% !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0;
    aspect-ratio: 20 / 10;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-dialog {
    width: 80vw;
    max-width: 80vw;
    height: 100vh;
    margin: 0 auto;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-media-wrap {
    height: min(76vh, 900px);
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-close,
  .illustrations-gallery-shortcode .illustrations-lightbox-nav {
    width: 46px;
    height: 46px;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-close {
    top: 20px;
    right: 20px;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-prev {
    left: 20px;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-next {
    right: 20px;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-close img,
  .illustrations-gallery-shortcode .illustrations-lightbox-nav img {
    width: 20px;
    height: 20px;
  }
.illustrations-gallery-shortcode .illustrations-grid-item.mobile-focus .illustrations-grid-overlay {
    opacity: 1;
  }

  .illustrations-gallery-shortcode .illustrations-grid-item.mobile-focus .illustrations-grid-meta {
    opacity: 1;
    transform: translate(-50%, -50%) translateY(0);
  }

  .illustrations-gallery-shortcode .illustrations-grid-item.mobile-focus img {
    transform: scale(1.06);
  }	
	
	
}

/* ================================================
   ILLUSTRATIONS GALLERY — TEXT CARD MODE
   ================================================ */
.illustrations-gallery-shortcode .illustrations-grid-item-text-card {
    display: block;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: default;
}

.illustrations-gallery-shortcode .illustrations-grid-text-card {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: var(--illustrations-row-height, 200px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 24px;
    box-sizing: border-box;
    overflow: hidden;
    background-color: var(--illustrations-text-card-bg, #2d2d2d);
    border-radius: var(--illustrations-grid-corner-radius, 5px);
    border-style: var(--illustrations-grid-border-style, none);
    border-width: var(--illustrations-grid-border-size, 0px);
    border-color: var(--illustrations-grid-border-color, #000000);
    background-image: var(--illustrations-text-card-pattern-image, none);
    background-repeat: repeat;
    background-size: var(--illustrations-text-card-pattern-size, 100%);
    background-blend-mode: multiply;
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-project-name,
.illustrations-gallery-shortcode .illustrations-grid-text-card-client,
.illustrations-gallery-shortcode .illustrations-grid-text-card-role,
.illustrations-gallery-shortcode .illustrations-grid-text-card-year,
.illustrations-gallery-shortcode .illustrations-grid-text-card-description {
    display: block;
    width: 100%;
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-project-name {
    font-family: var(--illustrations-project_name-font-family, "Futura PT", sans-serif);
    font-size: var(--illustrations-project_name-font-size, 26px);
    font-weight: var(--illustrations-project_name-font-weight, 400);
    font-style: var(--illustrations-project_name-font-style, normal);
    line-height: var(--illustrations-project_name-line-height, 1.15);
    letter-spacing: var(--illustrations-project_name-letter-spacing, 2px);
    text-transform: var(--illustrations-project_name-text-transform, uppercase);
    color: var(--illustrations-project_name-color, #ffffff);
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-client {
    margin-top: 6px;
    font-family: var(--illustrations-client-font-family, "Futura PT", sans-serif);
    font-size: var(--illustrations-client-font-size, 14px);
    font-weight: var(--illustrations-client-font-weight, 400);
    font-style: var(--illustrations-client-font-style, normal);
    line-height: var(--illustrations-client-line-height, 1.3);
    letter-spacing: var(--illustrations-client-letter-spacing, 1.5px);
    text-transform: var(--illustrations-client-text-transform, uppercase);
    color: var(--illustrations-client-color, #ffffff);
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-role {
    margin-top: 6px;
    font-family: var(--illustrations-role-font-family, "Futura PT", sans-serif);
    font-size: var(--illustrations-role-font-size, 14px);
    font-weight: var(--illustrations-role-font-weight, 400);
    font-style: var(--illustrations-role-font-style, normal);
    line-height: var(--illustrations-role-line-height, 1.3);
    letter-spacing: var(--illustrations-role-letter-spacing, 1.5px);
    text-transform: var(--illustrations-role-text-transform, uppercase);
    color: var(--illustrations-role-color, #ffffff);
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-year {
    margin-top: 6px;
    font-family: var(--illustrations-year-font-family, "Futura PT", sans-serif);
    font-size: var(--illustrations-year-font-size, 14px);
    font-weight: var(--illustrations-year-font-weight, 400);
    font-style: var(--illustrations-year-font-style, normal);
    line-height: var(--illustrations-year-line-height, 1.3);
    letter-spacing: var(--illustrations-year-letter-spacing, 1.5px);
    text-transform: var(--illustrations-year-text-transform, uppercase);
    color: var(--illustrations-year-color, #ffffff);
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-description {
    margin-top: 12px;
    font-family: var(--illustrations-description-font-family, "Futura PT", sans-serif);
    font-size: var(--illustrations-description-font-size, 13px);
    font-weight: var(--illustrations-description-font-weight, 400);
    font-style: var(--illustrations-description-font-style, normal);
    line-height: var(--illustrations-description-line-height, 1.5);
    letter-spacing: var(--illustrations-description-letter-spacing, 0.5px);
    text-transform: var(--illustrations-description-text-transform, none);
    color: var(--illustrations-description-color, #ffffff);
}


/* ================================================
   ILLUSTRATIONS GALLERY ENHANCEMENTS v6
   ================================================ */

.illustrations-gallery-shortcode .illustrations-grid-text-card {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: var(--illustrations-text-card-vertical-align, center);
  align-items: var(--illustrations-text-card-horizontal-align, flex-start);
  text-align: var(--illustrations-text-card-text-align, left);
  padding: 22px;
  box-sizing: border-box;
  background-color: var(--illustrations-text-card-bg, #2d2d2d);
  background-image: var(--illustrations-text-card-pattern-image, none);
  background-repeat: repeat;
  background-size: var(--illustrations-text-card-pattern-size, 100%);
  background-position: top left;
  background-blend-mode: multiply;
  overflow: hidden;
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-project-name {
  font-family: var(--illustrations-project_name-font-family, "Futura PT", sans-serif);
  font-size: var(--illustrations-project_name-font-size, 26px);
  font-weight: var(--illustrations-project_name-font-weight, 400);
  font-style: var(--illustrations-project_name-font-style, normal);
  line-height: var(--illustrations-project_name-line-height, 1.15);
  letter-spacing: var(--illustrations-project_name-letter-spacing, 2px);
  text-transform: var(--illustrations-project_name-text-transform, uppercase);
  color: var(--illustrations-project_name-color, #ffffff);
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-client {
  margin-top: 6px;
  font-family: var(--illustrations-client-font-family, "Futura PT", sans-serif);
  font-size: var(--illustrations-client-font-size, 14px);
  font-weight: var(--illustrations-client-font-weight, 400);
  font-style: var(--illustrations-client-font-style, normal);
  line-height: var(--illustrations-client-line-height, 1.3);
  letter-spacing: var(--illustrations-client-letter-spacing, 1.5px);
  text-transform: var(--illustrations-client-text-transform, uppercase);
  color: var(--illustrations-client-color, #ffffff);
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-role {
  margin-top: 6px;
  font-family: var(--illustrations-role-font-family, "Futura PT", sans-serif);
  font-size: var(--illustrations-role-font-size, 14px);
  font-weight: var(--illustrations-role-font-weight, 400);
  font-style: var(--illustrations-role-font-style, normal);
  line-height: var(--illustrations-role-line-height, 1.3);
  letter-spacing: var(--illustrations-role-letter-spacing, 1.5px);
  text-transform: var(--illustrations-role-text-transform, uppercase);
  color: var(--illustrations-role-color, #ffffff);
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-year {
  margin-top: 6px;
  font-family: var(--illustrations-year-font-family, "Futura PT", sans-serif);
  font-size: var(--illustrations-year-font-size, 14px);
  font-weight: var(--illustrations-year-font-weight, 400);
  font-style: var(--illustrations-year-font-style, normal);
  line-height: var(--illustrations-year-line-height, 1.3);
  letter-spacing: var(--illustrations-year-letter-spacing, 1.5px);
  text-transform: var(--illustrations-year-text-transform, uppercase);
  color: var(--illustrations-year-color, #ffffff);
}

.illustrations-gallery-shortcode .illustrations-grid-text-card-description {
  margin-top: 12px;
  font-family: var(--illustrations-description-font-family, "Futura PT", sans-serif);
  font-size: var(--illustrations-description-font-size, 13px);
  font-weight: var(--illustrations-description-font-weight, 400);
  font-style: var(--illustrations-description-font-style, normal);
  line-height: var(--illustrations-description-line-height, 1.5);
  letter-spacing: var(--illustrations-description-letter-spacing, 0.5px);
  text-transform: var(--illustrations-description-text-transform, none);
  color: var(--illustrations-description-color, #ffffff);
}

.illustrations-gallery-shortcode .illustrations-grid-item,
.illustrations-gallery-shortcode .illustrations-grid-item-text-card {
  opacity: 0;
  transform: translate(var(--illustrations-animation-from-x, 0px), var(--illustrations-animation-from-y, 40px));
  will-change: transform, opacity;
}

.illustrations-gallery-shortcode.illustrations-gallery-is-ready .illustrations-grid-item,
.illustrations-gallery-shortcode.illustrations-gallery-is-ready .illustrations-grid-item-text-card {
  animation: illustrationsGalleryReveal var(--illustrations-animation-duration, 1000ms) cubic-bezier(0.33, 1, 0.68, 1) forwards;
  animation-delay: var(--illustrations-animate-delay, 0ms);
}

/* After the first page-load reveal has finished, keep gallery items stable.
   This prevents the base reveal animation from replaying when filtered items are unhidden. */
.illustrations-gallery-shortcode.illustrations-gallery-has-loaded .illustrations-grid-item,
.illustrations-gallery-shortcode.illustrations-gallery-has-loaded .illustrations-grid-item-text-card {
  opacity: 1;
  transform: translate(0, 0);
  animation: none;
}

@keyframes illustrationsGalleryReveal {
  from {
    opacity: 0;
    transform: translate(var(--illustrations-animation-from-x, 0px), var(--illustrations-animation-from-y, 40px));
  }
  to {
    opacity: 1;
    transform: translate(0, 0);
  }
}

.illustrations-gallery-shortcode .illustrations-grid-item-video::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to bottom, rgba(0,0,0,0.12), rgba(0,0,0,0.38));
  pointer-events: none;
}

.illustrations-gallery-shortcode .illustrations-grid-video-play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--illustrations-video-play-size, 72px);
  height: var(--illustrations-video-play-size, 72px);
  border-radius: 999px;
  transform: translate(-50%, -50%) scale(1);
  background: rgba(17, 17, 17, var(--illustrations-video-play-bg-opacity, 0.1));
  backdrop-filter: blur(var(--illustrations-video-play-blur, 2px));
  -webkit-backdrop-filter: blur(var(--illustrations-video-play-blur, 2px));
  border: var(--illustrations-video-play-border-size, 1px) solid var(--illustrations-video-play-border-color, #ffffff);
  z-index: 3;
  pointer-events: none;
  transition: transform var(--illustrations-video-play-transition, 260ms) cubic-bezier(0.33, 1, 0.68, 1), background-color var(--illustrations-video-play-transition, 260ms) ease, border-color var(--illustrations-video-play-transition, 260ms) ease, backdrop-filter var(--illustrations-video-play-transition, 260ms) ease, opacity var(--illustrations-video-play-transition, 260ms) ease;
}

.illustrations-gallery-shortcode .illustrations-grid-video-play::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 54%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  border-top: 14px solid transparent;
  border-bottom: 14px solid transparent;
  border-left: 22px solid #ffffff;
}

.illustrations-gallery-shortcode .illustrations-grid-item-video:hover .illustrations-grid-video-play,
.illustrations-gallery-shortcode .illustrations-grid-item-video:focus-visible .illustrations-grid-video-play,
.illustrations-gallery-shortcode .illustrations-grid-item-video.is-preview-playing .illustrations-grid-video-play {
  transform: translate(-50%, -50%) scale(var(--illustrations-video-play-hover-scale, 0.95));
}

.illustrations-gallery-shortcode.illustrations-gallery-hide-play-button .illustrations-grid-video-play {
  display: none !important;
}

.illustrations-gallery-shortcode .illustrations-grid-item-video img,
.illustrations-gallery-shortcode .illustrations-grid-item-video .illustrations-grid-video-preview,
.illustrations-gallery-shortcode .illustrations-grid-item-video .illustrations-grid-video-preview-gif {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.illustrations-gallery-shortcode .illustrations-grid-item-video .illustrations-grid-video-preview,
.illustrations-gallery-shortcode .illustrations-grid-item-video .illustrations-grid-video-preview-gif {
  z-index: 1;
}

.illustrations-gallery-shortcode .illustrations-grid-item-video .illustrations-grid-video-preview[hidden],
.illustrations-gallery-shortcode .illustrations-grid-item-video .illustrations-grid-video-preview-gif[hidden] {
  display: none !important;
}

.illustrations-gallery-shortcode .illustrations-lightbox-video-embed,
.illustrations-gallery-shortcode .illustrations-lightbox-video-local {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  display: block;
  border: 0;
  background: #000000;
  border-radius: 0;
  object-fit: contain;
}

.illustrations-gallery-shortcode .illustrations-lightbox-video-embed[hidden],
.illustrations-gallery-shortcode .illustrations-lightbox-video-local[hidden],
.illustrations-gallery-shortcode .illustrations-lightbox-image[hidden] {
  display: none !important;
}

@media (max-width: 768px) {
  .illustrations-gallery-shortcode .illustrations-grid-video-play {
    width: 56px;
    height: 56px;
  }

  .illustrations-gallery-shortcode .illustrations-grid-video-play::before {
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-left-width: 16px;
  }
}


/* ================================================ */
/* ABOUT PAGE - MOBILE FIXES
/* ================================================ */


/* ================================================
   ILLUSTRATIONS LIGHTBOX — KEEP ARROWS CENTERED ABOVE SWIPE LAYER
   ================================================ */
.illustrations-gallery-shortcode .illustrations-lightbox-nav {
  position: fixed !important;
  top: 50% !important;
  z-index: 20 !important;
  transform: translateY(-50%) scale(1) !important;
}

.illustrations-gallery-shortcode .illustrations-lightbox-prev {
  left: 50px !important;
}

.illustrations-gallery-shortcode .illustrations-lightbox-next {
  right: 50px !important;
}

.illustrations-gallery-shortcode .illustrations-lightbox-nav:active {
  transform: translateY(-50%) scale(0.96) !important;
}

.illustrations-gallery-shortcode .illustrations-lightbox-iframe-swipe-layer {
  z-index: 3 !important;
}

@media (max-width: 768px) {
  .illustrations-gallery-shortcode .illustrations-lightbox-nav {
    position: fixed !important;
    top: 50% !important;
    width: 46px !important;
    height: 46px !important;
    z-index: 20 !important;
    transform: translateY(-50%) scale(1) !important;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-prev {
    left: 20px !important;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-next {
    right: 20px !important;
  }
}


/* ================================================
   ILLUSTRATIONS LIGHTBOX — MOBILE ARROWS FOLLOW MEDIA CENTER
   ================================================ */
@media (max-width: 768px) {
  .illustrations-gallery-shortcode .illustrations-lightbox-nav {
    top: var(--illustrations-lightbox-nav-top, 50%) !important;
    transform: translateY(-50%) scale(1) !important;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-nav:active {
    transform: translateY(-50%) scale(0.96) !important;
  }
}

/* ================================================


/* ================================================
   ILLUSTRATIONS LIGHTBOX — EXPLICIT STACKING LAYERS
   Backdrop < dialog/media < controls
   ================================================ */
.illustrations-gallery-shortcode .illustrations-lightbox {
  isolation: isolate;
}

.illustrations-gallery-shortcode .illustrations-lightbox-backdrop {
  z-index: 10 !important;
}

.illustrations-gallery-shortcode .illustrations-lightbox-dialog {
  z-index: 20 !important;
}

.illustrations-gallery-shortcode .illustrations-lightbox-media-wrap,
.illustrations-gallery-shortcode .illustrations-lightbox-image,
.illustrations-gallery-shortcode .illustrations-lightbox-video-embed,
.illustrations-gallery-shortcode .illustrations-lightbox-video-local {
  position: relative;
  z-index: 21 !important;
}

.illustrations-gallery-shortcode .illustrations-lightbox-controls {
  position: absolute;
  inset: 0;
  z-index: 30 !important;
  pointer-events: none;
}

.illustrations-gallery-shortcode .illustrations-lightbox-close,
.illustrations-gallery-shortcode .illustrations-lightbox-nav {
  z-index: 31 !important;
  pointer-events: auto;
}

.illustrations-gallery-shortcode .illustrations-lightbox-iframe-swipe-layer {
  z-index: 22 !important;
}


/* ================================================
   ILLUSTRATIONS GALLERY — CATEGORY FILTERS
   ================================================ */
.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin: 0 auto var(--illustrations-grid-gap-vertical, 3px);
  padding: 6px 14px;
  box-sizing: border-box;
  font-family: "Futura PT", "FuturaPT", sans-serif;
  /*background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.02) 0%,
    rgba(17, 17, 17, 1) 10%,
    rgba(17, 17, 17, 1) 90%,
    rgba(255, 255, 255, 0.02) 100%
  );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), inset 0 -1px 0 rgba(255, 255, 255, 0.10), 0 3px 8px rgba(0, 0, 0, 0.35);*/
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-toggle {
  min-height: 28px;
  padding: 6px 15px 6px 12px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: "Futura PT", "FuturaPT", sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 1.55px;
  text-transform: uppercase;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-toggle:hover,
.illustrations-gallery-shortcode .illustrations-gallery-filter-toggle:focus-visible,
.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap.is-open .illustrations-gallery-filter-toggle {
  background: transparent;
  transform: scale(0.92);
  outline: none;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-icon {
  position: relative;
  width: 18px;
  height: 16px;
  display: inline-block;
  flex: 0 0 18px;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-icon::before,
.illustrations-gallery-shortcode .illustrations-gallery-filter-icon::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: #ffffff;
  border-radius: 999px;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-icon::before {
  top: 3px;
  box-shadow: 0 6px 0 #ffffff, 0 12px 0 #ffffff;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-icon::after {
  top: 2px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  box-shadow: 7px 6px 0 #ffffff, -2px 12px 0 #ffffff;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-panel {
  margin-top: 13px;
  max-width: min(980px, 92vw);
  padding: 15px 18px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  animation: illustrationsFilterPanelIn 0.28s ease both;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-panel[hidden] {
  display: none !important;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap.is-static {
  padding-top: 12px;
  padding-bottom: 12px;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap.is-static .illustrations-gallery-filter-panel {
  margin-top: 0;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-button {
  border: 0;
  border-radius: 99px;
  /*background: #333333;*/
  background: linear-gradient(to bottom right, rgb(65 65 65 / 15%), rgb(60 69 71 / 29%)) !important;
  backdrop-filter: blur(11px);
  color: #ffffff;
  padding: 20px 20px;
  font-family: "Futura PT", "FuturaPT", sans-serif;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 1.3px;
  line-height: 1;
  text-transform: uppercase;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: 3px 5px 8px #00000025, inset 1px 1px 1px 1px rgba(255, 255, 255, 0.14);
  transition: background-color 0.35s ease, transform 0.35s ease, opacity 0.25s ease;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-button:hover,
.illustrations-gallery-shortcode .illustrations-gallery-filter-button:focus-visible,
.illustrations-gallery-shortcode .illustrations-gallery-filter-button.is-active {
  background: #648e97;
  transform: scale(0.93);
  outline: none;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-is-transitioning .illustrations-grid-item {
  pointer-events: none;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-exit {
  animation: illustrationsGalleryFilterOut 0.32s ease forwards !important;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-enter {
  animation: illustrationsGalleryFilterIn 0.36s cubic-bezier(0.33, 1, 0.68, 1) both !important;
  animation-delay: var(--illustrations-animate-delay, 0ms) !important;
}

@keyframes illustrationsFilterPanelIn {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes illustrationsGalleryFilterOut {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  45% {
    opacity: 0.35;
  }
  100% {
    opacity: 0;
    transform: translateY(86px);
  }
}

@keyframes illustrationsGalleryFilterIn {
  0% {
    opacity: 0;
    transform: translateY(92px);
  }
  35% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 768px) {
  .illustrations-gallery-shortcode .illustrations-gallery-filter-wrap {
    margin-bottom: 14px;
    padding: 6px 10px;
  }

  .illustrations-gallery-shortcode .illustrations-gallery-filter-panel {
    max-width: calc(100vw - 32px);
    padding: 13px;
    gap: 9px;
  }

  .illustrations-gallery-shortcode .illustrations-gallery-filter-button {
    font-size: 13px;
    padding: 10px 16px;
  }
}

/* ================================================
   ILLUSTRATIONS GALLERY — CPT AMENDS
   ================================================ */
.illustrations-gallery-shortcode .illustrations-gallery-filter-exit {
  animation-delay: var(--illustrations-animate-delay, 0ms) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-caption-title-style-override .illustrations-grid-meta .caption-title {
  font-family: var(--illustrations-client-font-family, "Futura PT", sans-serif) !important;
  font-size: var(--illustrations-client-font-size, 14px) !important;
  font-weight: var(--illustrations-client-font-weight, 400) !important;
  font-style: var(--illustrations-client-font-style, normal) !important;
  line-height: var(--illustrations-client-line-height, 1.3) !important;
  letter-spacing: var(--illustrations-client-letter-spacing, 1.5px) !important;
  text-transform: var(--illustrations-client-text-transform, uppercase) !important;
  color: var(--illustrations-client-color, #ffffff) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-caption-role-style-override .illustrations-grid-meta .caption-role {
  font-family: var(--illustrations-role-font-family, "Futura PT", sans-serif) !important;
  font-size: var(--illustrations-role-font-size, 14px) !important;
  font-weight: var(--illustrations-role-font-weight, 400) !important;
  font-style: var(--illustrations-role-font-style, normal) !important;
  line-height: var(--illustrations-role-line-height, 1.3) !important;
  letter-spacing: var(--illustrations-role-letter-spacing, 1.5px) !important;
  text-transform: var(--illustrations-role-text-transform, uppercase) !important;
  color: var(--illustrations-role-color, #ffffff) !important;
}

.illustrations-gallery-shortcode .illustrations-gallery-show-more-wrap {
  padding-top: 40px;
  text-align: center;
}

.illustrations-gallery-shortcode .gallery-show-more {
  cursor: pointer;
}

.illustrations-gallery-shortcode .illustrations-full-project-link {
  display: inline-block;
  margin-top: 12px;
  padding: 0;
  background: transparent !important;
  color: #a29668 !important;
  font-size: 12px;
  line-height: 1.2;
  text-decoration: underline;
  text-underline-offset: 3px;
  border: 0;
  box-shadow: none !important;
  pointer-events: auto;
}

.illustrations-gallery-shortcode .illustrations-full-project-link:hover {
  color: #a29668 !important;
  background: transparent !important;
}

.illustrations-gallery-shortcode .illustrations-lightbox-dialog {
  gap: 28px;
}

.illustrations-gallery-shortcode .lightbox-description-panel {
  width: min(360px, 28vw);
  max-height: min(78vh, 760px);
  overflow: auto;
  box-sizing: border-box;
  color: rgba(255, 255, 255, 0.82);
  font-family: "Futura PT", sans-serif;
  font-size: 13px;
  line-height: 1.7;
  letter-spacing: 1px;
  pointer-events: auto;
  background: linear-gradient(to bottom right, rgba(1,1,1,.15), rgb(100,142,151,0.14))!important;
  backdrop-filter: blur(var(--illustrations-meta-box-blur, 30px));
  -webkit-backdrop-filter: blur(var(--illustrations-meta-box-blur, 30px));
  padding: 50px;
  border-radius: 10px;
  box-shadow: 3px 5px 8px #00000085, inset 1px 1px 1px 1px rgba(255, 255, 255, 0.10);
}

.illustrations-gallery-shortcode .lightbox-description-panel[hidden] {
  display: none !important;
}

@media (max-width: 768px) {
  .illustrations-gallery-shortcode .illustrations-lightbox-dialog {
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px);
    flex-direction: column;
    gap: 18px;
    align-items: center;
    justify-content: center;
  }

  .illustrations-gallery-shortcode .lightbox-description-panel {
    width: 100%;
    max-height: 28vh;
    padding: 24px;
  }
}
.illustrations-gallery-shortcode .illustrations-grid-meta {
  pointer-events: auto;
}

/* ================================================
   ILLUSTRATIONS GALLERY — SECOND CPT AMENDS
   ================================================ */
.illustrations-gallery-shortcode .illustrations-gallery-title-wrap {
  padding-top: var(--illustrations-gallery-title-padding-top, 40px);
  padding-bottom: var(--illustrations-gallery-title-padding-bottom, 20px);
  border-bottom: var(--illustrations-gallery-title-separator-width, 2px) solid var(--illustrations-gallery-title-separator-color, #5d5d5d);
  margin-bottom: var(--illustrations-gallery-title-separator-bottom-padding, 0px);
  width: 100%;
  box-sizing: border-box;
}

.illustrations-gallery-shortcode .illustrations-gallery-title-wrap .illustrations-gallery-title {
  margin: 0;
}

.illustrations-gallery-shortcode.illustrations-gallery-title-style-override .illustrations-gallery-title-wrap .illustrations-gallery-title {
  font-family: var(--illustrations-gallery_title-font-family, "Futura PT", sans-serif) !important;
  font-size: var(--illustrations-gallery_title-font-size, 28px) !important;
  font-weight: var(--illustrations-gallery_title-font-weight, 400) !important;
  font-style: var(--illustrations-gallery_title-font-style, normal) !important;
  line-height: var(--illustrations-gallery_title-line-height, 1.2) !important;
  letter-spacing: var(--illustrations-gallery_title-letter-spacing, 2px) !important;
  text-transform: var(--illustrations-gallery_title-text-transform, uppercase) !important;
  color: var(--illustrations-gallery_title-color, #ffffff) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-enabled .illustrations-grid-meta {
  width: var(--illustrations-meta-box-width, 100%);
  height: var(--illustrations-meta-box-height, auto);
  box-sizing: border-box;
  background: var(--illustrations-meta-box-background, linear-gradient(to bottom right, rgba(1,1,1,.15), rgb(100,142,151,0.14))) !important;
  backdrop-filter: blur(var(--illustrations-meta-box-blur, 30px));
  -webkit-backdrop-filter: blur(var(--illustrations-meta-box-blur, 30px));
  border-radius: var(--illustrations-meta-box-radius, 10px);
  box-shadow: var(--illustrations-meta-box-shadow, 3px 5px 8px #00000085, inset 1px 1px 1px 1px rgba(255,255,255,0.10));
}

.illustrations-gallery-shortcode .illustrations-full-project-link {
  color: var(--illustrations-full-project-color, #a29668) !important;
  transition: transform 0.25s ease, color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
}

.illustrations-gallery-shortcode.illustrations-full-project-style-underlined .illustrations-full-project-link {
  background: transparent !important;
  border: 0 !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.illustrations-gallery-shortcode.illustrations-full-project-style-boxed .illustrations-full-project-link {
  padding: 8px 12px;
  background: var(--illustrations-full-project-box-color, #000000) !important;
  border: 1px solid var(--illustrations-full-project-color, #a29668);
  border-radius: 999px;
  text-decoration: none;
  box-shadow: none !important;
}

.illustrations-gallery-shortcode.illustrations-full-project-hover-shrink .illustrations-full-project-link:hover,
.illustrations-gallery-shortcode.illustrations-full-project-hover-shrink .illustrations-full-project-link:focus-visible {
  transform: scale(0.95);
}

.illustrations-gallery-shortcode .lightbox-description-meta {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding-bottom: 24px;
}

.illustrations-gallery-shortcode .lightbox-description-panel .caption-title,
.illustrations-gallery-shortcode .lightbox-description-panel .caption-role {
  display: block;
}

.illustrations-gallery-shortcode.illustrations-gallery-caption-title-style-override .lightbox-description-panel .caption-title {
  font-family: var(--illustrations-client-font-family, "Futura PT", sans-serif) !important;
  font-size: var(--illustrations-client-font-size, 14px) !important;
  font-weight: var(--illustrations-client-font-weight, 400) !important;
  font-style: var(--illustrations-client-font-style, normal) !important;
  line-height: var(--illustrations-client-line-height, 1.3) !important;
  letter-spacing: var(--illustrations-client-letter-spacing, 1.5px) !important;
  text-transform: var(--illustrations-client-text-transform, uppercase) !important;
  color: var(--illustrations-client-color, #ffffff) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-caption-role-style-override .lightbox-description-panel .caption-role {
  font-family: var(--illustrations-role-font-family, "Futura PT", sans-serif) !important;
  font-size: var(--illustrations-role-font-size, 14px) !important;
  font-weight: var(--illustrations-role-font-weight, 400) !important;
  font-style: var(--illustrations-role-font-style, normal) !important;
  line-height: var(--illustrations-role-line-height, 1.3) !important;
  letter-spacing: var(--illustrations-role-letter-spacing, 1.5px) !important;
  text-transform: var(--illustrations-role-text-transform, uppercase) !important;
  color: var(--illustrations-role-color, #ffffff) !important;
}

@media (max-width: 1199px) {
  .illustrations-gallery-shortcode .illustrations-lightbox-dialog {
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px);
    flex-direction: column;
    gap: 18px;
    align-items: center;
    justify-content: center;
  }

  .illustrations-gallery-shortcode .lightbox-description-panel {
    width: 100%;
    max-height: 28vh;
    padding: 24px;
  }
}

/* ================================================
   ILLUSTRATIONS GALLERY — QUICK FIXES v3
   ================================================ */
.illustrations-gallery-shortcode .illustrations-gallery-title-wrap {
  display: block;
  padding-top: var(--illustrations-gallery-title-padding-top, 40px);
  padding-bottom: var(--illustrations-gallery-title-padding-bottom, 20px);
  margin-bottom: var(--illustrations-grid-gap-vertical, 3px);
  border-bottom: var(--illustrations-gallery-title-separator-width, 2px) solid var(--illustrations-gallery-title-separator-color, #5d5d5d);
  margin-bottom: var(--illustrations-gallery-title-separator-bottom-padding, 0px);
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}

.illustrations-gallery-shortcode .illustrations-gallery-title-wrap .illustrations-gallery-title {
  display: block;
  margin: 0;
  color: #ffffff;
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-enabled .illustrations-grid-meta {
  width: var(--illustrations-meta-box-width, 100%) !important;
  height: var(--illustrations-meta-box-height, 100%) !important;
  min-width: 0;
  min-height: 0;
  padding: 24px;
  box-sizing: border-box;
  background: var(--illustrations-meta-box-background, linear-gradient(to bottom right, rgba(1,1,1,.15), rgb(100,142,151,0.14))) !important;
  backdrop-filter: blur(var(--illustrations-meta-box-blur, 30px));
  -webkit-backdrop-filter: blur(var(--illustrations-meta-box-blur, 30px));
  border-radius: var(--illustrations-meta-box-radius, var(--illustrations-grid-corner-radius, 5px));
  box-shadow: var(--illustrations-meta-box-shadow, 3px 5px 8px #00000085, inset 1px 1px 1px 1px rgba(255,255,255,0.10));
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-panel {
  transition: height 0.35s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.28s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: height, opacity, transform;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-panel[hidden] {
  display: flex !important;
  height: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-button,
.illustrations-gallery-shortcode .gallery-show-more {
  border: 0;
  border-radius: 5px !important;
  background: linear-gradient(to bottom right, rgb(65 65 65 / 15%), rgb(60 69 71 / 29%)) !important;
  backdrop-filter: blur(11px);
  -webkit-backdrop-filter: blur(11px);
  color: #ffffff !important;
  padding: 20px 20px !important;
  font-family: "Futura PT", "FuturaPT", sans-serif;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 1.3px;
  line-height: 1;
  text-transform: uppercase;
  box-shadow: 3px 5px 8px #00000025, inset 1px 1px 1px 1px rgba(255, 255, 255, 0.14) !important;
  transition: background-color 0.35s ease, transform 0.35s ease, opacity 0.25s ease;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-button:hover,
.illustrations-gallery-shortcode .illustrations-gallery-filter-button:focus-visible,
.illustrations-gallery-shortcode .illustrations-gallery-filter-button.is-active,
.illustrations-gallery-shortcode .gallery-show-more:hover,
.illustrations-gallery-shortcode .gallery-show-more:focus-visible {
  background: #648e97 !important;
  transform: scale(0.93);
  outline: none;
}

@media (max-width: 1199px) {
  .illustrations-gallery-shortcode .illustrations-lightbox-has-description-panel .illustrations-lightbox-dialog {
    justify-content: center;
    gap: 10px;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-has-description-panel .illustrations-lightbox-media-wrap {
    transform: translateY(-2.5vh);
  }

  .illustrations-gallery-shortcode .illustrations-lightbox-has-description-panel .lightbox-description-panel {
    margin-top: -18px;
    max-height: 30vh;
  }
}

@media (max-width: 768px) {
  .illustrations-gallery-shortcode .illustrations-gallery-filter-button,
  .illustrations-gallery-shortcode .gallery-show-more {
    font-size: 13px;
    padding: 14px 18px !important;
  }
}

/* ================================================
   ILLUSTRATIONS GALLERY — DESCRIPTION TOGGLE + META BOX CROP MODES v6
   ================================================ */
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_top .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_middle .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_bottom .illustrations-grid-meta {
  height: var(--illustrations-meta-box-crop-height, 34%) !important;
  min-height: 0;
  background: var(--illustrations-meta-box-solid-color, #2d2d2d) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 18px 24px;
  box-sizing: border-box;
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_top .illustrations-grid-meta {
  top: 0;
  bottom: auto;
  left: 50%;
  transform: translate(-50%, -100%);
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_top .illustrations-grid-item:hover .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_top .illustrations-grid-item:focus-visible .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_top .illustrations-grid-item:active .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_top .illustrations-grid-item.mobile-focus .illustrations-grid-meta {
  transform: translate(-50%, 0);
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_middle .illustrations-grid-meta {
  top: 50%;
  bottom: auto;
  left: 50%;
  transform: translate(-85%, -50%);
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_middle .illustrations-grid-item:hover .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_middle .illustrations-grid-item:focus-visible .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_middle .illustrations-grid-item:active .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_middle .illustrations-grid-item.mobile-focus .illustrations-grid-meta {
  transform: translate(-50%, -50%);
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_bottom .illustrations-grid-meta {
  top: auto;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 100%);
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_bottom .illustrations-grid-item:hover .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_bottom .illustrations-grid-item:focus-visible .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_bottom .illustrations-grid-item:active .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_bottom .illustrations-grid-item.mobile-focus .illustrations-grid-meta {
  transform: translate(-50%, 0);
}

/* ================================================
   ILLUSTRATIONS GALLERY — v7 fixes
   ================================================ */
.illustrations-gallery-shortcode.illustrations-gallery-caption-title-style-override .illustrations-grid-meta .caption-title {
  padding-bottom: var(--illustrations-client-bottom-padding, 5px) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-caption-role-style-override .illustrations-grid-meta .caption-role {
  padding-bottom: var(--illustrations-role-bottom-padding, 5px) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-caption-title-style-override .lightbox-description-panel .caption-title {
  padding-bottom: var(--illustrations-client-bottom-padding, 5px) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-caption-role-style-override .lightbox-description-panel .caption-role {
  padding-bottom: var(--illustrations-role-bottom-padding, 5px) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_top .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_middle .illustrations-grid-meta,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_bottom .illustrations-grid-meta {
  height: auto !important;
  min-height: var(--illustrations-meta-box-crop-height, 34%) !important;
  max-height: 100%;
  overflow: visible;
  flex-direction: column;
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_top .illustrations-grid-meta .illustrations-full-project-link,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_middle .illustrations-grid-meta .illustrations-full-project-link,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-solid_bottom .illustrations-grid-meta .illustrations-full-project-link {
  flex: 0 0 auto;
}

/* Illustrations Gallery - optional fullscreen icon */
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  background: linear-gradient(to bottom right, rgba(1,1,1,.18), rgba(100,142,151,.22));
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 3px 5px 8px #00000055, inset 1px 1px 1px rgba(255,255,255,.12);
  opacity: 0;
  transform: scale(1.08);
  transition: opacity 260ms ease, transform 260ms ease;
  z-index: 7;
  pointer-events: none;
}

.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon::before,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon::after,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon span::before,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon span::after {
  content: "";
  position: absolute;
  width: 9px;
  height: 9px;
  border-color: rgba(255,255,255,.92);
  border-style: solid;
}

.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon::before {
  top: 8px;
  left: 8px;
  border-width: 1.5px 0 0 1.5px;
}

.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon::after {
  top: 8px;
  right: 8px;
  border-width: 1.5px 1.5px 0 0;
}

.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon span::before {
  bottom: 8px;
  left: 8px;
  border-width: 0 0 1.5px 1.5px;
}

.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon span::after {
  right: 8px;
  bottom: 8px;
  border-width: 0 1.5px 1.5px 0;
}

.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon.has-custom-icon::before,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon.has-custom-icon::after,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon.has-custom-icon span::before,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon.has-custom-icon span::after {
  display: none !important;
  content: none !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-enabled .illustrations-grid-item:hover .illustrations-grid-fullscreen-icon,
.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-enabled .illustrations-grid-item:focus-visible .illustrations-grid-fullscreen-icon,
.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-enabled .illustrations-grid-item.mobile-focus .illustrations-grid-fullscreen-icon {
  opacity: 1;
  transform: scale(.92);
}

/* ================================================
   ILLUSTRATIONS GALLERY — v9 fullscreen icon + inline border meta box
   ================================================ */
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon {
  background: var(--illustrations-fullscreen-icon-bg, #2d2d2d) !important;
  pointer-events: auto;
}

.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon img {
  width: 62%;
  height: 62%;
  object-fit: contain;
  display: block;
  pointer-events: none;
}

.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-enabled .illustrations-grid-item:hover .illustrations-grid-fullscreen-icon,
.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-enabled .illustrations-grid-item:focus-visible .illustrations-grid-fullscreen-icon,
.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-enabled .illustrations-grid-item.mobile-focus .illustrations-grid-fullscreen-icon {
  opacity: 1;
  transform: scale(1);
}

.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon:hover,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon:focus-visible {
  transform: scale(0.88) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-meta {
  inset: auto !important;
  top: 50% !important;
  left: 50% !important;
  width: var(--illustrations-meta-box-width, 100%) !important;
  height: var(--illustrations-meta-box-height, 100%) !important;
  max-width: calc(100% - (var(--illustrations-meta-box-inline-padding, 18px) * 2));
  max-height: calc(100% - (var(--illustrations-meta-box-inline-padding, 18px) * 2));
  transform: translate(-50%, -50%);
  min-width: 0;
  min-height: 0;
  padding: 24px;
  background: transparent !important;
  border-radius: var(--illustrations-meta-box-radius, 10px);
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  overflow: hidden;
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-meta::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 2px solid var(--illustrations-meta-box-inline-border-color, #ffffff);
  background: transparent;
  opacity: 0;
  pointer-events: none;
  box-sizing: border-box;
  transition: opacity 320ms ease, clip-path 520ms cubic-bezier(0.22, 1, 0.36, 1), background-color 320ms ease;
  z-index: -1;
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-meta::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--illustrations-meta-box-inline-bg-color, rgba(0,0,0,0));
  opacity: 0;
  pointer-events: none;
  transition: opacity 320ms ease;
  z-index: -2;
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border.illustrations-gallery-meta-box-inline-animation-stroke .illustrations-grid-meta::before {
  clip-path: inset(0 100% 100% 0);
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border.illustrations-gallery-meta-box-inline-animation-fade .illustrations-grid-meta::before {
  clip-path: inset(0 0 0 0);
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-item:hover .illustrations-grid-meta::before,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-item:focus-visible .illustrations-grid-meta::before,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-item:active .illustrations-grid-meta::before,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-item.mobile-focus .illustrations-grid-meta::before {
  opacity: 1;
  clip-path: inset(0 0 0 0);
}

.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-item:hover .illustrations-grid-meta::after,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-item:focus-visible .illustrations-grid-meta::after,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-item:active .illustrations-grid-meta::after,
.illustrations-gallery-shortcode.illustrations-gallery-meta-box-inline_border .illustrations-grid-item.mobile-focus .illustrations-grid-meta::after {
  opacity: 1;
}

/* Illustrations Gallery — v12 fullscreen icon shadow + lightbox project link */
.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-no-shadow .illustrations-grid-fullscreen-icon {
  box-shadow: none !important;
}

.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon.has-custom-icon::before,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon.has-custom-icon::after,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon.has-custom-icon span,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon.has-custom-icon span::before,
.illustrations-gallery-shortcode .illustrations-grid-fullscreen-icon.has-custom-icon span::after {
  display: none !important;
  content: none !important;
}

.illustrations-gallery-shortcode .lightbox-description-panel .lightbox-full-project-link {
  display: inline-flex !important;
  width: fit-content;
  margin-top: 22px;
}

/* Illustrations Gallery — v14 fullscreen icon clean mode */
.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-no-shadow .illustrations-grid-fullscreen-icon {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-no-shadow .illustrations-grid-fullscreen-icon:hover,
.illustrations-gallery-shortcode.illustrations-gallery-fullscreen-icon-no-shadow .illustrations-grid-fullscreen-icon:focus-visible {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}


/* Illustration lightbox — keep mobile description pinned near image bottom */
@media (max-width: 768px) {
  .illustrations-gallery-shortcode .illustrations-lightbox.illustrations-lightbox-has-description-panel .illustrations-lightbox-dialog {
    align-items: flex-start;
    padding-top: 8vh;
  }

  .illustrations-gallery-shortcode .lightbox-description-panel {
    align-self: flex-start;
    justify-self: flex-start;
    margin-top: 10px;
  }
}

/* Illustration filters visual option: button mode or continuous bar mode */
.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-wrap {
  width: fit-content;
  max-width: min(100%, 860px);
  margin: var(--illustrations-filter-wrap-spacing, 0 auto 28px);
  padding: var(--illustrations-filter-wrap-padding, 6px);
  border-radius: 999px;
  background: var(--illustrations-filter-bar-background, rgba(45, 45, 45, 0.72));
  box-shadow: var(--illustrations-filter-bar-box-shadow, 3px 5px 8px #00000085, inset 1px 1px 1px 1px rgba(255,255,255,0.16));
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-panel {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 0;
  width: 100%;
  padding: var(--illustrations-filter-panel-padding, 0px);
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-button {
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 12px 22px;
  min-height: 34px;
  white-space: nowrap;
  color: var(--illustrations-filter-item-color, #ffffff) !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-button:hover,
.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-button:focus-visible,
.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-button.is-active {
  background: var(--illustrations-filter-item-hover-background, rgba(255,255,255,0.92)) !important;
  color: var(--illustrations-filter-item-hover-color, #222222) !important;
  transform: none !important;
}

@media (max-width: 768px) {
  .illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-wrap {
    width: 100%;
    max-width: calc(100vw - 28px);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-panel {
    justify-content: flex-start;
  }

  .illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-button {
    padding: 10px 17px;
    flex: 0 0 auto;
  }
}

/* Filter trigger/panel separation + panel scaling */
.illustrations-gallery-shortcode .illustrations-gallery-filter-trigger-container {
  display: flex;
  justify-content: center;
  width: var(--illustrations-filter-button-box-width, 100%);
  max-width: 100%;
  background: var(--illustrations-filter-button-box-background, linear-gradient(180deg, #ffffff63 10%, #ffffff3b 30%, transparent, #ffffff29 90%));
  margin-left: auto;
  margin-right: auto;
  padding-top: 15px;
  padding-bottom: 15px;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-custom-icon {
  width: 18px;
  height: 18px;
  object-fit: contain;
  display: inline-block;
  flex: 0 0 18px;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-panel-container {
  width: 100%;
  display: flex;
  justify-content: center;
  overflow: visible;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-panel {
  transform: scale(var(--illustrations-filter-panel-scale, 1));
  transform-origin: top center;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-panel[hidden] {
  transform: translateY(-8px) scale(var(--illustrations-filter-panel-scale, 1));
}

/* Fix: keep illustration filter trigger and filter bar fully independent. */
.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap:not(.is-open):not(.is-static) {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden !important;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap:not(.is-open):not(.is-static) .illustrations-gallery-filter-panel-container {
  height: 0 !important;
  overflow: hidden !important;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-panel-container {
  width: auto;
  max-width: 100%;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-wrap.is-open,
.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-wrap.is-static {
  display: inline-flex;
  width: fit-content;
  max-width: calc(100vw - 28px);
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-panel-container {
  width: auto;
  max-width: 100%;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-panel {
  width: auto;
  max-width: 100%;
}

/* Fix illustration filter bar top gap: the panel must not add extra top margin inside the bar. */
.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-panel {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Reveal container controls the filter opening; the bar itself stays static. */
.illustrations-gallery-shortcode .illustrations-gallery-filter-reveal {
  width: 100%;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-reveal:not(.is-open):not(.is-static) {
  height: 0;
  margin: 0 !important;
  padding: 0 !important;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-reveal.is-open,
.illustrations-gallery-shortcode .illustrations-gallery-filter-reveal.is-static {
  margin: 0 auto var(--illustrations-grid-gap-vertical, 3px);
  padding-top: 15px;
  padding-bottom: 15px;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-reveal .illustrations-gallery-filter-wrap {
  margin: 0 auto !important;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-reveal .illustrations-gallery-filter-panel-container {
  height: auto !important;
  overflow: visible !important;
  transition: none !important;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-reveal .illustrations-gallery-filter-wrap {
  display: inline-flex;
  width: fit-content;
  max-width: calc(100vw - 28px);
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-visual-bar .illustrations-gallery-filter-reveal .illustrations-gallery-filter-panel {
  width: auto;
  max-width: 100%;
  margin-top: 0 !important;
}

/* Illustration filters: CPT-controlled left/center/right alignment */
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-left .illustrations-gallery-filter-trigger-container,
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-left .illustrations-gallery-filter-reveal,
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-left .illustrations-gallery-filter-panel-container {
  justify-content: flex-start;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-align-center .illustrations-gallery-filter-trigger-container,
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-center .illustrations-gallery-filter-reveal,
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-center .illustrations-gallery-filter-panel-container {
  justify-content: center;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-align-right .illustrations-gallery-filter-trigger-container,
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-right .illustrations-gallery-filter-reveal,
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-right .illustrations-gallery-filter-panel-container {
  justify-content: flex-end;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-align-left .illustrations-gallery-filter-wrap { align-items: flex-start; }
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-center .illustrations-gallery-filter-wrap { align-items: center; }
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-right .illustrations-gallery-filter-wrap { align-items: flex-end; }

.illustrations-gallery-shortcode.illustrations-gallery-filter-align-left .illustrations-gallery-filter-panel { transform-origin: top left; }
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-center .illustrations-gallery-filter-panel { transform-origin: top center; }
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-right .illustrations-gallery-filter-panel { transform-origin: top right; }

/* Illustration lightbox software logos */
.illustrations-gallery-shortcode .lightbox-description-panel .description-softwares {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.illustrations-gallery-shortcode .lightbox-description-panel .softwares-logos {
  display: flex;
  gap: 18px;
  align-items: flex-end;
  flex-wrap: wrap;
  padding: 10px 0;
}

.illustrations-gallery-shortcode .lightbox-description-panel .softwares-logos img {
  width: 35px;
  height: 35px;
  max-width: 300px;
  max-height: 300px;
  object-fit: contain;
  display: block;
  opacity: 0.9;
}

@media (max-width: 768px) {
  .illustrations-gallery-shortcode .lightbox-description-panel .softwares-logos img {
    width: 25px;
    height: 25px;
  }
}

/* ================================================
   ILLUSTRATIONS GALLERY — FINAL FIXES
   1) Bind Size Control to the whole filter wrapper
   2) Hide description scrollbar + add read more styles
   3) Reduce very-small-mobile media height
   ================================================ */

/* The ACF "Size Control" already outputs --illustrations-filter-panel-scale.
   Apply it to .illustrations-gallery-filter-wrap so bar background, padding,
   buttons and the whole filter wrapper scale together. */
.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap.is-open,
.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap.is-static {
  transform: scale(var(--illustrations-filter-panel-scale, 1));
  transform-origin: top center;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-align-left .illustrations-gallery-filter-wrap.is-open,
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-left .illustrations-gallery-filter-wrap.is-static {
  transform-origin: top left;
}

.illustrations-gallery-shortcode.illustrations-gallery-filter-align-right .illustrations-gallery-filter-wrap.is-open,
.illustrations-gallery-shortcode.illustrations-gallery-filter-align-right .illustrations-gallery-filter-wrap.is-static {
  transform-origin: top right;
}

/* Avoid double-scaling the inner panel now that the wrapper itself is scaled. */
.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap.is-open .illustrations-gallery-filter-panel,
.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap.is-static .illustrations-gallery-filter-panel {
  transform: none !important;
}

.illustrations-gallery-shortcode .illustrations-gallery-filter-wrap:not(.is-open):not(.is-static) {
  transform: none !important;
}

/* Keep scrolling available for very long expanded descriptions, but hide the ugly scrollbar. */
.illustrations-gallery-shortcode .lightbox-description-panel {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.illustrations-gallery-shortcode .lightbox-description-panel::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.illustrations-gallery-shortcode .lightbox-description-read-more {
  display: inline-flex;
  margin-top: 14px;
  padding: 0;
  border: 0;
  background: transparent !important;
  box-shadow: none !important;
  color: #a29668 !important;
  font-family: "Futura PT", sans-serif;
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: 1px;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.illustrations-gallery-shortcode .lightbox-description-read-more:hover,
.illustrations-gallery-shortcode .lightbox-description-read-more:focus-visible {
  background: transparent !important;
  color: #a29668 !important;
  outline: none;
}

.illustrations-gallery-shortcode .lightbox-description-text-full[hidden],
.illustrations-gallery-shortcode .lightbox-description-text-short[hidden] {
  display: none !important;
}

@media (max-width: 430px) {
  .illustrations-gallery-shortcode .illustrations-lightbox.illustrations-lightbox-has-description-panel .illustrations-lightbox-dialog {
    justify-content: flex-start;
    gap: 8px;
    padding-top: 7vh;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox.illustrations-lightbox-has-description-panel .illustrations-lightbox-media-wrap,
  .illustrations-gallery-shortcode .illustrations-lightbox.illustrations-lightbox-has-description-panel .milo-unified-lightbox-media-wrap {
    height: min(42vh, 320px) !important;
    max-height: min(42vh, 320px) !important;
    transform: none !important;
  }

  .illustrations-gallery-shortcode .illustrations-lightbox.illustrations-lightbox-has-description-panel .lightbox-description-panel {
    margin-top: 0 !important;
    max-height: 36vh;
  }
}