/* naset-series, s62-N-W1 (TODO 00019): the Elementor Theme Builder header (work/elementor/templates/header.json).
   Lays the Elementor containers and native widgets out exactly like today's header (templates/parts/site-header.php +
   assets/home/naset-chrome.css), so the page looks the same. Words, links, colours and the logo image are set in the
   Elementor panel; this file only carries the layout and the responsive sizes the panel cannot express. Hand-written.
   Element classes: nx-hdr-bar (Top banner container), nx-hdr-top (the sticky header), nx-hdr-wrap (its row),
   nx-hdr-logo, nx-hdr-actions, nx-hdr-login, nx-hdr-join, and the NASET Header Menu widget parts (nx-hdr-part). */

/* The location wrapper and every widget wrapper step aside, so the boxes are the same as today's markup: the bar and the
   sticky header are children of #page (the header sticks for the whole page), the logo link, the menu, the buttons are
   the flex items of the row. */
.elementor-location-header:has(.nx-hdr-top){display:contents}
.nx-hdr-bar .elementor-widget,.nx-hdr-bar .elementor-widget-container,
.nx-hdr-top .elementor-widget,.nx-hdr-top .elementor-widget-container,.nx-hdr-top .elementor-button-wrapper,
.nx-hdr-part.top.nh-c.nh-c.nh-c{display:contents}
.nx-hdr-part.top.nh-c.nh-c.nh-c{position:static;border:0;background:none}

/* Top banner (today: <div class="bar nh-c"><a>). Colour, words, link, font size: the Elementor panel. */
body .e-con.nx-hdr-bar{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;display:block;padding:8px 0;margin:0;text-align:center;min-height:0;border:0;gap:0}
body .nx-hdr-bar .elementor-heading-title{display:block;max-width:1340px;margin:0 auto;padding:0 40px;font-family:Helvetica,Arial,sans-serif;text-align:center}
body .nx-hdr-bar .elementor-heading-title a{display:block;color:inherit;text-decoration:none}
@media (max-width:767px){body .nx-hdr-bar .elementor-heading-title{padding:0 20px}}

/* The sticky header (today: <header class="top nh-c">). */
body .e-con.nx-hdr-top{--ink:#1D1D16;--olive:#414132;--blue:#93B3FF;--paper:#F7F6EF;--white:#FFFFFF;--line:#E4E2D8;
  --r2:clamp(8px,0.45rem + 0.38vw,12px);--r3:16px;--r4:clamp(16px,0.85rem + 0.76vw,24px);--r8:clamp(24px,1.04rem + 2.29vw,48px);
  --radius-s:12px;--max:1240px;
  display:block;position:sticky;top:0;z-index:10;margin:0;padding:0;min-height:0;gap:0;
  border-bottom:1px solid var(--line);color:var(--ink);-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;font-family:"Atkinson Hyperlegible",system-ui,sans-serif;font-size:18px;line-height:1.6;box-sizing:border-box}
@media (min-width:1700px){body .e-con.nx-hdr-top{--max:1520px}}
.admin-bar .e-con.nx-hdr-top{top:var(--wp-admin--admin-bar--height,32px)}
@media (max-width:600px){.admin-bar .e-con.nx-hdr-top{top:0}}
.nx-hdr-top *,.nx-hdr-top *::before,.nx-hdr-top *::after{box-sizing:border-box}

body .nx-hdr-top .e-con.nx-hdr-wrap{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:space-between;
  gap:var(--r4);min-height:84px;width:auto;min-width:auto;max-width:calc(var(--max) + 2*var(--r8));margin:0 auto;padding:0 var(--r8);position:static;border:0}
body .nx-hdr-top .e-con.nx-hdr-actions{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:12px;
  flex:0 1 auto;width:auto;min-width:auto;max-width:none;min-height:0;margin:0;padding:0;position:static;border:0}

/* Logo (Image widget, linked home). */
body .nx-hdr-top .nx-hdr-logo a{display:block;flex:none;line-height:0}
body .nx-hdr-top .nx-hdr-wrap .nx-hdr-logo img{display:block;width:150px;max-width:100%;height:auto;border:0;border-radius:0;box-shadow:none}

