/* Product-first homepage hero. Uses the production video and live HTML. */
.rr-public-home .rr-site-header,
.rr-public-home .rr-site-header[data-scrolled] {
  background: #050606;
  border-color: transparent;
  box-shadow: none;
}

.rr-public-home .rr-site-header__brand,
.rr-public-home .rr-wordmark {
  color: #f5f5f1;
}

.rr-public-home .rr-site-header .rr-nav-link {
  color: rgb(245 245 241 / 72%);
}

.rr-public-home .rr-site-header .rr-nav-link:hover,
.rr-public-home .rr-site-header .rr-nav-link:focus-visible {
  color: #f5f5f1;
}

.rr-public-home .rr-site-header__actions .rr-header-action {
  display: none;
}

.rr-public-home #overview {
  background: #050606;
}

.rr-public-home #overview .rr-campaign-stage {
  position: relative;
  min-height: calc(100svh - 72px);
  max-width: none;
  overflow: hidden;
}

.rr-public-home #overview .rr-campaign-media {
  position: absolute;
  inset: 0;
  height: 100%;
  background: #050606;
}

.rr-public-home #overview .rr-campaign-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% center;
}

.rr-public-home #overview .rr-campaign-shade {
  display: block;
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgb(0 0 0 / 76%) 0%, rgb(0 0 0 / 34%) 36%, transparent 62%);
  pointer-events: none;
}

.rr-public-home #overview .rr-campaign-content {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  width: 100%;
  max-width: 1376px;
  min-height: calc(100svh - 72px);
  margin-inline: auto;
  padding: 80px 48px 168px;
}

.rr-public-home #overview .rr-campaign-message {
  width: min(100%, 560px);
}

.rr-public-home #overview .rr-campaign-headline {
  max-width: none;
  margin: 0;
  color: #f5f5f1;
  font-size: clamp(48px, 5vw, 72px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.04em;
  text-wrap: balance;
  white-space: nowrap;
}

.rr-public-home .rr-hero-replay {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-height: 48px;
  margin-top: 24px;
  color: #20d8bc;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
  text-decoration: none;
}

.rr-public-home .rr-hero-replay:hover {
  color: #8cebdc;
}

.rr-public-home .rr-hero-audiences {
  position: absolute;
  z-index: 2;
  bottom: 32px;
  left: max(48px, calc((100vw - 1280px) / 2));
  display: flex;
  align-items: center;
  gap: 64px;
}

.rr-public-home .rr-hero-audiences a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  color: rgb(245 245 241 / 72%);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  text-decoration: none;
}

.rr-public-home .rr-hero-audiences a:hover,
.rr-public-home .rr-hero-audiences a:focus-visible {
  color: #f5f5f1;
}

.rr-public-home .rr-site-header .rr-mobile-menu-button,
.rr-public-home .rr-public-mobile summary {
  border-color: rgb(245 245 241 / 36%);
  background: transparent;
  color: #f5f5f1;
}

@media (max-width: 1023px) {
  .rr-public-home #overview .rr-campaign-content {
    padding-inline: 32px;
  }

  .rr-public-home .rr-hero-audiences {
    left: 32px;
    gap: 40px;
  }
}

@media (max-width: 767px) {
  .rr-public-home #overview .rr-campaign-stage,
  .rr-public-home #overview .rr-campaign-content {
    min-height: calc(100svh - 64px);
  }

  .rr-public-home #overview .rr-campaign-video {
    object-position: 62% center;
  }

  .rr-public-home #overview .rr-campaign-shade {
    background:
      linear-gradient(0deg, rgb(0 0 0 / 94%) 0%, rgb(0 0 0 / 28%) 62%, rgb(0 0 0 / 4%) 100%),
      linear-gradient(90deg, rgb(0 0 0 / 32%), transparent 72%);
  }

  .rr-public-home #overview .rr-campaign-content {
    align-items: flex-end;
    padding: 320px 24px 176px;
  }

  .rr-public-home #overview .rr-campaign-headline {
    max-width: 9ch;
    font-size: clamp(44px, 14vw, 56px);
    white-space: normal;
  }

  .rr-public-home .rr-hero-audiences {
    right: 24px;
    bottom: 24px;
    left: 24px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }

  .rr-public-home .rr-hero-audiences a {
    justify-content: flex-start;
    font-size: 14px;
  }
}

@media (max-width: 359px) {
  .rr-public-home .rr-hero-audiences {
    grid-template-columns: 1fr 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rr-public-home #overview .rr-campaign-video {
    display: none;
  }

  .rr-public-home #overview .rr-campaign-media {
    background: #050606 url('/assets/video/rodentradar-device-background-poster-v4.jpg') 62% center / cover no-repeat;
  }
}

.rr-public-home .rr-hero-description {max-width:38ch;margin:20px 0 0;color:#edf3ef;font-size:18px;line-height:1.55;text-wrap:pretty}
@media(max-width:639px){.rr-public-home #overview .rr-campaign-content{padding-top:260px;padding-bottom:132px}.rr-public-home .rr-hero-description{font-size:16px;max-width:32ch}}

/* Keep the brand accent readable on the dark homepage header. */
.rr-public-home .rr-wordmark span { color: #00d4aa; }