/* Hosts hide this component at their existing mobile breakpoint. */
.ac-desktop-nav {
  display:flex;align-items:center;gap:24px;position:relative;z-index:20;
  margin:0;padding:0;color:inherit;font-size:12px;line-height:1.5;
}
.ac-menu-trigger-label {display:none}
.ac-desktop-services {position:relative;display:flex;align-items:center;line-height:18px}
.ac-desktop-nav>a,.ac-desktop-services-toggle {
  color:inherit;font:inherit;line-height:18px;text-decoration:none;white-space:nowrap;
}
.ac-desktop-services-toggle {
  display:inline-flex;align-items:center;gap:8px;appearance:none;cursor:pointer;
  margin:0;padding:0;border:0;min-width:0;min-height:0;background:none;
}
.ac-desktop-services-toggle::after {
  content:"";display:block;width:5px;height:5px;border-right:1px solid currentColor;
  border-bottom:1px solid currentColor;transform:translateY(-2px) rotate(45deg);
}
.ac-desktop-nav > a:hover,.ac-desktop-services-toggle:hover,
.ac-desktop-services-toggle[aria-expanded="true"] {text-decoration:underline;text-underline-offset:4px}
.ac-desktop-nav :focus-visible {outline:2px solid currentColor;outline-offset:5px}
.ac-desktop-services-panel {
  position:absolute;top:26px;left:-16px;z-index:30;box-sizing:border-box;
  width:max-content;min-width:min(280px,calc(100vw - 32px));max-width:calc(100vw - 32px);
  padding:12px 16px;border:1px solid color-mix(in srgb,currentColor 30%,transparent);
  background:var(--ac-nav-panel-bg,#F2F2ED);color:var(--ac-nav-panel-ink,#15161A);
}
.ac-desktop-services-panel[hidden] {display:none!important}
.ac-desktop-services-panel ul {list-style:none;margin:0;padding:0}
.ac-desktop-services-panel li {margin:0;padding:0}
.ac-desktop-services-panel a {
  display:block;padding:10px 0;color:inherit;font:inherit;font-size:14px;line-height:1.5;
  text-decoration:none;overflow-wrap:anywhere;
}
/* Preserve the hover underline over page-level link resets. */
.ac-desktop-services-panel a:hover {
  text-decoration-line:underline !important;
  text-underline-offset:4px;
}
.ac-desktop-services-panel a[aria-current="page"] {
  position:relative;
  padding-inline-end:14px;
  font-weight:600;
}
.ac-desktop-services-panel a[aria-current="page"]::after {
  content:"";
  position:absolute;
  inset-inline-end:0;
  inset-block-start:50%;
  width:6px;
  height:6px;
  border-radius:50%;
  background:currentColor;
  transform:translateY(-50%);
}
@media(pointer:coarse) {
  .ac-desktop-services-panel a {min-height:44px;box-sizing:border-box;display:flex;align-items:center}
}

/* Retain each authored header's existing colour and mobile breakpoint. */
#ac-home-hero-navigation .hn-header .ac-desktop-nav {
  --ac-nav-panel-bg:var(--hn-identity-bg);
  --ac-nav-panel-ink:var(--hn-identity-fg);
}
.ac-pillar-hero .ac-desktop-nav {
  --ac-nav-panel-bg:var(--pillar-identity-bg);
  --ac-nav-panel-ink:var(--pillar-identity-ink);
}
@container(max-width:760px) {
  #ac-home-hero-navigation .hn-header .ac-desktop-nav {display:none}
  .ac-pillar-hero .ac-pillar-reference-header {gap:14px}
  .ac-pillar-hero .ac-desktop-nav {gap:16px}
}
@container(max-width:600px) {
  .ac-pillar-hero .ac-desktop-nav {display:none}
}

