/* DearCustomer.Marketing: the floating header (Beau picked it 2026-10-22: "this 1 and push please").
   Raycast's header (raycast.com, measured at 1440) rebuilt in DearCustomer's navy: a card floating 16 px under the top,
   the gold logo, muted links, and a gold key-cap Let's Meet. It slides away as you scroll down and comes back the moment
   you scroll up (Beau, 10/22: "needs to auto hide on scroll down and show on scroll up").
   Desktop only (901px and up): phones keep today's header exactly. CSS only; loaded on every page after new-home.css.
   Prototype: sandbox/variants/hdr-ray-gold. To remove: delete this file and its one line in functions.php. */
@media (min-width: 901px) {
  /* Raycast's header, measured 2026-10-22 (raycast.com at 1440): a card floating 16 px under the top, 1204 x 76, radius 16,
     a dark gradient at 75 to 90% over a 5 px blur, a 1 px edge at 6% white, a 1 px inner highlight on its top edge; links
     #9c9c9d 14 px / 500 / 0.2 px; one key-cap button. Here: the same card in navy, 1200 wide (the page's own column),
     72 tall. Raycast's never hides; this one does, as the theme's header always did. */
  body.nh.pal-b .wp-site-blocks > .wp-block-template-part:first-child,
  body.nh.pal-b .wp-site-blocks > .wp-block-template-part:first-child.is-scrolled {
    background: transparent; box-shadow: none; transform: none; pointer-events: none;   /* only the card takes clicks */
  }
  /* down hides it, any scroll up brings it back: the theme's own script sets .is-hidden and its 0.28 s ease-out does the
     sliding. The card sits 16 px down and its shadow reaches 44 px below it, so it goes 48 px past its own height */
  body.nh.pal-b .wp-site-blocks > .wp-block-template-part:first-child.is-hidden {
    background: transparent; box-shadow: none; pointer-events: none; transform: translateY(calc(-100% - 48px));
  }
  /* the page runs up under the card only where its first section can take the 88 px (all 14 pages on 2026-10-22); a page
     built another way keeps an 88 px strip for the card, so nothing can slide under it */
  body.nh.pal-b:has(.nh-main > :first-child) .wp-site-blocks > .wp-block-template-part:first-child { margin-bottom: -88px; }
  /* the page starts under the card: every page's first section paints its own colour under an 88 px transparent border */
  body.nh.pal-b .nh-main > :first-child { border-top: 88px solid transparent; }
  body.nh.pal-b .mk-nav { box-sizing: border-box; height: 88px; padding-top: 16px; align-items: flex-start; }
  body.nh.pal-b .mk-nav-row {
    pointer-events: auto; box-sizing: border-box; height: 72px; padding: 0 18px 0 26px;
    border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 16px;
    background: linear-gradient(137deg, rgba(36, 42, 58, 0.97) 5%, rgba(28, 33, 48, 0.985) 76%);   /* near solid: at Raycast's 75 to 90% the cream pages bled through and turned it slate */
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.14), 0 12px 32px rgba(10, 12, 20, 0.16);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  }
  /* the gold logo (white wordmark) on the navy card, without a script; its words are 23.8% of the file's height */
  body.nh.pal-b .mk-logo { background: url("/wp-content/themes/dcm/assets/media/logo-gold.webp") left center / auto 46px no-repeat; }
  body.nh.pal-b .mk-logo-img { height: 46px; opacity: 0; }
  body.nh.pal-b .nh-pill { background: transparent; box-shadow: none; padding: 0; gap: 4px; }
  body.nh.pal-b .nh-pill .mk-pill-link {
    min-height: 36px; padding: 0 14px; border-radius: 8px; background: transparent; box-shadow: none;
    color: rgba(255, 255, 255, 0.64); font-size: 14.5px; font-weight: 500; letter-spacing: 0.2px; transition: color 0.2s ease, background-color 0.2s ease;
  }
  body.nh.pal-b .nh-pill .mk-pill-link:hover, body.nh.pal-b .nh-sub.is-open .nh-sub-btn { background: rgba(255, 255, 255, 0.06); color: #ffffff; box-shadow: none; }
  body.nh.pal-b .nh-sub-btn svg { width: 12px; height: 12px; }
  /* About us opens in a smaller card of the same make */
  body.nh.pal-b .nh-menu-ready .nh-sub-menu {
    top: calc(100% + 18px); padding: 6px; border-radius: 14px; border: 1px solid rgba(255, 255, 255, 0.08);
    background: linear-gradient(137deg, rgba(38, 44, 61, 0.92) 5%, rgba(28, 33, 48, 0.97) 76%);
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.12), 0 16px 36px rgba(10, 12, 20, 0.28);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  }
  body.nh.pal-b .nh-sub-menu a { min-height: 40px; border-radius: 9px; font-size: 14.5px; color: rgba(255, 255, 255, 0.8); }
  body.nh.pal-b .nh-sub-menu a:hover { background: rgba(255, 255, 255, 0.06); color: #ffffff; }
  /* the button: a key cap, as Raycast's is (dark ring, soft glow, a lit top edge, a shaded bottom edge) */
  body.nh.pal-b .mk-nav-cta {
    height: 38px; min-height: 0; padding: 0 18px; border-radius: 9px; font-size: 14.5px; font-weight: 600; letter-spacing: 0.2px;
    transition: background-color 0.2s ease, transform 0.12s ease;
  }
  body.nh.pal-b .mk-nav-cta:active { transform: scale(0.97); }
  body.nh.pal-b .mk-nav-cta { background: var(--nh-gold); color: var(--nh-navy);
    box-shadow: 0 0 0 2px rgba(8, 10, 16, 0.42), 0 0 16px rgba(212, 166, 78, 0.26), inset 0 -1px 0.4px rgba(0, 0, 0, 0.25), inset 0 1px 0.4px rgba(255, 255, 255, 0.75); }
  body.nh.pal-b .mk-nav-cta:hover { background: var(--nh-gold-hover); color: var(--nh-navy); }
}

