/* Shared public title header. Loaded on the public frontend except home.
 * .slippa-breadcump is the existing common component in all public templates.
 * The original background image, typography and content stay in the templates.
 * Navigation, text, optional sponsored cards and the wave each occupy real space.
 */
html body .slippa-breadcump {
  --dval-hero-nav-height: 120px;
  --dval-hero-title-space: 48px;
  --dval-hero-wave-space: 150px;
  --dval-hero-content-gap: 40px;
  position: relative;
  isolation: isolate;
  height: auto;
  min-height: 0;
  padding: var(--dval-hero-nav-height) 0 var(--dval-hero-wave-space);
  margin: 0 0 var(--dval-hero-content-gap) !important;
  background: transparent;
}
html body .slippa-breadcump > .slippa-page-bg {
  top: var(--dval-hero-nav-height);
  bottom: 0;
  height: auto;
  width: 100%;
  margin: 0;
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: -1;
}
html body .slippa-breadcump > .container > .row.slippa-breadcump-height,
html body .slippa-breadcump > .container > [data-dval-hero-content],
html body .slippa-breadcump > [data-dval-hero-content] {
  height: auto;
  min-height: 0;
  padding-top: var(--dval-hero-title-space) !important;
  padding-bottom: 0 !important;
}
html body .slippa-breadcump > .container > .row.slippa-breadcump-height > [class*="col-"] {
  min-width: 0;
}
html body .slippa-breadcump :is(h1,h4,p) { overflow-wrap: anywhere; }
html body .slippa-breadcump .dval-listing-hero-title,
html body .slippa-breadcump .dval-listing-hero-title > span { max-width: 100%; }
html body .slippa-breadcump #dvalListingHeroName { white-space: normal; overflow-wrap: anywhere; }
html body .slippa-breadcump > .dval-sponsored-hero { padding-top: 24px; padding-bottom: 0; }
/* The component owns its content gutter. Never add a second page-specific gap.
 * Only the immediate following content block is normalized; later sections keep
 * their own spacing. Hidden form fields/clearfix elements are not content blocks.
 */
html body .slippa-breadcump + :is(.section,section,main,.container,[class*="dval-"]) {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
html body .slippa-breadcump + .full-width-carousel-fix { margin-bottom: 40px; }
@media (max-width: 991.98px) {
  html body .slippa-breadcump { --dval-hero-title-space: 44px; --dval-hero-wave-space: 140px; }
}
@media (max-width: 767.98px) {
  html body .slippa-breadcump {
    --dval-hero-title-space: 36px;
    --dval-hero-wave-space: 110px;
    --dval-hero-content-gap: 32px;
  }
  html body .slippa-breadcump + .full-width-carousel-fix { margin-bottom: 40px; }
}

/* Landing/help pages use the same title component with their existing content. */
html body .slippa-breadcump > [data-dval-hero-content] { text-align: center; }
html body .slippa-breadcump > [data-dval-hero-content] :is(h1,p) { margin-inline: auto; }
html body .slippa-breadcump.dval-sell-hero::before,
html body .slippa-breadcump.dval-sell-hero::after { content: none; }