/* A hairline sits in the existing hero gap, without shifting either layout. */
@container(min-width:761px) {
  #ac-home-hero-navigation .hn-page>.hn-header {position:relative}
  #ac-home-hero-navigation .hn-page>.hn-header::after {
    content:"";position:absolute;left:6%;right:6%;top:calc(100% + 24px);
    height:1px;background:color-mix(in srgb,currentColor 30%,transparent);pointer-events:none;
  }
}
@container(min-width:601px) {
  .ac-pillar-hero .ac-pillar-reference-header {position:relative}
  .ac-pillar-hero .ac-pillar-reference-header::after {
    content:"";position:absolute;left:0;right:0;top:calc(100% + 24px);
    height:1px;background:color-mix(in srgb,currentColor 30%,transparent);pointer-events:none;
  }
}

/* The full-width hero is isolated too: keep the header and dropdown above it. */
#ac-home-hero-navigation .hn-page>.hn-header {position:relative;z-index:40}
#ac-home-hero-navigation .hn-menu-button svg.ac-figma-menu-icon,
.ac-pillar-reference-header .ac-pillar-nav-open svg.ac-figma-menu-icon {width:26px;height:15px;flex:none}

/* A narrow desktop review pane still has a mouse; retain phone/touch layouts. */
@media(pointer:fine) {
  @container(min-width:601px) and (max-width:760px) {
    #ac-home-hero-navigation .hn-header .ac-desktop-nav {display:flex;gap:16px}
    #ac-home-hero-navigation .hn-page>.hn-header::after {
      content:"";position:absolute;left:6%;right:6%;top:calc(100% + 24px);
      height:1px;background:color-mix(in srgb,currentColor 30%,transparent);pointer-events:none;
    }
  }
}

/* Keep the desktop links and Menu together at the right edge. */
@media (min-width:601px) and (pointer:fine) {
  :is(
    #ac-home-hero-navigation .hn-page > .hn-header .hn-header-links,
    .ac-pillar-hero .ac-pillar-reference-header,
    #ac-sitewide-header.ac-sitewide-header
  ) {gap:28px}
  .ac-pillar-hero .ac-pillar-reference-header {min-height:30px}
  .ac-pillar-hero .ac-pillar-reference-header .ac-desktop-nav {margin-inline-start:auto}
  :is(
    #ac-home-hero-navigation .hn-page > .hn-header,
    .ac-pillar-hero .ac-pillar-reference-header,
    #ac-sitewide-header.ac-sitewide-header
  ) .ac-desktop-nav {
    flex:none;
    font:400 12px/1.5 Inter,"Helvetica Neue",Arial,sans-serif;
  }
  :is(
    #ac-home-hero-navigation .hn-page > .hn-header .hn-menu-button,
    .ac-pillar-hero .ac-pillar-reference-header .ac-pillar-nav-open,
    #ac-sitewide-header.ac-sitewide-header .ac-sitewide-menu-open
  ) {
    width:auto;min-width:0;height:28px;min-height:28px;
    padding:0 8px;gap:8px;white-space:nowrap;
    font:400 12px/1.5 Inter,"Helvetica Neue",Arial,sans-serif;
  }
  .ac-menu-trigger-label {display:inline}
}

@media (min-width:601px) and (max-width:760px) and (pointer:fine) {
  #ac-home-hero-navigation .hn-page > .hn-header {padding-block-start:32px}
  :is(
    #ac-home-hero-navigation .hn-page > .hn-header,
    #ac-home-hero-navigation .hn-page > .hn-header .hn-header-links,
    .ac-pillar-hero .ac-pillar-reference-header,
    #ac-sitewide-header.ac-sitewide-header
  ),
  :is(
    #ac-home-hero-navigation .hn-page > .hn-header,
    .ac-pillar-hero .ac-pillar-reference-header,
    #ac-sitewide-header.ac-sitewide-header
  ) .ac-desktop-nav {gap:16px}
  :is(
    #ac-home-hero-navigation .hn-page > .hn-header .hn-wordmark,
    .ac-pillar-hero .ac-pillar-reference-header .ac-pillar-nav-wordmark,
    #ac-sitewide-header.ac-sitewide-header .ac-sitewide-wordmark
  ) {flex:0 1 auto;min-width:0}
}