/* The silver links (Beau picked S4, plate, 2026-10-23: "s4 please"; asked for on 10/22: "can we make the grey text
   like silver and sexy", then "text color more so i dont see a change in text color"). Solid platinum letters raised off
   the card, a cool glow, weight 560; hover lights the pill and doubles the glow. The weight is the theme's own inter.woff2
   (its axis runs to 900; the theme's @font-face stops at 500) under a family name only these links use, so no other text
   changes. Desktop only, like the rest of this file. Prototype: sandbox/variants/hdr-silver-plate. To remove the silver,
   delete from this comment to the end of the file. The font path is absolute so it resolves the same in the sandbox. */
@font-face { font-family: 'DCM Inter Nav'; src: url(/wp-content/themes/dcm/assets/fonts/inter.woff2) format('woff2'); font-weight: 100 900; font-display: swap; }
@media (min-width: 901px) {
  body.nh.pal-b .nh-pill .mk-pill-link, body.nh.pal-b .nh-sub-menu a {
    font-family: 'DCM Inter Nav', Inter, ui-sans-serif, system-ui, sans-serif; font-weight: 560;
    color: #f2f5fa; letter-spacing: 0.35px;
    text-shadow: 0 1px 0 rgba(4, 6, 12, 0.85), 0 0 12px rgba(196, 214, 245, 0.5);   /* raised, and lit */
    transition: color 0.2s ease, background-color 0.2s ease, text-shadow 0.25s ease;
  }
  /* a near-white word has little room to brighten, so hover lights the pill under it and doubles the glow
     (at 0.06 and one glow it was only 1.35x its rest; live's grey goes 2.7x) */
  body.nh.pal-b .nh-pill .mk-pill-link:hover, body.nh.pal-b .nh-sub.is-open .nh-sub-btn, body.nh.pal-b .nh-sub-menu a:hover {
    color: #ffffff; background-color: rgba(214, 226, 250, 0.13);
    text-shadow: 0 1px 0 rgba(4, 6, 12, 0.85), 0 0 6px rgba(255, 255, 255, 0.55), 0 0 18px rgba(206, 222, 250, 0.95);
  }
}