/* Maddrell Design nav: "Claim ticket". Shared by site/index.html, the three service pages, the portal and the privacy page.
   The bar is a counter strip: each link a captioned field, the Free sample a volt tear-off stub behind a punched perforation; Services drops a till receipt with a torn edge, and the phone menu unrolls the same receipt.
   Needs the page tokens (--paper --ink --fog --volt --graphite --white --f-mono --f-display --f-body); --max, --r-pill, --muted, --elev-bar and --receipt-shadow have fallbacks. The bar is 68px + a 2px rule = 70px: the homepage --hero-nav depends on it. */
.navx-c,.navx-c *,.navx-c *::before,.navx-c *::after{box-sizing:border-box}
.navx-c{--nx-h:68px;--nx-gl:max(16px, env(safe-area-inset-left, 0px));--nx-gr:max(16px, env(safe-area-inset-right, 0px));--nx-tear:9px;position:sticky;top:env(safe-area-inset-top, 0px);z-index:50;background:var(--paper);color:var(--ink);border-bottom:2px solid var(--ink);box-shadow:var(--elev-bar,0 10px 14px -12px rgba(14,14,14,.4));font-family:var(--f-body);font-size:16px;line-height:1.2}
@media (min-width:900px){.navx-c{--nx-gl:max(40px, env(safe-area-inset-left, 0px));--nx-gr:max(40px, env(safe-area-inset-right, 0px))}}
.navx-c a{color:inherit;text-decoration:none}
.navx-c button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer}
.navx-c svg{display:block}
.navx-c :focus-visible{outline:3px solid var(--ink);outline-offset:-6px}
.navx-c .nx-bar{display:flex;align-items:stretch;height:var(--nx-h)}

.navx-c .nx-logo{display:flex;align-items:center;flex:1 1 auto;min-width:0;min-height:44px;padding-left:max(var(--nx-gl), calc((100% - var(--max,1560px)) / 2));padding-right:16px;transition:color .15s}
.navx-c .nx-logo .brand-logo{display:block;line-height:0;max-width:100%}
.navx-c .nx-logo svg{height:40px;width:auto;max-width:100%}
.navx-c .nx-logo:hover{color:var(--graphite)}
@media (min-width:1120px){.navx-c .nx-logo{flex:0 0 auto;padding-right:clamp(24px,2.6vw,44px)}.navx-c .nx-logo svg{height:46px}}
@media (min-width:1200px){.navx-c .nx-logo svg{height:50px}}
/* Logo (Split print): a touch larger on phones; the bar stays 68px + 2px rule. */
@media (max-width:599px){.navx-c .nx-logo svg{height:44px}}


