/* Website Builder media presentation v1 — public-safe geometry authority. */
.wb-media-slot,
.wb-media-filled {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  background: transparent;
  overflow: hidden;
}

.wb-media-slot[hidden] {
  display: none !important;
}

.wb-media-filled > img,
.wb-media-filled > video {
  display: block;
  width: 100%;
  max-width: 100%;
}

[data-wb-media-aspect="square"] {
  aspect-ratio: 1 / 1;
}
[data-wb-media-aspect="portrait"] {
  aspect-ratio: 4 / 5;
}
[data-wb-media-aspect="landscape"] {
  aspect-ratio: 4 / 3;
}
[data-wb-media-aspect="classic"] {
  aspect-ratio: 3 / 2;
}
[data-wb-media-aspect="wide"] {
  aspect-ratio: 16 / 9;
}
[data-wb-media-aspect="cinematic"] {
  aspect-ratio: 21 / 9;
}

[data-wb-media-aspect]:not([data-wb-media-aspect="auto"]) > img,
[data-wb-media-aspect]:not([data-wb-media-aspect="auto"]) > video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

[data-wb-media-fit="cover"] > img,
[data-wb-media-fit="cover"] > video {
  object-fit: cover;
}

[data-wb-media-fit="contain"] > img,
[data-wb-media-fit="contain"] > video {
  object-fit: contain;
}

[data-wb-media-fit="natural"] {
  aspect-ratio: auto;
}
[data-wb-media-fit="natural"] > img {
  position: static;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
}

[data-wb-media-role="hero_background"] {
  min-height: clamp(420px, 68vw, 900px);
  height: 100%;
}
[data-wb-media-role="hero_background"][data-wb-media-height="compact"] {
  min-height: clamp(260px, 42vw, 520px);
}
[data-wb-media-role="hero_background"][data-wb-media-height="normal"] {
  min-height: clamp(320px, 56vw, 760px);
}
[data-wb-media-role="hero_background"][data-wb-media-height="tall"] {
  min-height: clamp(420px, 68vw, 900px);
}

[data-wb-media-role="hero_inline"][data-wb-media-height="compact"],
[data-wb-media-role="carousel_slide"][data-wb-media-height="compact"],
[data-wb-media-role="video_frame"][data-wb-media-height="compact"] {
  min-height: clamp(180px, 28vw, 320px);
}
[data-wb-media-role="hero_inline"][data-wb-media-height="normal"],
[data-wb-media-role="carousel_slide"][data-wb-media-height="normal"],
[data-wb-media-role="video_frame"][data-wb-media-height="normal"] {
  min-height: clamp(240px, 38vw, 460px);
}
[data-wb-media-role="hero_inline"][data-wb-media-height="tall"],
[data-wb-media-role="carousel_slide"][data-wb-media-height="tall"],
[data-wb-media-role="video_frame"][data-wb-media-height="tall"] {
  min-height: clamp(320px, 52vw, 640px);
}

.wb-hero-full-bg-media > [data-wb-media-role="hero_background"] {
  position: absolute;
  inset: 0;
  min-height: 100%;
  border-radius: 0;
}
.wb-hero-full-bg-media > [data-wb-media-role="hero_background"] > img {
  opacity: 0.72;
}

.wb-image-text-layout > *,
.wb-split > *,
.wb-service-card,
.wb-photo-tiles > *,
.wb-image-card-row > * {
  min-width: 0;
}

.wb-service-card > [data-wb-media-role="service_card"] {
  border-radius: 0;
}
.wb-carousel-slide > [data-wb-media-role="carousel_slide"] {
  border-radius: 0.9rem;
}

.wb-page-background-media {
  object-fit: cover;
  object-position: 50% 50%;
}
.website-builder-canvas[data-page-bg-fit="contain"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-fit="contain"] .wb-page-background-media {
  object-fit: contain;
}
.website-builder-canvas[data-page-bg-mode="pattern"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-mode="pattern"] .wb-page-background-media {
  object-fit: cover;
}

