/* ============================================================
   Landing pages (main.dx-lp): no green nav bar (Nick, 14 Oct).
   - The logo and the Book your demo button both sit at the top of the
     page over the hero and scroll away with it. Nothing floats over
     the content (Nick, 14 Oct: the floating button was removed).
   - The button is a cream pill; its right edge mirrors the logo's left
     edge and it is centred on the logo's line.
   - Epilogue caps sit about 2px high in their line box, so the button
     has extra padding on top (4px desktop, 3px phones at 11px type) to
     centre the lettering optically. Measured to within 0.2px.
   Works with de-lp.css, which already hides the other nav links.
   ============================================================ */
html body:has(main.dx-lp) .de-header,
html body:has(main.dx-lp) .de-header.is-scrolled {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  z-index: 900 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}
html body:has(main.dx-lp) .de-header > .de-wrap {
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
html body:has(main.dx-lp) .de-header .de-nav { transform: none !important; }

html body:has(main.dx-lp) .de-header .de-nav a.de-cta {
  position: absolute !important;
  top: 26px;
  right: calc(max(0px, (100% - 1200px) / 2) + 20px);
  z-index: 900;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: 44px;
  margin: 0 !important;
  padding: 4px 24px 0 !important;
  border-radius: 999px !important;
  line-height: 1 !important;
  white-space: nowrap;
  background: #EDE4D3 !important;
  border-color: #EDE4D3 !important;
  color: #15301F !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
  transition: background 0.15s ease, transform 0.15s ease;
}
html body:has(main.dx-lp) .de-header .de-nav a.de-cta:hover {
  background: #E3C860 !important;
  border-color: #E3C860 !important;
  transform: translateY(-1px);
}
@media (max-width: 900px) {
  html body:has(main.dx-lp) .de-header .de-nav a.de-cta {
    top: 24px;
    right: 32px;
    height: 40px;
    padding: 3px 18px 0 !important;
  }
}
@media (max-width: 380px) {
  html body:has(main.dx-lp) .de-header .de-nav a.de-cta { right: 16px; padding: 3px 14px 0 !important; }
}
