/* Legacy header - restores the original pill-style navigation from the prior live
   margolispllc.com (white rounded bar, links left, logo centered, dark button right)
   on every page. Loaded after styles.css / proposal-chrome.css; overrides only header rules.
   Reference markup captured from the old site: reference/old-live-header.html */
.site-header{position:relative;z-index:50;background:#051f20;border-bottom:0;padding:24px 20px 0}
.site-header.site-header--overlay{position:absolute;top:0;left:0;right:0;background:transparent;padding-bottom:0}
.header-inner.wrap{max-width:1200px;height:auto;min-height:50px;margin:0 auto;padding:4px;gap:20px;background:#fff;border-radius:36px;display:flex;align-items:center;justify-content:center;position:relative}
.logo{display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo img{width:196px;height:auto;display:block}
.desktop-nav{position:absolute;left:2%;top:0;bottom:0;margin:0;display:flex;align-items:center;gap:22px}
.desktop-nav a{color:#2e7060;font-size:14px;font-weight:500;line-height:1.5;padding:0;white-space:nowrap}
.desktop-nav a::after{display:none}
.header-cta.button.primary-cta{position:absolute;top:4px;bottom:4px;right:4px;margin:0;min-height:0;display:flex;align-items:center;justify-content:center;background:#002d2a;border:0;border-radius:40px;padding:14px 32px;color:#fff;font-size:14px;font-weight:500;line-height:1.4;letter-spacing:1px}
.header-cta.button.primary-cta:hover{background:#0a3d3a}
.header-cta .arrow{display:none}
.menu-toggle{border:0;background:transparent}
/* Dark breadcrumb strip so the band above the hero stays seamless on practice/attorney pages */
main > .breadcrumbs:first-child{max-width:none;margin:0;padding-inline:var(--gutter);background:#051f20;color:#b2c7be}
main > .breadcrumbs:first-child a{color:#d2dedb}
main > .breadcrumbs:first-child .separator{color:#7f948b}
main > .breadcrumbs:first-child [aria-current=page]{color:#fff}
/* Between 992 and 1199px the five links no longer fit beside a dead-centred logo, so the logo centres between the nav and the button instead */
@media (max-width:1199px) and (min-width:992px){
  .header-inner.wrap{justify-content:flex-start;padding-right:190px}
  .desktop-nav{position:static;order:-1;gap:18px;padding-left:16px}
  .logo{margin:0 auto}
}
@media (max-width:991px){
  .desktop-nav{display:none}
  .menu-toggle{display:block;position:absolute;left:12px;top:50%;transform:translateY(-50%)}
  .header-cta.button.primary-cta{display:flex}
  .mobile-nav.is-open{display:flex;position:fixed;inset:82px 0 0;background:#fff;padding:1.5rem var(--gutter);flex-direction:column;overflow-y:auto}
  .mobile-nav a:not(.button){font-family:var(--serif);font-size:2rem;padding:.85rem 0;border-bottom:1px solid #dce2e0;line-height:1.3}
  .mobile-nav a:not(.button)[aria-current=page],.mobile-nav a:not(.button)[aria-current=location]{color:#2e7060}
  .mobile-nav .button{align-self:flex-start;margin-top:2rem}
  .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3px) rotate(45deg)}
  .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3px) rotate(-45deg)}
}
@media (max-width:767px){
  .header-inner.wrap{justify-content:space-between;padding:4px 12px 4px 4px}
  .header-cta.button.primary-cta{display:none}
  .menu-toggle{position:static;transform:none;order:2}
  .logo{order:1;padding-left:8px}
}
@media print{
  .site-header{display:none}
  main > .breadcrumbs:first-child{display:none}
}
