body {
  overflow-x: hidden
}

/* images inside the strip and gallery */
.case-strip img,
.case-gallery img {
  height: 100%;
  width: auto;
  flex: 0 0 auto;
  display: block;
  object-fit: cover
}

.btn:hover {
  background: #f4f2ef;
  color: #000
}

.case-bar:focus-visible {
  outline: 2px solid #f4f2ef;
  outline-offset: -2px
}

/* open state — attribute driven, so it cannot live in Designer classes */
.case[data-expand-open="true"] .case-strip {
  opacity: 0
}

.case[data-expand-open="true"] .case-media {
  min-height: 0
}

.case[data-expand-open="true"] .case-desc-wrap {
  grid-template-rows: 1fr
}

.case[data-expand-open="true"] .case-panel {
  grid-template-rows: 1fr
}

.case[data-expand-open="true"] .case-panel-inner {
  opacity: 1;
  transform: none;
  transition-delay: 160ms
}

.case[data-expand-open="true"] .case-icon-plus {
  opacity: 0
}

.case[data-expand-open="true"] .case-icon-minus {
  opacity: 1
}

@media (max-width:991px) {
  .case[data-expand-open="true"] .case-desc {
    padding-top: 16px
  }
}

@media (prefers-reduced-motion:reduce) {
  .case * {
    transition-duration: 0.01ms !important
  }
}