/* CSP-safe 5x5 focal grid. */
[data-wb-media-focal="x0-y0"] > img,
[data-wb-media-focal="x0-y0"] > video,
.website-builder-canvas[data-page-bg-focal="x0-y0"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x0-y0"] .wb-page-background-media {
  object-position: 0% 0%;
}
[data-wb-media-focal="x25-y0"] > img,
[data-wb-media-focal="x25-y0"] > video,
.website-builder-canvas[data-page-bg-focal="x25-y0"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x25-y0"] .wb-page-background-media {
  object-position: 25% 0%;
}
[data-wb-media-focal="x50-y0"] > img,
[data-wb-media-focal="x50-y0"] > video,
.website-builder-canvas[data-page-bg-focal="x50-y0"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x50-y0"] .wb-page-background-media {
  object-position: 50% 0%;
}
[data-wb-media-focal="x75-y0"] > img,
[data-wb-media-focal="x75-y0"] > video,
.website-builder-canvas[data-page-bg-focal="x75-y0"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x75-y0"] .wb-page-background-media {
  object-position: 75% 0%;
}
[data-wb-media-focal="x100-y0"] > img,
[data-wb-media-focal="x100-y0"] > video,
.website-builder-canvas[data-page-bg-focal="x100-y0"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x100-y0"] .wb-page-background-media {
  object-position: 100% 0%;
}
[data-wb-media-focal="x0-y25"] > img,
[data-wb-media-focal="x0-y25"] > video,
.website-builder-canvas[data-page-bg-focal="x0-y25"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x0-y25"] .wb-page-background-media {
  object-position: 0% 25%;
}
[data-wb-media-focal="x25-y25"] > img,
[data-wb-media-focal="x25-y25"] > video,
.website-builder-canvas[data-page-bg-focal="x25-y25"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x25-y25"] .wb-page-background-media {
  object-position: 25% 25%;
}
[data-wb-media-focal="x50-y25"] > img,
[data-wb-media-focal="x50-y25"] > video,
.website-builder-canvas[data-page-bg-focal="x50-y25"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x50-y25"] .wb-page-background-media {
  object-position: 50% 25%;
}
[data-wb-media-focal="x75-y25"] > img,
[data-wb-media-focal="x75-y25"] > video,
.website-builder-canvas[data-page-bg-focal="x75-y25"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x75-y25"] .wb-page-background-media {
  object-position: 75% 25%;
}
[data-wb-media-focal="x100-y25"] > img,
[data-wb-media-focal="x100-y25"] > video,
.website-builder-canvas[data-page-bg-focal="x100-y25"]
  .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x100-y25"] .wb-page-background-media {
  object-position: 100% 25%;
}
[data-wb-media-focal="x0-y50"] > img,
[data-wb-media-focal="x0-y50"] > video,
.website-builder-canvas[data-page-bg-focal="x0-y50"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x0-y50"] .wb-page-background-media {
  object-position: 0% 50%;
}
[data-wb-media-focal="x25-y50"] > img,
[data-wb-media-focal="x25-y50"] > video,
.website-builder-canvas[data-page-bg-focal="x25-y50"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x25-y50"] .wb-page-background-media {
  object-position: 25% 50%;
}
[data-wb-media-focal="x50-y50"] > img,
[data-wb-media-focal="x50-y50"] > video,
.website-builder-canvas[data-page-bg-focal="x50-y50"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x50-y50"] .wb-page-background-media {
  object-position: 50% 50%;
}
[data-wb-media-focal="x75-y50"] > img,
[data-wb-media-focal="x75-y50"] > video,
.website-builder-canvas[data-page-bg-focal="x75-y50"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x75-y50"] .wb-page-background-media {
  object-position: 75% 50%;
}
[data-wb-media-focal="x100-y50"] > img,
[data-wb-media-focal="x100-y50"] > video,
.website-builder-canvas[data-page-bg-focal="x100-y50"]
  .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x100-y50"] .wb-page-background-media {
  object-position: 100% 50%;
}
[data-wb-media-focal="x0-y75"] > img,
[data-wb-media-focal="x0-y75"] > video,
.website-builder-canvas[data-page-bg-focal="x0-y75"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x0-y75"] .wb-page-background-media {
  object-position: 0% 75%;
}
[data-wb-media-focal="x25-y75"] > img,
[data-wb-media-focal="x25-y75"] > video,
.website-builder-canvas[data-page-bg-focal="x25-y75"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x25-y75"] .wb-page-background-media {
  object-position: 25% 75%;
}
[data-wb-media-focal="x50-y75"] > img,
[data-wb-media-focal="x50-y75"] > video,
.website-builder-canvas[data-page-bg-focal="x50-y75"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x50-y75"] .wb-page-background-media {
  object-position: 50% 75%;
}
[data-wb-media-focal="x75-y75"] > img,
[data-wb-media-focal="x75-y75"] > video,
.website-builder-canvas[data-page-bg-focal="x75-y75"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x75-y75"] .wb-page-background-media {
  object-position: 75% 75%;
}
[data-wb-media-focal="x100-y75"] > img,
[data-wb-media-focal="x100-y75"] > video,
.website-builder-canvas[data-page-bg-focal="x100-y75"]
  .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x100-y75"] .wb-page-background-media {
  object-position: 100% 75%;
}
[data-wb-media-focal="x0-y100"] > img,
[data-wb-media-focal="x0-y100"] > video,
.website-builder-canvas[data-page-bg-focal="x0-y100"] .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x0-y100"] .wb-page-background-media {
  object-position: 0% 100%;
}
[data-wb-media-focal="x25-y100"] > img,
[data-wb-media-focal="x25-y100"] > video,
.website-builder-canvas[data-page-bg-focal="x25-y100"]
  .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x25-y100"] .wb-page-background-media {
  object-position: 25% 100%;
}
[data-wb-media-focal="x50-y100"] > img,
[data-wb-media-focal="x50-y100"] > video,
.website-builder-canvas[data-page-bg-focal="x50-y100"]
  .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x50-y100"] .wb-page-background-media {
  object-position: 50% 100%;
}
[data-wb-media-focal="x75-y100"] > img,
[data-wb-media-focal="x75-y100"] > video,
.website-builder-canvas[data-page-bg-focal="x75-y100"]
  .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x75-y100"] .wb-page-background-media {
  object-position: 75% 100%;
}
[data-wb-media-focal="x100-y100"] > img,
[data-wb-media-focal="x100-y100"] > video,
.website-builder-canvas[data-page-bg-focal="x100-y100"]
  .wb-page-background-media,
.wb-public-page-stage[data-page-bg-focal="x100-y100"]
  .wb-page-background-media {
  object-position: 100% 100%;
}

@media (max-width: 700px) {
  [data-wb-media-role="hero_background"][data-wb-media-height="tall"] {
    min-height: clamp(360px, 92vw, 620px);
  }
}
