/* ContentWorks header, WordPress half of the site (7 Oct 2026).
   The Worker swaps the old JetMenu/Elementor header for the static-site header markup
   (partials/header.js) and loads this file BEFORE cw-wiring.css. The static pages get the
   same rules from cw-design-system.css; those are global (they restyle body, a, button),
   so they cannot be loaded on WordPress. Everything here is scoped under .cw-wp-hdr and
   re-declares only what the header needs, plus resets against the WP theme's button/link
   rules. Dropdown, phone and mobile-menu rules come from cw-wiring.css, unchanged. */

.cw-wp-hdr{--teal:#00BCD4;--orange:#f1770a;--dark:#082729;--peach:#ffc693;--maxw:1180px;
  font-family:'Inter',sans-serif;line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
.cw-wp-hdr *,.cw-wp-hdr *::before,.cw-wp-hdr *::after{box-sizing:border-box}
.cw-wp-hdr a{color:inherit;text-decoration:none;background:none;box-shadow:none}
.cw-wp-hdr ul{margin:0;padding:0;list-style:none}
.cw-wp-hdr button{font-family:inherit;text-transform:none;letter-spacing:normal;box-shadow:none;border-radius:0;margin:0}

/* The bar. On WordPress it is always solid: the static site's transparent-until-scrolled
   look needs a dark hero under it, and most blog pages have a white one. */
.cw-wp-hdr header{position:fixed;top:0;left:0;right:0;z-index:9990;margin:0;padding:0;background:rgba(8,39,41,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.1)}
.cw-wp-hdr .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.cw-wp-hdr .nav{display:flex;align-items:center;justify-content:space-between;height:74px}
.cw-wp-hdr .logo{display:flex;align-items:center}
.cw-wp-hdr .logo img{height:38px;width:auto;max-width:none;display:block}
.cw-wp-hdr .navlinks{display:flex;gap:30px;align-items:center;font-family:'Inter Tight',sans-serif;font-weight:600;font-size:.96rem}
.cw-wp-hdr .navlinks a{color:#fff;opacity:.85}
.cw-wp-hdr .navlinks a:hover{opacity:1;color:var(--teal)}
.cw-wp-hdr .navlinks a.active{opacity:1;color:var(--teal)}
.cw-wp-hdr .nav-cta{display:flex;gap:12px;align-items:center}
.cw-wp-hdr .btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.5rem;font-family:'Inter Tight',sans-serif;font-weight:700;font-size:1.02rem;line-height:1.6;padding:16px 28px;border-radius:999px;border:0;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.cw-wp-hdr .btn-primary{background:linear-gradient(135deg,#ff9036,#f1770a 55%,#df6907);color:var(--dark)!important;opacity:1!important;box-shadow:0 12px 30px -10px rgba(241,119,10,.6),inset 0 1px 0 rgba(255,255,255,.5)}
.cw-wp-hdr .btn-primary:hover{transform:translateY(-2px)}
.cw-wp-hdr .navtoggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;background:none;border:0;padding:8px;cursor:pointer;min-width:44px;min-height:44px}
.cw-wp-hdr .navtoggle span{display:block;width:24px;height:2px;background:#fff;border-radius:2px;transition:.25s}
.cw-wp-hdr .navtoggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.cw-wp-hdr .navtoggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.cw-wp-hdr .navtoggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.cw-wp-hdr a:focus-visible,.cw-wp-hdr button:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:6px}
.cw-wp-hdr .skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--orange);color:var(--dark);font-family:'Inter Tight',sans-serif;font-weight:700;padding:12px 18px;border-radius:0 0 8px 0}
.cw-wp-hdr .skip:focus{left:0}
/* WP theme button resets for the dropdown buttons (cw-wiring.css styles them) */
.cw-wp-hdr .navlinks .dd-btn{background:none;border:0;padding:0;border-radius:0;text-transform:none;font-weight:inherit;font-size:inherit;line-height:inherit}

.cw-wp-hdr .nav-phone{color:#fff}
.cw-wp-hdr .nav-phone:hover{color:var(--teal)}
.cw-wp-hdr .navlinks a.navlinks-phone{color:var(--peach);opacity:1}

/* Post heroes on phones (cw-article.css) were written for a fixed bar that overlays the
   top of the page with no flow spacer, and pad themselves to clear a 64px bar. The shared
   bar is 74px, so: no spacer on single posts at phone width, and the card hero's top
   padding grows from 64px to 74px so the gradient still starts exactly under the bar. */
@media(max-width:768px){
  body.single-post .cw-hdr-spacer{height:0!important}
  body.single-post.cw-card-hero .gb-container-8b6d1c4b{padding-top:74px!important}
}
@media(max-width:1080px){
  .cw-wp-hdr .navlinks{display:none}
  .cw-wp-hdr .navtoggle{display:inline-flex}
  .cw-wp-hdr .nav-cta .btn-primary{white-space:nowrap;padding:12px 16px!important;min-height:44px;font-size:.84rem!important}
  .cw-wp-hdr .navlinks.open a{min-height:44px;display:flex;align-items:center;width:100%}
}
@media(max-width:420px){.cw-wp-hdr .logo img{height:32px}.cw-wp-hdr .nav-cta{gap:8px}.cw-wp-hdr .nav-cta .btn-primary{padding:10px 12px!important;font-size:.8rem!important}}

/* Retire everything the old header left behind: JetMenu's phone slide-out (UA-detected,
   Vue-mounted), its cover, and GeneratePress's own slide-out menu. Our hamburger is the
   only menu. */
.jet-mobile-menu,.jet-mobile-menu-cover,.jet-mobile-menu-widget,.jet-mega-menu,
#generate-slideout-menu,.slideout-overlay,.slideout-navigation,#mobile-header{display:none!important}

/* Open phone menu: solid, so page text does not ghost through it. */
@media(max-width:1080px){.cw-wp-hdr .navlinks.open{background:#082729}}
