/* Shared responsive brochure shell.
   Load via params.cdnAssets and tune through site-owned --brochure-* variables. */

header .ql-brochure-nav-toggle {
  display: none;
}

/* Preserve the full navigation through intermediate desktop widths. Constrain
   the primary rail to its grid track so long menus wrap instead of crossing
   the logo or header tools. */
@media screen and (min-width: 981px) and (max-width: 1280px) {
  header[data-ql-brochure-shell="true"] {
    padding:
      var(--brochure-intermediate-header-padding-y, 0.85rem)
      var(--brochure-intermediate-header-padding-x, var(--size_padding-medium));
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "logo"
      "menu"
      "cta" !important;
    justify-items: center;
    gap:
      var(--brochure-intermediate-header-row-gap, 0.4rem)
      var(--brochure-intermediate-header-column-gap, 0.6rem);
  }

  header[data-ql-brochure-shell="true"] > .logo {
    grid-area: logo;
    width: 100%;
    min-width: 0;
    display: flex;
    justify-content: center;
    text-align: center;
  }

  header[data-ql-brochure-shell="true"] > .logo > .logo {
    width: min(100%, var(--brochure-intermediate-logo-width, clamp(13rem, 22vw, 16rem))) !important;
    max-width: none !important;
    min-width: 0;
    margin-inline: auto;
  }

  header[data-ql-brochure-shell="true"] > .logo > .logo svg,
  header[data-ql-brochure-shell="true"] > .logo > .logo img {
    display: block;
    width: 100% !important;
    height: auto;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  header[data-ql-brochure-shell="true"] > .menu {
    grid-area: menu;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    justify-self: stretch !important;
    justify-content: center;
  }

  header[data-ql-brochure-shell="true"] > .altmenu,
  header[data-ql-brochure-shell="true"] > .ql-header-tools {
    grid-area: cta;
    width: 100%;
    min-width: 0;
    margin-left: 0;
    justify-content: center;
  }

  header[data-ql-brochure-shell="true"] > .menu > .ql-menu-root {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: flex;
    /* The compiled desktop header is emitted later and deliberately uses
       nowrap. This intermediate tier must win that single property. */
    flex-flow: row wrap !important;
    justify-content: center;
  }

  header[data-ql-brochure-shell="true"] > .menu > .ql-menu-root > li {
    min-width: 0;
  }
}

@media screen and (max-width: 980px) {
  main {
    --surface-section-padding-x: var(--brochure-tablet-page-gutter, 1rem);
  }

  header[data-ql-brochure-shell="true"] {
    --surface-nav-row-gap: var(--brochure-compact-nav-row-gap, 0.28rem);
    --surface-nav-column-gap: var(--brochure-compact-nav-column-gap, 0.42rem);
    --surface-nav-link-size: var(--brochure-compact-nav-link-size, 0.9rem);
    --surface-nav-link-padding-x: var(--brochure-compact-nav-link-padding-x, 0.08rem);
    --surface-nav-link-padding-y: var(--brochure-compact-nav-link-padding-y, 0.12rem);
    padding:
      var(--brochure-compact-header-padding-y, 0.75rem)
      var(--brochure-compact-header-padding-x, var(--size_padding-medium));
    align-items: center;
    gap:
      var(--brochure-compact-header-row-gap, 0.35rem)
      var(--brochure-compact-header-column-gap, 0.5rem);
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "logo"
      "menu"
      "cta"
      "section" !important;
    justify-items: center;
  }

  header[data-ql-brochure-shell="true"]:not([data-ql-header-cta-slot="altmenu"]) {
    grid-template-areas:
      "logo"
      "menu"
      "section" !important;
  }

  header[data-ql-brochure-shell="true"]:has(> .ql-header-tools) {
    grid-template-areas:
      "logo"
      "menu"
      "cta"
      "tools"
      "section" !important;
  }

  header[data-ql-brochure-shell="true"]:has(> .ql-header-tools):not([data-ql-header-cta-slot="altmenu"]) {
    grid-template-areas:
      "logo"
      "menu"
      "tools"
      "section" !important;
  }

  header[data-ql-brochure-shell="true"] > .logo {
    grid-area: logo;
    width: 100%;
    min-width: 0;
    text-align: center;
    margin-bottom: 0.1rem;
    box-sizing: border-box;
    padding-inline: 0;
    display: flex;
    justify-content: center;
  }

  header[data-ql-brochure-shell="true"] > .logo svg,
  header[data-ql-brochure-shell="true"] > .logo img {
    display: block;
    width: auto;
    /* Inline SVG logos can collapse to 0x0 if left at height:auto in tight grids. */
    height: var(--brochure-compact-logo-height, 3.3rem);
    max-width: var(--brochure-compact-logo-max, 14rem);
    min-width: 0;
    margin-inline: auto;
  }

  header[data-ql-brochure-shell="true"] > .menu,
  header[data-ql-brochure-shell="true"] > .sectionmenu,
  header[data-ql-brochure-shell="true"] > .altmenu {
    min-width: 0;
    display: flex;
    align-items: stretch;
  }

  header[data-ql-brochure-shell="true"] > .menu {
    grid-area: menu;
    width: 100%;
    justify-content: center;
  }

  header[data-ql-brochure-shell="true"] > .altmenu {
    grid-area: cta;
    width: 100%;
    min-width: max-content;
    justify-content: center;
  }

  header[data-ql-brochure-shell="true"] > .ql-header-tools {
    grid-area: tools;
    width: 100%;
    min-width: 0;
    margin-left: 0;
    justify-content: center;
  }

  header[data-ql-brochure-shell="true"] > .sectionmenu {
    grid-area: section;
    width: 100%;
    justify-content: flex-end;
    margin-top: var(--brochure-section-nav-margin-top, 0.12rem);
    padding:
      var(--brochure-section-nav-padding-y, 0.4rem)
      var(--brochure-section-nav-padding-x, 0);
    border-block:
      1px solid
      var(--brochure-section-nav-rule, color-mix(in srgb, currentColor 13%, transparent));
  }

  header[data-ql-brochure-shell="true"] > .menu .ql-menu-root {
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: stretch;
    gap: var(--surface-nav-row-gap) var(--surface-nav-column-gap);
    margin: 0 !important;
    padding: 0;
  }

  header[data-ql-brochure-shell="true"] > .sectionmenu .ql-menu-root {
    width: min(100%, var(--brochure-section-nav-max-width, 64rem));
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-end;
    align-items: center;
    gap:
      var(--brochure-section-nav-row-gap, 0.22rem)
      var(--brochure-section-nav-column-gap, clamp(0.85rem, 2.2vw, 1.45rem));
    margin: 0 !important;
    padding: 0;
    list-style: none;
  }

  header[data-ql-brochure-shell="true"] > .sectionmenu .ql-menu-root > li {
    margin: 0;
    padding: 0;
    min-width: 0;
    display: flex;
    justify-content: center;
    list-style: none;
  }

  header[data-ql-brochure-shell="true"] > .menu .ql-menu-root > li {
    margin: 0;
    min-width: 0;
    display: flex;
    justify-content: center;
  }

  header[data-ql-brochure-shell="true"] > .altmenu .ql-menu-root {
    width: auto;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    gap: var(--surface-nav-row-gap) var(--surface-nav-column-gap);
    margin: 0 !important;
    padding: 0;
  }

  header[data-ql-brochure-shell="true"] > .altmenu .ql-menu-root > li {
    margin: 0;
    min-width: max-content;
    display: flex;
    justify-content: flex-end;
  }

  header[data-ql-brochure-shell="true"] .ql-menu-root > .ql-menu-item--has-children {
    width: auto;
    grid-column: auto;
    min-width: max-content;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  header[data-ql-brochure-shell="true"] .ql-menu-root > .ql-menu-item--has-children::after {
    right: 0;
    left: auto;
    width: var(--brochure-compact-submenu-min-width, 13rem);
    height: calc(var(--brochure-compact-submenu-offset, 0.55rem) + 0.35rem);
    transform: none;
  }

  header[data-ql-brochure-shell="true"] .ql-menu-submenu {
    position: absolute;
    top: calc(100% + var(--brochure-compact-submenu-offset, 0.55rem));
    right: 0;
    left: auto;
    transform: translateY(-0.2rem);
    min-width: var(--brochure-compact-submenu-min-width, 13rem);
    width: max-content;
    max-width: min(calc(100vw - 2rem), var(--brochure-compact-submenu-max-width, 28rem));
    margin-top: 0 !important;
    padding: var(--brochure-compact-submenu-padding, 0.55rem 0.75rem);
    align-self: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap:
      var(--brochure-compact-submenu-row-gap, 0.28rem)
      var(--brochure-compact-submenu-column-gap, 0.75rem);
    border: 1px solid var(--brochure-compact-submenu-border, color-mix(in srgb, currentColor 12%, transparent));
    border-radius: var(--brochure-compact-submenu-radius, 0.45rem);
    background: var(--brochure-compact-submenu-bg, var(--surface-header-bg, var(--header_bg, var(--bg))));
    backdrop-filter: var(--brochure-compact-submenu-backdrop, blur(12px));
    box-shadow: var(--brochure-compact-submenu-shadow, 0 14px 34px rgba(0, 0, 0, 0.12));
    display: none;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: none;
  }

  header[data-ql-brochure-shell="true"] .ql-menu-root > .ql-menu-item--has-children:hover > .ql-menu-submenu,
  header[data-ql-brochure-shell="true"] .ql-menu-root > .ql-menu-item--has-children:focus-within > .ql-menu-submenu {
    display: flex;
    max-height: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  header[data-ql-brochure-shell="true"] > .menu a {
    width: 100%;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    white-space: normal;
    line-height: var(--surface-nav-link-line-height, 1.08);
    font-size: var(--surface-nav-link-size, 0.9rem);
    padding-inline: var(--surface-nav-link-padding-x, 0.08rem);
    padding-block: var(--surface-nav-link-padding-y, 0.12rem);
    min-height: var(--brochure-compact-nav-item-min-height, 2.3rem);
  }

  header[data-ql-brochure-shell="true"] > .sectionmenu a {
    position: relative;
    width: auto;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
    color: inherit;
    text-decoration: none;
    line-height: 1.15;
    font-size: var(--brochure-section-nav-link-size, 0.9rem);
    padding: 0.14rem 0 0.22rem;
    min-height: 0;
    opacity: 0.82;
  }

  header[data-ql-brochure-shell="true"] > .sectionmenu a:hover,
  header[data-ql-brochure-shell="true"] > .sectionmenu a:focus-visible,
  header[data-ql-brochure-shell="true"] > .sectionmenu a.active,
  header[data-ql-brochure-shell="true"] > .sectionmenu a.ancestor,
  header[data-ql-brochure-shell="true"] > .sectionmenu a[aria-current="page"],
  header[data-ql-brochure-shell="true"] > .sectionmenu a[aria-current="true"] {
    opacity: 1;
  }

  header[data-ql-brochure-shell="true"] > .sectionmenu a.active,
  header[data-ql-brochure-shell="true"] > .sectionmenu a.ancestor,
  header[data-ql-brochure-shell="true"] > .sectionmenu a[aria-current="page"],
  header[data-ql-brochure-shell="true"] > .sectionmenu a[aria-current="true"] {
    font-weight: 700;
  }

  header[data-ql-brochure-shell="true"] > .altmenu a {
    width: auto;
    max-width: none;
    white-space: nowrap;
    min-height: 0;
  }

  header[data-ql-brochure-shell="true"] > .altmenu .ql-menu-root > li > a:not(#special) {
    padding:
      var(--brochure-compact-secondary-padding-y, 0.48rem)
      var(--brochure-compact-secondary-padding-x, 0.8rem);
    border-radius: var(--brochure-compact-secondary-radius, 999px);
    background: var(--brochure-compact-secondary-bg, rgba(255, 255, 255, 0.72));
    box-shadow:
      inset 0 0 0 1px var(--brochure-compact-secondary-border, rgba(34, 49, 39, 0.14)),
      0 10px 24px rgba(32, 48, 39, 0.06);
    font-weight: 600;
  }

  header[data-ql-brochure-shell="true"] .menu ul > li:has(> a#special),
  header[data-ql-brochure-shell="true"] .altmenu ul > li:has(> a#special) {
    display: contents;
  }

  header[data-ql-brochure-shell="true"] {
    /* Feed the 3D button via variables so the hover-turn effect keeps working. */
    --nav-special-width: 132px;
    --nav-special-width: max(var(--brochure-compact-nav-special-width, 132px), 132px);
    --nav-special-height: 44px;
    --nav-special-height: max(var(--brochure-compact-nav-special-height, 44px), 44px);
    --special-button-font-size: var(--brochure-compact-nav-special-font-size, clamp(1rem, 1.6vw, 1.2rem));
  }

  header[data-ql-brochure-shell="true"] .menu ul > li > a#special,
  header[data-ql-brochure-shell="true"] .altmenu ul > li > a#special,
  header[data-ql-brochure-shell="true"] > a#special {
    display: var(--brochure-compact-nav-special-display, block);
    position: relative;
    top: auto;
    right: auto;
    z-index: auto;
    min-height: 0;
    padding-inline: var(--brochure-compact-nav-special-padding-x, 0.55rem);
  }
}

@media screen and (min-width: 737px) and (max-width: 980px) {
  body:is(.ql-page-type-home, .ql-page-type-homepage) main .banner.halfscreen > .content > .ql-hero {
    max-width: min(100%, var(--brochure-tablet-home-hero-max, 44rem));
    padding:
      var(--brochure-tablet-home-hero-padding-y, 0)
      var(--brochure-tablet-home-hero-padding-x, 0);
  }

  body:is(.ql-page-type-home, .ql-page-type-homepage) main .banner.halfscreen > .content > .ql-hero h1 {
    font-size: var(--brochure-tablet-home-hero-title-size, clamp(4rem, 8.2vw, 5.6rem));
    text-wrap: balance;
  }

  body:is(.ql-page-type-home, .ql-page-type-homepage) main .banner.halfscreen > .content > .ql-hero .lead {
    max-width: var(--brochure-tablet-home-hero-lead-max, 34rem);
  }
}

@media screen and (max-width: 736px) {
  body.ql-brochure-nav-panel-open {
    overflow: hidden;
  }

  main {
    --surface-section-padding-x: var(--brochure-mobile-page-gutter, 0rem);
  }

  header[data-ql-brochure-shell="true"] {
    --surface-nav-row-gap: var(--brochure-mobile-nav-row-gap, var(--brochure-compact-nav-row-gap, 0.2rem));
    --surface-nav-column-gap: var(--brochure-mobile-nav-column-gap, var(--brochure-compact-nav-column-gap, 0.32rem));
    --surface-nav-link-size: var(--brochure-mobile-nav-link-size, 0.84rem);
    --surface-nav-link-padding-x: var(--brochure-mobile-nav-link-padding-x, 0.04rem);
    --surface-nav-link-padding-y: var(--brochure-mobile-nav-link-padding-y, 0.08rem);
    padding:
      var(--brochure-mobile-header-padding-y, 0.6rem)
      var(--brochure-mobile-header-padding-x, var(--size_padding-small));
    gap:
      var(--brochure-mobile-header-row-gap, 0.25rem)
      var(--brochure-mobile-header-column-gap, 0.42rem);
    align-items: center;
  }

  header[data-ql-brochure-shell="true"].ql-cta-has-special {
    /* Some sites currently set these to `none`/`0` via variables CSS; override so #special is usable on mobile. */
    --brochure-mobile-nav-special-display: block !important;
    --brochure-compact-nav-special-display: block !important;
    --nav-special-width: 124px !important;
    --nav-special-width: max(var(--brochure-mobile-nav-special-width, var(--brochure-compact-nav-special-width, 124px)), 124px) !important;
    --nav-special-height: 42px !important;
    --nav-special-height: max(var(--brochure-mobile-nav-special-height, var(--brochure-compact-nav-special-height, 42px)), 42px) !important;
    --special-button-font-size: var(--brochure-mobile-nav-special-font-size, clamp(1.08rem, 4.2vw, 1.28rem)) !important;
  }

  header[data-ql-brochure-shell="true"] > .logo {
    padding-inline: 0;
  }

  header[data-ql-brochure-shell="true"] > .logo svg,
  header[data-ql-brochure-shell="true"] > .logo img {
    max-width: var(--brochure-mobile-logo-max, 13rem);
    height: var(--brochure-mobile-logo-height, 3rem);
  }

  header[data-ql-brochure-shell="true"] > .menu .ql-menu-root,
  header[data-ql-brochure-shell="true"] > .sectionmenu .ql-menu-root,
  header[data-ql-brochure-shell="true"] > .altmenu .ql-menu-root {
    grid-template-columns:
      repeat(
        auto-fit,
        minmax(min(var(--brochure-mobile-nav-min-item-width, 7.35rem), 100%), 1fr)
      );
    gap: var(--surface-nav-row-gap) var(--surface-nav-column-gap);
  }

  header[data-ql-brochure-shell="true"] a {
    min-height: var(--brochure-mobile-nav-item-min-height, 2.05rem);
  }

  /* The brochure shell should degrade to a visible stacked panel on first paint.
     JS upgrades it into the collapsible hamburger shell by setting data-ql-brochure-nav-ready. */
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "logo"
      "panel"
      "tools"
      "section" !important;
    gap:
      var(--brochure-mobile-header-row-gap, 0.42rem)
      var(--brochure-mobile-header-column-gap, 0.55rem);
    align-items: start;
    justify-items: center;
    position: relative;
  }

  /* Beat the compact :has() variants above when JS upgrades the header.
     Otherwise their higher specificity leaves the menu in an implicit row
     after Search even though the mobile template names a panel row. */
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-header-cta-slot]:has(> .ql-header-tools) {
    grid-template-areas:
      "logo"
      "panel"
      "tools"
      "section" !important;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .logo {
    grid-area: logo;
    width: 100%;
    justify-self: stretch;
    display: flex;
    justify-content: center;
    text-align: center;
    margin-bottom: 0;
    padding-inline: var(
      --brochure-mobile-logo-row-padding-x,
      calc(var(--brochure-mobile-nav-toggle-size, 2.85rem) + var(--brochure-mobile-header-column-gap, 0.55rem))
    );
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"]:not([data-ql-brochure-nav-ready="true"]) > .logo {
    padding-inline: 0;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .logo > .logo {
    width: min(100%, var(--brochure-mobile-logo-width, clamp(10rem, 48vw, 13rem))) !important;
    max-width: 100% !important;
    min-width: 0;
    margin-inline: auto;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .logo > .logo svg,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .logo > .logo img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-brochure-nav-ready="true"] > .ql-brochure-nav-toggle {
    grid-area: auto;
    position: absolute;
    inset-inline-start: var(
      --brochure-mobile-nav-toggle-offset,
      var(--brochure-mobile-header-padding-x, var(--size_padding-small))
    );
    top: var(--brochure-mobile-nav-toggle-top, var(--brochure-mobile-header-padding-y, 0.6rem));
    left: var(
      --brochure-mobile-nav-toggle-offset,
      var(--brochure-mobile-header-padding-x, var(--size_padding-small))
    );
    right: auto;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: auto;
    align-self: auto;
    width: var(--brochure-mobile-nav-toggle-size, 2.85rem);
    height: var(--brochure-mobile-nav-toggle-size, 2.85rem);
    margin: 0;
    padding: 0;
    border: 1px solid var(--brochure-mobile-nav-toggle-border, rgba(34, 49, 39, 0.14));
    border-radius: 999px;
    background: var(--brochure-mobile-nav-toggle-bg, rgba(255, 250, 241, 0.94));
    box-shadow: var(--brochure-mobile-nav-toggle-shadow, 0 12px 30px rgba(32, 48, 39, 0.14));
    color: var(--brochure-mobile-nav-toggle-ink, var(--fg, #223127));
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .ql-brochure-nav-toggle:focus-visible {
    outline: 2px solid var(--brochure-mobile-nav-toggle-ring, rgba(200, 143, 75, 0.55));
    outline-offset: 2px;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .ql-brochure-nav-toggle-box {
    position: relative;
    width: 1.15rem;
    height: 0.9rem;
    display: block;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .ql-brochure-nav-toggle-box > span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transform-origin: center;
    transition:
      transform 0.18s ease,
      opacity 0.18s ease;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .ql-brochure-nav-toggle-box > span:nth-child(1) {
    top: 0;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .ql-brochure-nav-toggle-box > span:nth-child(2) {
    top: calc(50% - 1px);
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .ql-brochure-nav-toggle-box > span:nth-child(3) {
    bottom: 0;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"].ql-brochure-nav-open .ql-brochure-nav-toggle-box > span:nth-child(1) {
    transform: translateY(0.39rem) rotate(45deg);
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"].ql-brochure-nav-open .ql-brochure-nav-toggle-box > span:nth-child(2) {
    opacity: 0;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"].ql-brochure-nav-open .ql-brochure-nav-toggle-box > span:nth-child(3) {
    transform: translateY(-0.39rem) rotate(-45deg);
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .ql-header-tools {
    width: 100%;
    justify-self: stretch;
    min-width: 0;
    display: block;
    margin-top: var(--brochure-mobile-nav-panel-margin-top, 0.6rem);
    padding: var(--brochure-mobile-nav-panel-padding, 0.78rem);
    border: 1px solid var(--brochure-mobile-nav-panel-border, var(--brochure-surface-border, rgba(200, 143, 75, 0.16)));
    border-radius: var(--brochure-mobile-nav-panel-radius, 1.35rem);
    background: var(--brochure-mobile-nav-panel-bg, var(--brochure-surface, rgba(255, 250, 241, 0.94)));
    backdrop-filter: var(--brochure-mobile-nav-panel-backdrop, blur(16px) saturate(132%));
    box-shadow: var(--brochure-mobile-nav-panel-shadow, 0 24px 55px rgba(32, 48, 39, 0.16));
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu {
    grid-area: panel;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .ql-header-tools {
    grid-area: tools;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu {
    grid-area: section;
    margin-top: 0;
    padding:
      var(--brochure-mobile-section-panel-padding-y, 0.68rem)
      var(--brochure-mobile-section-panel-padding-x, 0.78rem);
    border-color: var(--brochure-mobile-section-panel-border, var(--brochure-mobile-nav-panel-border, rgba(200, 143, 75, 0.16)));
    box-shadow: var(--brochure-mobile-section-panel-shadow, 0 16px 38px rgba(32, 48, 39, 0.1));
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-brochure-nav-ready="true"] > .menu,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-brochure-nav-ready="true"] > .sectionmenu,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-brochure-nav-ready="true"] > .altmenu,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-brochure-nav-ready="true"] > .ql-header-tools {
    display: none;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu[hidden],
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu[hidden],
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu[hidden],
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .ql-header-tools[hidden] {
    display: none !important;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-brochure-nav-ready="true"].ql-brochure-nav-open > .menu:not([hidden]),
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-brochure-nav-ready="true"].ql-brochure-nav-open > .sectionmenu:not([hidden]),
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-brochure-nav-ready="true"].ql-brochure-nav-open > .altmenu:not([hidden]),
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"][data-ql-brochure-nav-ready="true"].ql-brochure-nav-open > .ql-header-tools:not([hidden]) {
    display: block;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"].ql-brochure-nav-open {
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu .ql-menu-root,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu .ql-menu-root,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu .ql-menu-root {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--brochure-mobile-nav-panel-row-gap, 0.3rem);
    margin: 0 !important;
    padding: 0;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu .ql-menu-root > li,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu .ql-menu-root > li,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu .ql-menu-root > li {
    width: 100%;
    min-width: 0;
    margin: 0;
    display: block;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .ql-menu-root > .ql-menu-item--has-children {
    grid-column: auto;
    align-items: stretch;
    min-width: 0;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a {
    width: 100%;
    min-height: 0;
    justify-content: flex-start;
    text-align: left;
    position: relative;
    padding:
      var(--brochure-mobile-nav-panel-link-padding-y, 0.86rem)
      var(--brochure-mobile-nav-panel-link-padding-x, 1rem);
    border-radius: var(--brochure-mobile-nav-panel-link-radius, 0.95rem);
    line-height: 1.16;
    font-size: var(--brochure-mobile-nav-panel-link-size, 0.94rem);
    letter-spacing: 0.01em;
    transition:
      background-color 0.18s ease,
      color 0.18s ease,
      box-shadow 0.18s ease;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a::after {
    display: none;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a.active,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a.ancestor,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a[aria-current="page"],
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a[aria-current="true"],
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a.active,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a.ancestor,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a[aria-current="page"],
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a[aria-current="true"],
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a.active,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a.ancestor,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a[aria-current="page"],
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a[aria-current="true"] {
    background: var(--brochure-mobile-nav-active-bg, rgba(200, 143, 75, 0.15));
    box-shadow:
      inset 0 0 0 1px var(--brochure-mobile-nav-active-border, rgba(200, 143, 75, 0.28)),
      0 10px 24px rgba(32, 48, 39, 0.08);
    color: var(--brochure-mobile-nav-active-ink, var(--accent, #8e6a2d));
    font-weight: 600;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a.active::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a.ancestor::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a[aria-current="page"]::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a[aria-current="true"]::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a.active::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a.ancestor::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a[aria-current="page"]::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .sectionmenu a[aria-current="true"]::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a.active::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a.ancestor::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a[aria-current="page"]::before,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a[aria-current="true"]::before {
    content: "";
    position: absolute;
    left: 0.55rem;
    top: 50%;
    width: 0.28rem;
    height: 1.2rem;
    border-radius: 999px;
    transform: translateY(-50%);
    background: var(--brochure-mobile-nav-active-marker, currentColor);
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .ql-menu-submenu {
    position: static;
    right: auto;
    left: auto;
    transform: none;
    display: flex;
    width: 100%;
    max-height: none;
    margin-top: 0.12rem !important;
    padding: 0 0 0 var(--brochure-mobile-nav-submenu-indent, 0.55rem);
    flex-direction: column;
    align-items: stretch;
    gap: var(--brochure-mobile-nav-panel-row-gap, 0.18rem);
    overflow: visible;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .menu ul > li:has(> a#special),
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .altmenu ul > li:has(> a#special),
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .ql-menu-root > .ql-menu-item--mobile-special {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-block: var(--brochure-mobile-nav-special-row-padding, 0.28rem 0.48rem);
    margin-top: var(--brochure-mobile-nav-special-row-margin-top, 0.08rem);
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a#special,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a#special {
    display: var(--brochure-mobile-nav-special-display, var(--brochure-compact-nav-special-display, block));
    width: min(100%, var(--nav-special-width));
    min-width: min(100%, var(--nav-special-width));
    height: var(--nav-special-height);
    min-height: var(--nav-special-height);
    max-width: 100%;
    margin-inline: auto;
    padding: 0;
    justify-self: auto;
    align-self: auto;
    top: auto;
    right: auto;
    flex: 0 0 auto;
    overflow: visible;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu a#special > span,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu a#special > span {
    padding: 0.36rem 0.42rem;
    letter-spacing: 0.08em;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu .ql-menu-root > li > a.button:not(#special),
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu .ql-menu-root > li > a.button:not(#special) {
    justify-content: center;
    text-align: center;
    margin-top: var(--brochure-mobile-nav-secondary-gap, 0.18rem);
    border-radius: var(--brochure-mobile-nav-secondary-radius, 1rem);
    box-shadow: inset 0 0 0 1px rgba(34, 49, 39, 0.14);
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu .ql-menu-root > li > a:not(#special),
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu .ql-menu-root > li > a.button:not(#special) {
    justify-content: center;
    text-align: center;
    background: var(--brochure-mobile-nav-secondary-bg, rgba(255, 255, 255, 0.7));
    box-shadow:
      inset 0 0 0 1px var(--brochure-mobile-nav-secondary-border, rgba(34, 49, 39, 0.14)),
      0 8px 20px rgba(32, 48, 39, 0.05);
    font-weight: 600;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > a#special {
    display: none !important;
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .menu ul > li:has(> a#special),
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .altmenu ul > li:has(> a#special),
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] .ql-menu-root > .ql-menu-item--mobile-special {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-block: var(--brochure-mobile-nav-special-row-padding, 0.28rem 0.48rem);
    margin-top: var(--brochure-mobile-nav-special-row-margin-top, 0.08rem);
  }

  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .menu .ql-menu-root > li > a#special,
  header[data-ql-brochure-shell="true"][data-ql-brochure-nav="true"] > .altmenu .ql-menu-root > li > a#special {
    display: var(--brochure-mobile-nav-special-display, var(--brochure-compact-nav-special-display, block)) !important;
    width: min(100%, var(--nav-special-width)) !important;
    min-width: min(100%, var(--nav-special-width)) !important;
    height: var(--nav-special-height) !important;
    min-height: var(--nav-special-height) !important;
    margin-inline: auto !important;
    padding: 0 !important;
    flex: 0 0 auto;
    overflow: visible;
  }
}
