.provis-banner-embed {
  color-scheme: dark;
  --provis-turquoise: #10bdbd;
  --provis-turquoise-light: #44f3ee;
  --provis-blue: #08296f;
  --deep-blue: #020814;
  --content-offset-x: 0px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.provis-banner-embed,
.provis-banner-embed * {
  box-sizing: border-box;
}

.provis-banner-embed .page-shell {
  width: 100%;
}

.provis-banner-row-host {
  position: relative !important;
  overflow: hidden;
  min-height: 100vh;
  min-height: 100svh;
  background: #020814;
}

.provis-banner-row-host > .provis-banner-embed--row-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.provis-banner-row-host > :not(.provis-banner-embed--row-bg) {
  position: relative;
  z-index: 2;
}

.provis-banner-row-host > .provis-banner-row-hotspots {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.provis-banner-embed--row-bg .banner {
  height: 100%;
  min-height: 100%;
}

.provis-banner-embed--row-bg .network-canvas {
  pointer-events: none;
}

.provis-banner-embed--row-bg .hotspots-layer {
  pointer-events: none;
}

.provis-banner-embed--row-bg .hotspot,
.provis-banner-row-hotspots .hotspot {
  pointer-events: auto;
}

.provis-banner-row-host > .provis-banner-embed--row-bg.provis-banner-embed--interactive-links {
  z-index: 3;
}

.provis-banner-row-host > .provis-banner-embed--row-bg.provis-banner-embed--interactive-links .network-canvas {
  pointer-events: none;
}

.provis-banner-row-host > .provis-banner-embed--row-bg.provis-banner-embed--interactive-links .banner {
  pointer-events: none;
}

.provis-banner-row-host > .provis-banner-embed--row-bg.provis-banner-embed--interactive-links .hotspot {
  pointer-events: auto;
}

.provis-banner-embed .banner {
  --core-x: 60%;
  --core-y: 50%;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  background:
    radial-gradient(circle at 62% 50%, rgba(16, 189, 189, 0.2), transparent 18%),
    radial-gradient(circle at 87% 36%, rgba(8, 41, 111, 0.5), transparent 31%),
    linear-gradient(90deg, #030915 0%, #06162a 44%, #020814 100%);
}

.provis-banner-embed .banner::before,
.provis-banner-embed .banner::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.provis-banner-embed .banner::before {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(2, 7, 17, 0.92) 0%, rgba(2, 7, 17, 0.64) 33%, rgba(2, 7, 17, 0.12) 56%, rgba(2, 7, 17, 0) 100%),
    repeating-linear-gradient(90deg, rgba(16, 189, 189, 0.026) 0 1px, transparent 1px 82px),
    repeating-linear-gradient(0deg, rgba(16, 189, 189, 0.02) 0 1px, transparent 1px 68px);
}

.provis-banner-embed .banner::after {
  z-index: -1;
  background:
    radial-gradient(circle at calc(var(--core-x) + var(--content-offset-x)) var(--core-y), transparent 0 8.5%, rgba(68, 243, 238, 0.08) 8.8%, transparent 9.1%),
    radial-gradient(circle at calc(var(--core-x) + var(--content-offset-x)) var(--core-y), transparent 0 13%, rgba(16, 189, 189, 0.06) 13.25%, transparent 13.5%),
    radial-gradient(circle at calc(var(--core-x) + var(--content-offset-x)) var(--core-y), transparent 0 17.4%, rgba(68, 243, 238, 0.04) 17.65%, transparent 17.9%);
}

.provis-banner-embed .network-canvas,
.provis-banner-embed .hotspots-layer {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.provis-banner-embed .network-canvas {
  z-index: 1;
  display: block;
}

.provis-banner-embed .hotspots-layer {
  z-index: 2;
  pointer-events: none;
}

.provis-banner-embed .hotspot {
  --icon-size: clamp(46px, 4.9vw, 58px);
  position: absolute;
  left: calc(var(--x) * 100% + var(--content-offset-x));
  top: calc(var(--y) * 100%);
  display: flex;
  align-items: center;
  gap: 12px;
  width: min(23vw, 250px);
  color: rgba(238, 252, 255, 0.9);
  cursor: pointer;
  text-decoration: none;
  opacity: var(--hotspot-opacity, 0.88);
  pointer-events: auto;
  transform: translate(calc(var(--icon-size) * -0.5), -50%);
  transform-origin: calc(var(--icon-size) * 0.5) 50%;
  transition: opacity 220ms ease, filter 220ms ease;
}

.provis-banner-embed .hotspot.is-active,
.provis-banner-embed .hotspot.is-hovered {
  --hotspot-opacity: 1;
  filter: drop-shadow(0 0 14px rgba(68, 243, 238, 0.28));
}

.provis-banner-embed .hotspot__icon {
  flex: 0 0 var(--icon-size);
  width: var(--icon-size);
  height: var(--icon-size);
  display: grid;
  place-items: center;
  color: var(--hotspot-icon-color, var(--provis-turquoise-light));
  border: 1px solid rgba(68, 243, 238, 0.5);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(16, 189, 189, 0.18), rgba(3, 18, 39, 0.82) 62%),
    rgba(3, 18, 39, 0.58);
  box-shadow:
    0 0 0 7px rgba(16, 189, 189, 0.055),
    0 0 20px rgba(68, 243, 238, 0.18);
  transition: transform 240ms cubic-bezier(0.2, 0.7, 0.2, 1), border-color 220ms ease, box-shadow 220ms ease;
}

.provis-banner-embed .hotspot__icon svg,
.provis-banner-embed .hotspot__icon img,
.provis-banner-embed .hotspot__icon-media {
  width: var(--hotspot-glyph-size, 46%);
  height: var(--hotspot-glyph-size, 46%);
  display: block;
  object-fit: contain;
}

.provis-banner-embed .hotspot__icon-media {
  background: currentColor;
}

.provis-banner-embed .hotspot__icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 240ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.provis-banner-embed .hotspot.is-hovered .hotspot__icon {
  border-color: rgba(68, 243, 238, 0.95);
  border-radius: 42%;
  box-shadow:
    0 0 0 9px rgba(16, 189, 189, 0.08),
    0 0 28px rgba(68, 243, 238, 0.36);
  transform: scale(1.08);
}

.provis-banner-embed .hotspot.is-hovered .hotspot__icon svg,
.provis-banner-embed .hotspot.is-hovered .hotspot__icon img,
.provis-banner-embed .hotspot.is-hovered .hotspot__icon-media {
  transform: scale(1.08);
}

.provis-banner-embed .hotspot__copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.provis-banner-embed .hotspot strong {
  color: var(--provis-turquoise-light);
  font-size: clamp(9px, 0.88vw, 12px);
  line-height: 1.1;
  letter-spacing: 0;
  transition: color 220ms ease, text-shadow 220ms ease;
}

.provis-banner-embed .hotspot.is-hovered strong {
  color: #70fff8;
  text-shadow: 0 0 12px rgba(68, 243, 238, 0.45);
}

.provis-banner-embed .hotspot__copy > span {
  color: rgba(213, 239, 246, 0.7);
  font-size: clamp(9px, 0.82vw, 11px);
  line-height: 1.35;
}

@media (max-width: 1050px) {
  .provis-banner-embed .hotspot {
    --icon-size: clamp(38px, 5vw, 48px);
    width: min(22vw, 210px);
    gap: 8px;
    filter: saturate(0.94);
    transform: none;
    transform-origin: calc(var(--icon-size) * 0.5) 50%;
  }

  .provis-banner-embed .hotspot[data-hotspot="analytics"],
  .provis-banner-embed .hotspot[data-hotspot="reports"] {
    flex-direction: row;
    text-align: left;
    transform: none;
    transform-origin: calc(var(--icon-size) * 0.5) 50%;
  }

  .provis-banner-embed .hotspot__icon {
    box-shadow:
      0 0 0 5px rgba(16, 189, 189, 0.045),
      0 0 14px rgba(68, 243, 238, 0.14);
  }

  .provis-banner-embed .hotspot strong {
    font-size: clamp(9px, 1.25vw, 11px);
  }

}

@media (min-width: 769px) and (max-width: 1050px) {
  .provis-banner-embed .hotspot {
    --icon-size: clamp(40px, 4.8vw, 48px);
    width: clamp(150px, 18vw, 190px);
    gap: 9px;
  }

  .provis-banner-embed .hotspot__copy > span {
    font-size: clamp(8px, 1vw, 10px);
    line-height: 1.25;
  }
}

@media (max-width: 760px) {
  .provis-banner-embed .banner {
    background:
      radial-gradient(circle at var(--core-x) var(--core-y), rgba(16, 189, 189, 0.17), transparent 22%),
      radial-gradient(circle at 88% 38%, rgba(8, 41, 111, 0.42), transparent 36%),
      linear-gradient(90deg, #030915 0%, #06162a 46%, #020814 100%);
  }
}

@media (max-width: 768px) {
  .provis-banner-embed .banner {
    background:
      radial-gradient(circle at var(--core-x) var(--core-y), rgba(16, 189, 189, 0.14), transparent 24%),
      radial-gradient(circle at 92% 45%, rgba(8, 41, 111, 0.34), transparent 42%),
      linear-gradient(90deg, #020711 0%, #041126 54%, #020814 100%);
  }

  .provis-banner-embed .banner::before {
    background:
      linear-gradient(90deg, rgba(2, 7, 17, 0.98) 0%, rgba(2, 7, 17, 0.86) 42%, rgba(2, 7, 17, 0.28) 74%, rgba(2, 7, 17, 0.08) 100%),
      linear-gradient(180deg, rgba(2, 7, 17, 0.64) 0%, rgba(2, 7, 17, 0.04) 45%, rgba(2, 7, 17, 0) 100%),
      repeating-linear-gradient(90deg, rgba(16, 189, 189, 0.02) 0 1px, transparent 1px 58px),
      repeating-linear-gradient(0deg, rgba(16, 189, 189, 0.018) 0 1px, transparent 1px 54px);
  }

  .provis-banner-embed .hotspot {
    --icon-size: clamp(34px, 9vw, 40px);
    width: 39vw;
  }

  .provis-banner-embed .hotspot strong {
    font-size: clamp(9px, 2.4vw, 10px);
  }

  .provis-banner-embed .hotspot__copy {
    gap: 2px;
  }

  .provis-banner-embed .hotspot__copy > span {
    font-size: clamp(7.5px, 2vw, 9px);
    line-height: 1.18;
  }
}