/* Site header, desktop (1200px and up). Spec: docs/superpowers/specs/2026-09-10-header-menu-design.md
   Loads after mobile-header.css. Every desktop rule starts with #masthead so it beats the WordPress theme's
   header rules (header#masthead, .header-top, .custom-menu-class, .navbar-sticky …) whatever their order.
   Below 1200px mobile-header.css owns the header; outside the media query this sheet has only the wordmark
   swap, the .pd-bar flex row (the logo / Menu-toggle line) and the stuck-state strip rule.
   The container is 1140px wide with no side padding, matching the theme's Bootstrap .container, so the header
   aligns with the body content column. One spacing scale applies from 1200px up.
   Colour and type come from tokens.css; the only literals are #fff and rgba() overlays. */
#masthead .pd-logo-svg{display:none;}
/* Every width: the old markup relied on Bootstrap's .navbar row (display:flex, space-between) for the
   logo / Menu-toggle line; the rewrite dropped that wrapper, so the row lives here. mobile-header.css keeps
   its own padding on .header-bottom below 1200px. */
#masthead .pd-bar{display:flex;align-items:center;justify-content:space-between;}
/* Once the header is stuck the strip is gone at every width, so the bar is the whole fixed header: that is
   what header.js publishes as --header-height, and the strip's links leave the tab order. */
#masthead.navbar-sticky .header-top{display:none;}