/* ticket fields */
.navx-c .nx-links{display:none}
@media (min-width:1120px){.navx-c .nx-links{display:flex;align-items:stretch}}
.navx-c .nx-link{display:flex;flex-direction:column;justify-content:center;gap:7px;padding:0 clamp(18px,2.2vw,34px);border-left:2px dashed var(--ink);white-space:nowrap;transition:background-color .15s,color .15s}
.navx-c .nx-cap{font-family:var(--f-mono);font-weight:500;font-size:10.5px;line-height:1;letter-spacing:.1em;text-transform:uppercase;color:var(--muted,#555);transition:color .15s}
.navx-c .nx-lab{display:block;font-family:var(--f-display);font-size:1.5rem;line-height:1;text-transform:uppercase}
.navx-c .nx-lab em{font-style:normal;display:inline-block;padding:.04em .1em 0;margin:0 -.1em;border-radius:5px;transition:background-color .15s,color .15s}
.navx-c .nx-link:hover{background:var(--fog)}
.navx-c .nx-link:hover .nx-cap{color:var(--ink)}
.navx-c .nx-link:active{background:var(--ink);color:var(--white)}
.navx-c .nx-link:active .nx-cap{color:var(--white)}
/* the section you are in: the label gets the volt highlighter block and the caption is stamped */
.navx-c .nx-link[aria-current] .nx-lab em{background:var(--volt)}
.navx-c .nx-link[aria-current] .nx-cap{color:var(--ink)}
.navx-c .nx-link[aria-current] .nx-cap::after{content:" \00B7  Here"}
.navx-c .nx-link[aria-current]:active .nx-lab em{color:var(--ink)}

.navx-c .nx-drop{position:relative;display:flex;align-items:stretch;transition:background-color .15s,color .15s}
.navx-c .nx-drop .nx-link,.navx-c .nx-drop .nx-link:hover,.navx-c .nx-drop .nx-link:active{background:transparent;color:inherit;padding-right:6px}
.navx-c .nx-drop .nx-link:hover .nx-cap{color:var(--ink)}
.navx-c .nx-dd-btn{display:grid;place-items:center;width:44px;flex:none;align-self:stretch}
.navx-c .nx-dd-btn svg{width:15px;height:15px;transition:transform var(--t-base,.18s) var(--ease,ease)}
.navx-c .nx-dd-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.navx-c .nx-drop:is(:hover,.is-open){background:var(--fog)}
.navx-c .nx-drop:has(.nx-link:active,.nx-dd-btn:active){background:var(--ink);color:var(--white)}
.navx-c .nx-drop:has(.nx-link:active,.nx-dd-btn:active) .nx-cap{color:var(--white)}
.navx-c .nx-dd-btn:focus-visible{outline-offset:-6px}

.navx-c .nx-fill{display:none}
@media (min-width:1120px){
  .navx-c .nx-fill{display:block;flex:1 1 0;min-width:0;position:relative;border-left:2px dashed var(--ink);margin-left:0}
  .navx-c .nx-fill::before{content:"";position:absolute;left:clamp(16px,2vw,32px);right:clamp(16px,2vw,32px);top:50%;border-bottom:2px dotted var(--graphite)}
}
.navx-c .nx-login{display:none}
@media (min-width:1120px){
  .navx-c .nx-login{display:flex;align-items:center;flex:none;padding:0 clamp(18px,2vw,30px);border-left:2px dashed var(--ink);font-family:var(--f-mono);font-weight:500;font-size:13px;line-height:1;letter-spacing:.06em;text-transform:uppercase;text-decoration:underline !important;text-decoration-thickness:2px !important;text-underline-offset:6px;color:var(--graphite);transition:background-color .15s,color .15s}
  .navx-c .nx-login:hover{background:var(--fog);color:var(--ink)}
  .navx-c .nx-login:active{background:var(--ink);color:var(--white)}
}

/* the tear-off stub: volt, behind a dashed perforation punched top and bottom */
.navx-c .nx-stub{position:relative;display:flex;flex-direction:column;justify-content:center;gap:5px;flex:none;padding:0 16px 0 20px;background:var(--volt);color:var(--ink);border-left:2px dashed var(--ink);white-space:nowrap;transition:background-color .15s,color .15s}
.navx-c .nx-stub::before,.navx-c .nx-stub::after{content:"";position:absolute;left:-9px;width:16px;height:8px;background:#A9A9A2;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 30%,transparent);pointer-events:none}
.navx-c .nx-stub::before{top:-2px;border-radius:0 0 8px 8px}
.navx-c .nx-stub::after{bottom:-2px;border-radius:8px 8px 0 0}
.navx-c .nx-stub-k{display:none;font-family:var(--f-mono);font-weight:400;font-size:10px;line-height:1;letter-spacing:.1em;text-transform:uppercase}
.navx-c .nx-stub-t{font-family:var(--f-display);font-size:1.45rem;line-height:1;text-transform:uppercase}
.navx-c .nx-stub-s{display:none;font-family:var(--f-mono);font-weight:500;font-size:10.5px;line-height:1;letter-spacing:.06em;text-transform:uppercase}
.navx-c .nx-go{position:absolute;right:14px;top:50%;margin-top:-15px;display:none;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--volt);transition:background-color .15s,color .15s}
.navx-c .nx-go svg{width:13px;height:13px}
.navx-c .nx-stub:hover{background:var(--ink);color:var(--volt)}
.navx-c .nx-stub:hover .nx-go{background:var(--volt);color:var(--ink)}
.navx-c .nx-stub:active{background:var(--graphite);color:var(--white)}
.navx-c .nx-stub:focus-visible{outline-color:var(--ink);outline-offset:-8px}
.navx-c .nx-stub:hover:focus-visible{outline-color:var(--volt)}
@media (min-width:1120px){
  .navx-c .nx-stub{padding-left:clamp(26px,2.2vw,36px);padding-right:calc(max(clamp(24px,2vw,34px), calc((100% - var(--max,1560px)) / 2)) + 44px)}
  .navx-c .nx-stub-k,.navx-c .nx-stub-s{display:block}
  .navx-c .nx-go{display:grid;right:max(clamp(24px,2vw,34px), calc((100% - var(--max,1560px)) / 2))}
}
@media (max-width:1119px){
  .navx-c .nx-stub{padding:0 14px 0 20px}
  .navx-c .nx-stub-t{font-size:1.25rem}
}
@media (max-width:379px){.navx-c .nx-stub{padding:0 10px 0 16px}.navx-c .nx-stub-t{font-size:1.1rem}}

/* menu cell */
.navx-c .nx-menu{position:relative;display:grid;place-items:center;flex:none;width:var(--nx-h);border-left:2px dashed var(--ink);background:var(--paper);transition:background-color .15s,color .15s}
.navx-c .nx-menu svg{width:22px;height:22px}
.navx-c .nx-menu .i-close{display:none}
.navx-c .nx-menu:hover{background:var(--fog)}
.navx-c .nx-menu:active{background:var(--graphite);color:var(--white)}
.navx-c .nx-menu[aria-expanded="true"]{background:var(--ink);color:var(--volt)}
.navx-c .nx-menu[aria-expanded="true"] .i-open{display:none}
.navx-c .nx-menu[aria-expanded="true"] .i-close{display:block}
.navx-c .nx-menu[aria-expanded="true"]:focus-visible{outline-color:var(--volt)}
@media (max-width:599px){.navx-c .nx-menu{width:56px}}
@media (min-width:1120px){.navx-c .nx-menu,.navx-c .nx-sheet{display:none !important}}

/* services: a till receipt hangs from the bar */
.navx-c .nx-dd{position:absolute;top:calc(100% + 2px);left:-24px;width:460px;z-index:60;filter:var(--receipt-shadow,drop-shadow(0 1px 1px rgba(14,14,14,.16)) drop-shadow(0 12px 12px rgba(14,14,14,.13)) drop-shadow(0 28px 26px rgba(14,14,14,.10)));opacity:0;translate:0 -4px;transition:opacity .1s var(--ease,ease),translate .1s var(--ease,ease)}
.navx-c .nx-dd[hidden]{display:none}
.navx-c .nx-dd.is-in{opacity:1;translate:0 0;transition-duration:.16s}
.navx-c .nx-dd:not(.is-in){pointer-events:none}
.navx-c .nx-paper{position:relative;background:var(--white);color:var(--ink);border-top:2px solid var(--ink);padding:8px 0 calc(var(--nx-tear) + 12px);-webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(var(--nx-tear) * 2) var(--nx-tear) repeat-x,linear-gradient(#000 0 0) top/100% calc(100% - var(--nx-tear)) no-repeat;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(var(--nx-tear) * 2) var(--nx-tear) repeat-x,linear-gradient(#000 0 0) top/100% calc(100% - var(--nx-tear)) no-repeat}
.navx-c .nx-rh{display:flex;justify-content:space-between;gap:12px;padding:12px 24px 12px;border-bottom:2px dashed var(--ink);font-family:var(--f-mono);font-weight:500;font-size:11px;line-height:1;letter-spacing:.1em;text-transform:uppercase}
.navx-c .nx-rrow{display:grid;grid-template-columns:auto 1fr auto;column-gap:10px;align-items:baseline;padding:14px 24px 14px;border-bottom:2px dotted var(--edge-strong,rgba(14,14,14,.35));transition:background-color .15s,color .15s}
.navx-c .nx-rt{font-family:var(--f-display);font-size:1.45rem;line-height:1;text-transform:uppercase}
.navx-c .nx-ld{align-self:end;height:0;margin-bottom:.35em;border-bottom:2px dotted var(--graphite)}
.navx-c .nx-rp{font-family:var(--f-mono);font-weight:500;font-size:11.5px;line-height:1;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.navx-c .nx-rp b{font-family:var(--f-display);font-weight:400;font-size:1.3rem;letter-spacing:0;background:var(--volt);color:var(--ink);padding:.02em .16em 0;border-radius:5px;margin:0 .1em;transition:background-color .15s,color .15s}
.navx-c .nx-rd{grid-column:1 / -1;margin-top:6px;font-size:14px;line-height:1.3;color:var(--muted,#555)}
.navx-c .nx-rrow:hover{background:var(--volt)}
.navx-c .nx-rrow:hover .nx-rd{color:var(--ink)}
.navx-c .nx-rrow:hover .nx-rp b{background:var(--ink);color:var(--volt)}
.navx-c .nx-rrow:active{background:var(--ink);color:var(--white)}
.navx-c .nx-rrow:active .nx-rd{color:var(--white)}
.navx-c .nx-rrow:focus-visible{outline-offset:-6px}
.navx-c .nx-rall{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:0 24px;font-family:var(--f-mono);font-weight:500;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;transition:background-color .15s,color .15s}
.navx-c .nx-rall svg{width:14px;height:14px}
.navx-c .nx-rall:hover{background:var(--volt)}
.navx-c .nx-rall:active{background:var(--ink);color:var(--white)}
.navx-c .nx-rall:focus-visible{outline-offset:-6px}
.navx-c .nx-bars{display:block;height:22px;margin:8px 24px 0;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 5px,var(--ink) 5px 6px,transparent 6px 10px,var(--ink) 10px 13px,transparent 13px 16px);opacity:.85}

/* phone menu: the receipt unrolls under the bar, a tear-off stub at its foot */
.navx-c .nx-sheet{position:fixed;left:0;right:0;top:calc(env(safe-area-inset-top, 0px) + var(--nx-h) + 2px);z-index:60;max-height:calc(100svh - var(--nx-h) - env(safe-area-inset-top, 0px) - 16px);display:flex;flex-direction:column;filter:var(--receipt-shadow,drop-shadow(0 1px 1px rgba(14,14,14,.16)) drop-shadow(0 12px 12px rgba(14,14,14,.13)) drop-shadow(0 28px 26px rgba(14,14,14,.10)));opacity:0;translate:0 -16px;clip-path:inset(0 -48px 100% -48px);transition:opacity var(--t-slow,.24s) var(--ease,ease),translate var(--t-slow,.24s) var(--ease,ease),clip-path var(--t-slow,.24s) var(--ease,ease)}
.navx-c .nx-sheet.is-in{opacity:1;translate:0 0;clip-path:inset(0 -48px -64px -48px)}
.navx-c .nx-sheet .nx-paper{overflow-y:auto;overscroll-behavior:contain;border-top:0;padding:0 0 calc(var(--nx-tear) + 6px)}
.navx-c .nx-rows{display:flex;flex-direction:column}
.navx-c .nx-row{display:flex;align-items:center;gap:14px;min-height:76px;padding:0 var(--nx-gr) 0 var(--nx-gl);border-bottom:2px dotted rgba(14,14,14,.4);transition:background-color .15s,color .15s}
.navx-c .nx-n{font-family:var(--f-mono);font-weight:500;font-size:11px;line-height:1;letter-spacing:.08em;border:2px solid currentColor;border-radius:var(--r-pill,999px);padding:.42em .7em}
.navx-c .nx-rl{font-family:var(--f-display);font-size:clamp(2.3rem,11vw,3.6rem);line-height:.92;text-transform:uppercase}
.navx-c .nx-row:hover{background:var(--volt)}
.navx-c .nx-row:active{background:var(--ink);color:var(--white)}
.navx-c .nx-row[aria-current]{background:var(--fog);box-shadow:inset 8px 0 0 var(--volt),inset 10px 0 0 var(--ink)}
.navx-c .nx-row[aria-current]:hover{background:var(--volt)}
.navx-c .nx-sub{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:10px;min-height:56px;padding:10px var(--nx-gr) 10px calc(var(--nx-gl) + 20px);border-bottom:2px dotted rgba(14,14,14,.4);transition:background-color .15s,color .15s}
.navx-c .nx-sub .nx-rt{font-family:var(--f-mono);font-weight:500;font-size:13.5px;letter-spacing:.04em;line-height:1.2}
.navx-c .nx-sub .nx-ld{margin-bottom:.3em}
.navx-c .nx-sub .nx-rp{font-size:12px}
.navx-c .nx-sub .nx-rp span{font-size:1em}
.navx-c .nx-sub:hover{background:var(--volt)}
.navx-c .nx-sub:active{background:var(--ink);color:var(--white)}
.navx-c .nx-sheet-stub{position:relative;display:flex;flex-direction:column;gap:6px;margin:14px 0 0;padding:20px calc(var(--nx-gr) + 46px) 20px var(--nx-gl);background:var(--volt);color:var(--ink);border-top:2px dashed var(--ink);transition:background-color .15s,color .15s}
.navx-c .nx-sheet-stub::before,.navx-c .nx-sheet-stub::after{content:"";position:absolute;top:-10px;width:8px;height:16px;background:var(--white);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 30%,transparent);pointer-events:none}
.navx-c .nx-sheet-stub::before{left:-2px;border-radius:0 8px 8px 0}
.navx-c .nx-sheet-stub::after{right:-2px;border-radius:8px 0 0 8px}
.navx-c .nx-sheet-stub .nx-stub-k,.navx-c .nx-sheet-stub .nx-stub-s{display:block}
.navx-c .nx-sheet-stub .nx-stub-t{font-size:2.3rem}
.navx-c .nx-sheet-stub .nx-go{display:grid;right:var(--nx-gr);margin-top:-15px}
.navx-c .nx-sheet-stub:hover{background:var(--ink);color:var(--volt)}
.navx-c .nx-sheet-stub:hover .nx-go{background:var(--volt);color:var(--ink)}
.navx-c .nx-sheet-stub:hover:focus-visible{outline-color:var(--volt)}
.navx-c .nx-sheet-stub:focus-visible,.navx-c .nx-row:focus-visible,.navx-c .nx-sub:focus-visible{outline-offset:-6px}
@media (prefers-reduced-motion:reduce){
  .navx-c .nx-dd,.navx-c .nx-dd.is-in,.navx-c .nx-sheet,.navx-c .nx-sheet.is-in,.navx-c .nx-dd-btn svg{transition:none;translate:none}
  .navx-c .nx-sheet,.navx-c .nx-sheet.is-in{clip-path:none}
}

/* Current page (aria-current="page"): a service page marks its own receipt row and phone row; Log in is marked on the portal */
.navx-c .nx-rrow[aria-current="page"]{background:var(--fog);box-shadow:inset 6px 0 0 var(--volt),inset 8px 0 0 var(--ink)}
.navx-c .nx-rrow[aria-current="page"]:hover{background:var(--volt)}
.navx-c .nx-sub[aria-current="page"]{background:var(--fog);box-shadow:inset 8px 0 0 var(--volt),inset 10px 0 0 var(--ink)}
.navx-c .nx-sub[aria-current="page"]:hover{background:var(--volt)}
.navx-c .nx-login[aria-current="page"]{color:var(--ink)}
.navx-c .nx-sheet[hidden],.navx-c .nx-dd[hidden]{display:none !important}