/* All rem values follow BB Theme's html { font-size: 10px } base — 1.6rem = 16px. */

/* Strip BB's default row padding / module margin around the hero so it
   aligns flush with the navbar. */
.fl-row-content-wrap:has(.cs-hero-photo) {
  padding: 0;
}
.fl-module-content:has(.cs-hero-photo) {
  margin: 0;
}

.cs-hero-photo {
  padding: 0;
}

.cs-hero-photo__frame {
  position: relative;
  min-height: 728px;
  border-radius: var(--cs-radius-xl);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  isolation: isolate;
}

.cs-hero-photo__media {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
}

.cs-hero-photo__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(64, 133, 197, 0) 0%,
    var(--cs-blue-40) 100%
  );
  z-index: 1;
}

.cs-hero-photo__inner {
  position: relative;
  z-index: 2;
  text-align: center;
  padding-inline: var(--cs-gutter);
  max-width: 1100px;
  width: 100%;
}

/* Doubled-up class specificity so these survive BB Global Styles'
   `.fl-builder-content h1 / h1 span` color & font rules. */
.cs-hero-photo .cs-hero-photo__heading {
  font-family: var(--cs-font-display);
  font-weight: 800;
  font-size: clamp(3.6rem, 4.4vw + 0.8rem, var(--cs-text-display));
  font-style: normal;
  line-height: var(--cs-line-tight);
  letter-spacing: var(--cs-tracking-tight);
  color: var(--cs-white);
  text-transform: capitalize;
  margin: 0 0 var(--cs-space-lg);
  text-wrap: balance;
}

.cs-hero-photo .cs-hero-photo__heading span,
.cs-hero-photo .cs-hero-photo__heading em {
  color: inherit;
}

.cs-hero-photo .cs-hero-photo__heading em {
  font-style: italic;
  font-weight: 500;
}

/* Doubled-up class specificity so the label color survives BB Global
   Styles' `.fl-builder-content a` rules. */
.cs-hero-photo .cs-hero-photo__cta {
  display: inline-block;
  background: var(--cs-glass-bg);
  border: 1px solid var(--cs-glass-border);
  backdrop-filter: blur(var(--cs-glass-blur));
  -webkit-backdrop-filter: blur(var(--cs-glass-blur));
  color: var(--cs-white);
  font-family: var(--cs-font-display);
  font-weight: 500;
  font-size: var(--cs-text-button);
  line-height: var(--cs-line-tight);
  text-decoration: none;
  text-transform: capitalize;
  padding: 1.8rem 4.8rem;
  border-radius: var(--cs-radius-sm);
  min-width: min(418px, 100%);
  text-align: center;
  transition: background 200ms ease, transform 200ms ease;
  cursor: pointer;
}

.cs-hero-photo .cs-hero-photo__cta:hover,
.cs-hero-photo .cs-hero-photo__cta:focus-visible {
  background: var(--cs-glass-bg-strong);
  color: var(--cs-white);
  text-decoration: none;
  transform: translateY(-1px);
}

@media (max-width: 768px) {
  .cs-hero-photo__frame {
    min-height: 480px;
    border-radius: var(--cs-radius-md);
  }
  .cs-hero-photo__cta {
    min-width: 0;
    width: 100%;
    padding: 1.6rem 2.4rem;
  }
}