/* Member login (Button widget, styled as today's text link). */
body .nx-hdr-top .nx-hdr-actions .nx-hdr-login.elementor-widget .elementor-button{display:inline-flex;align-items:center;min-height:44px;padding:10px 4px;border:0;border-radius:var(--radius-s);
  font-family:inherit;font-size:15px;font-weight:700;line-height:1.6;white-space:nowrap;text-decoration:none;background:none;box-shadow:none}
body .nx-hdr-top .nx-hdr-actions .nx-hdr-login.elementor-widget .elementor-button:hover{text-decoration:underline;text-underline-offset:3px}
body .nx-hdr-top .nx-hdr-actions .nx-hdr-login.elementor-widget .elementor-button:focus-visible{outline:3px solid var(--blue);outline-offset:2px}

/* Join NASET (Button widget, today's .btn.btn-blue). */
body .nx-hdr-top .nx-hdr-actions .nx-hdr-join.elementor-widget .elementor-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;
  border:0;border-radius:var(--radius-s);font-family:inherit;font-size:16px;font-weight:700;line-height:1.2;text-align:center;white-space:nowrap;text-decoration:none;box-shadow:none}
body .nx-hdr-top .nx-hdr-actions .nx-hdr-join.elementor-widget .elementor-button:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.nx-hdr-top .elementor-button-content-wrapper{display:contents}
.nx-hdr-top .elementor-button-text{flex:none}

/* The Menu button sits in the actions row like today (.top-actions .btn). */
.nx-hdr-top .nx-hdr-drawer-part .menu-btn{white-space:nowrap}

/* Responsive, in today's order (naset-chrome.css). */
@media (max-width:1439px){body .nx-hdr-top .e-con.nx-hdr-wrap{gap:var(--r3)}
  .nx-hdr-top:has(.nav>li:nth-child(8)) .nx-hdr-drawer-part .menu-btn{display:inline-flex}}
@media (max-width:1279px){body .nx-hdr-top .nx-hdr-wrap .nx-hdr-logo img{width:120px}
  .nx-hdr-top .nx-hdr-drawer-part .menu-btn{display:inline-flex}}
@media (max-width:599px){body .nx-hdr-top .nx-hdr-wrap .nx-hdr-logo img{width:128px}
  body .nx-hdr-top .e-con.nx-hdr-wrap{min-height:68px}
  body .nx-hdr-top .nx-hdr-join,body .nx-hdr-top .nx-hdr-actions .nx-hdr-join.elementor-widget .elementor-button,
  body .nx-hdr-top .nx-hdr-login,body .nx-hdr-top .nx-hdr-actions .nx-hdr-login.elementor-widget .elementor-button{display:none}}
@media (min-width:1280px) and (max-width:1699px){body .nx-hdr-top .nx-hdr-wrap .nx-hdr-logo img{width:130px}
  body .nx-hdr-top .e-con.nx-hdr-actions{gap:8px}
  body .nx-hdr-top .nx-hdr-actions .nx-hdr-login.elementor-widget .elementor-button{font-size:14px;padding:10px 0}}
@media (min-width:1280px) and (max-width:1359px){body .nx-hdr-top .nx-hdr-wrap .nx-hdr-logo img{width:118px}
  body .nx-hdr-top .e-con.nx-hdr-wrap{gap:var(--r2)}}
@media (max-width:1023px){.nx-hdr-top .nx-hdr-drawer-part .menu-btn{display:inline-flex}}

/* Focus rings exactly as today (naset-chrome.css: .nh-c :focus-visible = 3px solid blue, offset 2px) on the native
   widgets too (banner link, logo link, buttons); the theme's own 1px dotted ring must not show here. */
body .nx-hdr-bar a:focus-visible,body .nx-hdr-top a:focus-visible,body .nx-hdr-top button:focus-visible{outline:3px solid #93B3FF !important;outline-offset:2px !important}
/* Today's header links and buttons have no transition (Elementor adds 0.2-0.3 s fades to links and buttons). */
body .nx-hdr-bar a,body .nx-hdr-top .nx-hdr-logo a,body .nx-hdr-top .elementor-button{transition:none}