.bw-element--image {
  margin-block: 0;
}

.bw-image {
  margin-inline: 0;
}

.bw-image--flow-root {
  display: flow-root;
}

.bw-image__img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--bw-card-radius, var(--bw-border-radius, 0.5rem));
}

.bw-image__caption {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.4;
  color: var(--bw-color-text-700, var(--bw-color-text-900, #0f172a));
  opacity: 0.9;
}

.bw-image__gallery {
  display: grid;
  gap: var(--bw-space-grid-x, 1rem);
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bw-image__gallery--cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.bw-image__gallery--cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bw-image__gallery--cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.bw-image__gallery--cols-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.bw-image__thumb {
  padding: 0;
  border: 0;
  border-radius: var(--bw-card-radius, var(--bw-border-radius, 0.5rem));
  background: transparent;
  cursor: pointer;
  overflow: hidden;
  transition: transform 0.22s ease, opacity 0.22s ease, box-shadow 0.22s ease;
}

.bw-image__thumb:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.24);
}

.bw-image__thumb.is-active {
  box-shadow: 0 0 0 2px var(--bw-color-primary-500, currentColor), 0 8px 18px rgba(15, 23, 42, 0.2);
}

.bw-image__img--thumb {
  width: 100%;
  height: var(--bw-image-thumb-height, clamp(8rem, 18vw, 12rem));
  object-fit: cover;
  object-position: center;
}

.bw-image-gallery {
  display: grid;
  gap: var(--bw-space-grid-y, var(--bw-space-grid-x, 1rem));
  --bw-image-gallery-controls-inset: 1.75rem;
  --bw-image-gallery-controls-inset-modal: 2.25rem;
  --bw-image-gallery-close-inset: 2.25rem;
}

.bw-image-gallery__stage {
  position: relative;
  width: 100%;
}

.bw-image-gallery__stage-item,
.bw-image-gallery__modal-item {
  margin: 0;
}

.bw-image-gallery__stage-item[hidden],
.bw-image-gallery__modal-item[hidden] {
  display: none !important;
}

.bw-image__img--stage,
.bw-image__img--modal {
  width: 100%;
  max-height: min(72vh, 46rem);
  object-fit: contain;
  background: var(--bw-color-surface-100, rgba(15, 23, 42, 0.04));
}

.bw-image-gallery__modal {
  position: fixed;
  inset: 0;
  z-index: 60;
}

.bw-image-gallery__modal[hidden] {
  display: none !important;
}

.bw-image-gallery__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(3, 7, 18, 0.72);
  cursor: pointer;
}

.bw-image-gallery__panel {
  position: relative;
  z-index: 1;
  width: min(96vw, 72rem);
  max-height: 92vh;
  margin: 4vh auto;
  overflow: auto;
  border-radius: var(--bw-card-radius, var(--bw-border-radius, 0.75rem));
  background: var(--bw-color-background-50, #fff);
  padding: 1rem;
}

.bw-image-gallery__close {
  position: absolute;
  top: var(--bw-image-gallery-close-inset, 0.5rem);
  right: var(--bw-image-gallery-close-inset, 0.5rem);
  z-index: 3;
  width: 2rem;
  height: 2rem;
  border: 0;
  border-radius: 999px;
  background: rgba(3, 7, 18, 0.64);
  color: var(--bw-color-background-50, #fff);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
}

.bw-image-gallery__modal-track {
  margin-top: 0;
}

.bw-image-gallery__controls {
  position: absolute;
  inset-inline: var(--bw-image-gallery-controls-inset, 0.75rem);
  top: 50%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  pointer-events: none;
  transform: translateY(-50%);
  z-index: 2;
}

.bw-image-gallery__controls--modal {
  inset-inline: var(--bw-image-gallery-controls-inset-modal, 1.25rem);
}

.bw-image-gallery__nav {
  pointer-events: auto;
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  border-radius: 999px;
  background: rgba(3, 7, 18, 0.64);
  color: var(--bw-color-background-50, #fff);
  font-size: 1.25rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

.bw-image-gallery__nav:hover {
  transform: translateY(-2px) scale(1.03);
  background: rgba(3, 7, 18, 0.78);
}

.bw-image--content-width {
  max-width: min(100%, var(--bw-content-max-width, 48rem));
}

.bw-image--full-width {
  width: 100%;
}

.bw-video {
  margin: 0;
}

.bw-video__frame {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: var(--bw-card-radius, var(--bw-border-radius, 0.5rem));
  background: var(--bw-color-surface-200, rgba(15, 23, 42, 0.06));
}

.bw-video__frame > iframe,
.bw-video__frame > video {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.bw-video--ratio-16-9 .bw-video__frame {
  aspect-ratio: 16 / 9;
}

.bw-video--ratio-4-3 .bw-video__frame {
  aspect-ratio: 4 / 3;
}

.bw-video--ratio-1-1 .bw-video__frame {
  aspect-ratio: 1 / 1;
}

.bw-video--ratio-9-16 .bw-video__frame {
  aspect-ratio: 9 / 16;
}

.bw-video--ratio-21-9 .bw-video__frame {
  aspect-ratio: 21 / 9;
}

.bw-video__disclosure {
  margin: 0;
}

.bw-video__summary {
  display: grid;
  place-items: center;
  min-height: var(--bw-media-video-summary-min-height, 10rem);
  cursor: pointer;
  list-style: none;
  border-radius: var(--bw-card-radius, var(--bw-border-radius, 0.5rem));
  background: var(--bw-media-video-summary-bg, var(--bw-color-surface_alt-100, rgba(15, 23, 42, 0.08)));
}

.bw-video__summary::-webkit-details-marker {
  display: none;
}

.bw-video__play {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1rem;
  border-radius: 999px;
  background: var(--bw-color-background-50, rgba(255, 255, 255, 0.9));
  color: var(--bw-color-text-900, #0f172a);
  font-weight: 600;
}

.bw-video__caption {
  margin-top: var(--bw-space-grid-y, var(--bw-space-grid-x, 0.75rem));
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--bw-color-text-800, inherit);
  opacity: 0.9;
}

@media (max-width: 767px) {
  .bw-image-gallery {
    --bw-image-gallery-controls-inset: 1rem;
    --bw-image-gallery-controls-inset-modal: 1rem;
    --bw-image-gallery-close-inset: 1rem;
  }

  .bw-image__gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bw-image__gallery--cols-4,
  .bw-image__gallery--cols-5 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .bw-image-gallery__panel {
    width: min(98vw, 72rem);
    max-height: 96vh;
    margin: 2vh auto;
    padding: 0.75rem;
  }

}