@media (min-width:1200px){
  #masthead .pd-logo-img{display:none !important;}
  #masthead .pd-logo-svg{display:block;line-height:0;color:#fff;}
  #masthead .pd-logo-svg svg{height:48px;width:auto;display:block;}

  /* ---------- frame ---------- */
  #masthead.pd-header{padding:0;background:transparent;color:#fff;font-family:var(--pd-body);box-shadow:none;}
  #masthead.pd-header .container{max-width:1140px;padding:0;}

  /* ---------- utility strip ---------- */
  #masthead .header-top{max-width:none;margin:0;}
  #masthead .pd-strip{display:block;width:auto;vertical-align:baseline;}
  #masthead .pd-strip ul{display:flex;justify-content:flex-end;align-items:center;gap:26px;margin:0;padding:14px 0 0;list-style:none;}
  #masthead .pd-strip li{margin:0;padding:0;list-style:none;border:0;line-height:1;}
  #masthead .pd-strip li a{display:inline-flex;align-items:center;min-height:0;padding:0;margin:0;border:0;font:500 12.5px/1 var(--pd-label);letter-spacing:.04em;color:rgba(255,255,255,.82);text-decoration:none;}
  #masthead .pd-strip li a:hover,#masthead .pd-strip li a:focus{color:#fff;text-decoration:underline;}
  #masthead .pd-strip li.pd-strip-social a i{font-size:15px;color:inherit;margin:0;vertical-align:middle;}
  #masthead .pd-strip li.pd-strip-social+li.pd-strip-social{margin-left:-10px;}

  /* ---------- bar ---------- */
  #masthead .pd-bar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0 0;min-height:72px;}
  #masthead .pd-logo{flex:none;}
  #masthead .pd-logo a{display:block;color:inherit;line-height:0;}
  #masthead .right-content{display:none;}
  #masthead .pd-navwrap{display:flex;align-items:center;justify-content:flex-end;gap:20px;flex:1 1 auto;min-width:0;position:static;}
  #masthead .pd-nav{position:static;}
  #masthead .pd-nav-list{display:flex;align-items:center;gap:18px;margin:0;padding:0;list-style:none;}
  #masthead .pd-item{position:relative;display:flex;align-items:center;gap:0;margin:0;padding:0;list-style:none;}
  #masthead .pd-item--mega{position:static;}
  #masthead .pd-item-link{position:relative;display:inline-block;padding:8px 0;font:500 14.5px/1 var(--pd-label);letter-spacing:.02em;color:rgba(255,255,255,.92);text-decoration:none;white-space:nowrap;}
  #masthead .pd-item-link::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;opacity:0;transition:opacity .15s ease;}
  #masthead .pd-item.is-current .pd-item-link::after{opacity:.7;}
  #masthead .pd-item.is-open .pd-item-link::after,#masthead .pd-item-link:hover::after,#masthead .pd-item-link:focus::after{opacity:1;}
  #masthead .pd-item-link:hover,#masthead .pd-item-link:focus{color:#fff;text-decoration:none;}
  #masthead .pd-open{display:inline-flex;align-items:center;justify-content:center;width:20px;height:24px;margin:0;padding:0;border:0;border-radius:4px;background:transparent;color:rgba(255,255,255,.7);cursor:pointer;}
  #masthead .pd-open svg{width:14px;height:14px;transition:transform .15s ease;}
  #masthead .pd-open[aria-expanded="true"] svg{transform:rotate(180deg);}
  #masthead .pd-open:hover,#masthead .pd-open:focus{color:#fff;}

  /* ---------- panels ---------- */
  #masthead .pd-panel{position:absolute;top:calc(100% + 12px);z-index:1200;background:#fff;color:var(--pd-text);border:1px solid var(--pd-hair);border-radius:6px;box-shadow:0 30px 60px -30px rgba(17,26,58,.55);font-family:var(--pd-body);text-align:left;}
  #masthead .pd-panel[hidden]{display:none;}
  #masthead .pd-panel ul{list-style:none;margin:0;padding:0;}
  #masthead .pd-panel li{position:relative;list-style:none;margin:0;padding:0;}
  #masthead .pd-panel a{font-family:var(--pd-body);}
  #masthead .pd-panel--compact{left:0;width:250px;padding:10px 0;}
  #masthead .pd-panel--compact a{display:block;padding:10px 20px 10px 30px;font:400 15px/1.3 var(--pd-body);color:var(--pd-muted);text-decoration:none;}
  #masthead .pd-panel li.is-current a{color:var(--pd-ink);font-weight:700;}
  #masthead .pd-panel li.is-current::before{content:"";position:absolute;left:16px;top:1.05em;width:6px;height:6px;border-radius:50%;background:var(--pd-navy);}
  #masthead .pd-panel a:hover,#masthead .pd-panel a:focus{color:var(--pd-ink);text-decoration:none;}
  #masthead .pd-panel--mega{left:0;right:0;display:grid;grid-template-columns:1fr 1fr 1fr 300px;}
  #masthead .pd-panel--mega[hidden]{display:none;}
  #masthead .pd-panel-col{padding:30px 34px;}
  #masthead .pd-panel-col+.pd-panel-col{border-left:1px solid var(--pd-hair);}
  #masthead .pd-panel-col h3{font:400 20px/1.2 var(--pd-display);color:var(--pd-ink);margin:0 0 14px;padding:0;}
  #masthead .pd-panel-col h3 a{display:inline;padding:0;font:inherit;color:inherit;text-decoration:none;}
  #masthead .pd-panel-col h3 a:hover,#masthead .pd-panel-col h3 a:focus{text-decoration:underline;color:var(--pd-ink);}
  #masthead .pd-panel-col li a{display:block;padding:6px 0 6px 16px;font:400 15px/1.35 var(--pd-body);color:var(--pd-muted);text-decoration:none;}
  #masthead .pd-panel-col li.is-current::before{left:0;top:.95em;}
  #masthead .pd-panel-col li.pd-panel-all{margin-top:10px;}
  #masthead .pd-panel-col li.pd-panel-all a{padding-left:0;color:var(--pd-navy);font-weight:700;text-decoration:underline;text-decoration-color:rgba(18,58,114,.35);text-underline-offset:3px;}
  #masthead .pd-panel-col li.pd-panel-all a:hover,#masthead .pd-panel-col li.pd-panel-all a:focus{color:var(--pd-navy);text-decoration:underline;}
  #masthead .pd-panel-feat{background:var(--pd-paper);border-radius:0 6px 6px 0;padding:30px;}
  #masthead .pd-panel-feat .pd-eb{display:block;font:600 11.5px/1 var(--pd-label);letter-spacing:.16em;text-transform:uppercase;color:var(--pd-muted);margin:0 0 10px;}
  #masthead .pd-panel-phone{display:block;margin:0 0 8px;padding:0;font:700 22px/1.2 var(--pd-body);color:var(--pd-navy);text-decoration:none;font-variant-numeric:tabular-nums;}
  #masthead .pd-panel-phone:hover,#masthead .pd-panel-phone:focus{color:var(--pd-blue-deep);text-decoration:none;}
  #masthead .pd-panel-feat p{margin:0;font:400 14.5px/1.5 var(--pd-body);color:var(--pd-muted);letter-spacing:0;}
  #masthead .pd-panel-feat p a{display:inline;padding:0;color:var(--pd-navy);font-weight:700;text-decoration:underline;text-decoration-color:rgba(18,58,114,.35);text-underline-offset:3px;}
  #masthead .pd-panel-feat p a:hover,#masthead .pd-panel-feat p a:focus{color:var(--pd-navy);text-decoration:underline;}
  #masthead .pd-panel-sep{height:1px;background:var(--pd-hair);margin:22px 0;}
  #masthead .pd-panel-feat p.pd-panel-price{font:400 24px/1.2 var(--pd-display);color:var(--pd-ink);margin:0 0 6px;}
  #masthead .pd-panel-book{display:inline-block;margin-top:12px;padding:0;font:700 15px/1 var(--pd-body);color:var(--pd-navy);text-decoration:underline;text-decoration-color:rgba(18,58,114,.35);text-underline-offset:3px;}
  #masthead .pd-panel-book:hover,#masthead .pd-panel-book:focus{color:var(--pd-navy);text-decoration:underline;}

  /* ---------- actions ---------- */
  #masthead .pd-actions{display:flex;align-items:center;gap:10px;flex:none;}
  #masthead .pd-tel{display:none;margin:0;padding:0;font:700 14px/1 var(--pd-body);color:var(--pd-navy);text-decoration:none;font-variant-numeric:tabular-nums;}
  #masthead .pd-tel:hover,#masthead .pd-tel:focus{color:var(--pd-blue-deep);text-decoration:none;}
  #masthead .pd-book{display:inline-block;padding:12px 16px;border-radius:4px;font:600 14.5px/1 var(--pd-label);letter-spacing:.02em;background:var(--pd-blue);color:#fff;text-decoration:none;white-space:nowrap;transition:background-color .15s ease;}
  #masthead .pd-book:hover,#masthead .pd-book:focus{background:var(--pd-blue-deep);color:#fff;text-decoration:none;}
  #masthead .pd-cherry{display:block;padding:0;line-height:0;}
  #masthead .pd-cherry img{height:34px;width:auto;display:block;border-radius:4px;}

  /* ---------- solid states: scrolled (navbar-sticky, toggled by header.js) and header_solid ---------- */
  #page #masthead.pd-header.navbar-sticky{position:fixed;top:0;left:0;right:0;background:#fff;box-shadow:none;border-bottom:1px solid var(--pd-hair);transition:background-color .2s ease;}
  #masthead.pd-header.is-solid{background:#fff;border-bottom:1px solid var(--pd-hair);}
  #masthead.pd-header.is-solid .header-top{display:none;}
  #masthead.pd-header.navbar-sticky .pd-bar,#masthead.pd-header.is-solid .pd-bar{padding:0;height:72px;min-height:72px;}
  #masthead.pd-header.navbar-sticky .pd-logo-svg,#masthead.pd-header.is-solid .pd-logo-svg{color:var(--pd-ink);}
  #masthead.pd-header.navbar-sticky .pd-logo-svg svg,#masthead.pd-header.is-solid .pd-logo-svg svg{height:42px;}
  #masthead.pd-header.navbar-sticky .pd-item-link,#masthead.pd-header.is-solid .pd-item-link{color:var(--pd-ink);}
  #masthead.pd-header.navbar-sticky .pd-item-link:hover,#masthead.pd-header.navbar-sticky .pd-item-link:focus,#masthead.pd-header.is-solid .pd-item-link:hover,#masthead.pd-header.is-solid .pd-item-link:focus{color:var(--pd-ink);}
  #masthead.pd-header.navbar-sticky .pd-open,#masthead.pd-header.is-solid .pd-open{color:var(--pd-muted);}
  #masthead.pd-header.navbar-sticky .pd-open:hover,#masthead.pd-header.navbar-sticky .pd-open:focus,#masthead.pd-header.is-solid .pd-open:hover,#masthead.pd-header.is-solid .pd-open:focus{color:var(--pd-ink);}
  #masthead.pd-header.navbar-sticky .pd-tel,#masthead.pd-header.is-solid .pd-tel{display:inline-block;}

  /* ---------- focus ---------- */
  #masthead .pd-strip a:focus-visible,#masthead .pd-logo a:focus-visible,#masthead .pd-item-link:focus-visible,#masthead .pd-open:focus-visible,#masthead .pd-book:focus-visible,#masthead .pd-cherry:focus-visible{outline:2px solid #fff;outline-offset:2px;}
  #masthead.pd-header.navbar-sticky .pd-logo a:focus-visible,#masthead.pd-header.navbar-sticky .pd-item-link:focus-visible,#masthead.pd-header.navbar-sticky .pd-open:focus-visible,#masthead.pd-header.navbar-sticky .pd-tel:focus-visible,#masthead.pd-header.navbar-sticky .pd-book:focus-visible,#masthead.pd-header.navbar-sticky .pd-cherry:focus-visible,#masthead.pd-header.is-solid .pd-logo a:focus-visible,#masthead.pd-header.is-solid .pd-item-link:focus-visible,#masthead.pd-header.is-solid .pd-open:focus-visible,#masthead.pd-header.is-solid .pd-tel:focus-visible,#masthead.pd-header.is-solid .pd-book:focus-visible,#masthead.pd-header.is-solid .pd-cherry:focus-visible,#masthead .pd-panel a:focus-visible{outline:2px solid var(--pd-navy);outline-offset:2px;}
}

@media (prefers-reduced-motion:reduce){
  #masthead .pd-open svg,#masthead .pd-item-link::after,#masthead .pd-book,#page #masthead.pd-header.navbar-sticky{transition:none;}
}
