/* nx-layout.css — THE LAYOUT STANDARD (v1.4 002)
   Loaded after styles.css on every public page (shell_head + all static pages).
   styles.css grew over 230 passes of local fixes; each page ended up with its
   own widths, paddings and heading sizes, so blocks no longer lined up from one
   section to the next. This file sets ONE of each and nothing else:
     · one container: 1200px content, 24px gutters (16px on a phone)
     · one vertical rhythm: sections 64px apart (40px on a phone)
     · one heading scale (h1 / section h2 / card h3)
     · one card: radius, padding, equal heights in a grid, footer at the bottom
     · one button size, one form-field size
     · a footer whose columns and rows align to the same grid
   Colour, type and motion tokens come in build 003 and sit on top of this. */
:root{
  --l-maxw:1200px; --l-gut:24px;
  --l-s1:4px; --l-s2:8px; --l-s3:12px; --l-s4:16px; --l-s5:24px; --l-s6:32px; --l-s7:48px; --l-s8:64px;
  --l-r:14px; --l-r-sm:10px;
  --l-h1:clamp(2rem,1.2rem + 2.6vw,3rem);
  --l-h2:clamp(1.55rem,1.1rem + 1.4vw,2.2rem);
  --l-h3:1.12rem;
  --l-lede:1.06rem;
}
@media(max-width:600px){:root{--l-gut:16px;--l-s8:40px;--l-s7:32px}}

/* container */
.wrap{max-width:calc(var(--l-maxw) + 2 * var(--l-gut));padding-left:var(--l-gut);padding-right:var(--l-gut)}
html,body{overflow-x:clip}

/* vertical rhythm */
section{padding-top:var(--l-s8);padding-bottom:var(--l-s8)}
section + section{padding-top:calc(var(--l-s8) * .75)}
.page-hero{padding-top:var(--l-s7);padding-bottom:var(--l-s6)}
.page-hero.sub{padding-bottom:var(--l-s5)}
.page-hero + section{padding-top:var(--l-s4)}
.hero{padding-top:var(--l-s7);padding-bottom:var(--l-s7)}

/* heading scale */
.page-hero h1,.hero h1,.hero .h1-long{font-size:var(--l-h1);line-height:1.08;letter-spacing:-.02em;max-width:22ch}
.sec-head{max-width:760px;margin-bottom:var(--l-s5)}
.sec-head h2,section > .wrap > h2{font-size:var(--l-h2);line-height:1.15;letter-spacing:-.015em;margin-top:var(--l-s3)}
.sec-head p,.page-hero .lede,.hero .lede{font-size:var(--l-lede);line-height:1.6;max-width:62ch}
.sec-head p{margin-top:var(--l-s3)}
.page-hero .lede{margin-top:var(--l-s4)}
.eyebrow{margin-bottom:0}
.pb-card h3,.ind-card h2,.gov-door h2,.bl-card h3{font-size:var(--l-h3);line-height:1.3;margin:0 0 var(--l-s2)}

/* hero: text and search card start on the same line */
.hero-grid{gap:var(--l-s7);align-items:start}
.hero .search-card{margin-top:var(--l-s6)}
.hero .hero-accepts{margin-top:var(--l-s3)}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr}.hero .search-card{margin-top:0}}

/* buttons and fields: one size */
.btn{min-height:44px;padding:10px 20px;border-radius:var(--l-r-sm);font-size:.92rem;line-height:1.2;justify-content:center}
.hero-cta,.acts{display:flex;flex-wrap:wrap;gap:var(--l-s3);align-items:center}
.pf-form input:not([type=checkbox]):not([type=radio]):not([type=file]),.pf-form select,.pf-form textarea{min-height:44px;border-radius:var(--l-r-sm)}
.pf-form textarea{min-height:120px}
.fgrid{gap:var(--l-s4) var(--l-s5)}

/* cards in grids: equal heights, content at the top, footer at the bottom */
.cat-grid,.pb-grid,.ind-grid,.tier-grid,.subgrid,.bl-grid,.gov-doors{gap:var(--l-s5);align-items:stretch}
.cat,.pb-card,.ind-card,.tier,.subcard,.bl-card,.gov-door,.why-card{border-radius:var(--l-r);padding:var(--l-s5);display:flex;flex-direction:column;height:100%}
.cat .desc{flex:0 0 auto}
.cat .subs{margin-bottom:var(--l-s4)}
.cat .foot{margin-top:auto}
.pb-card a,.ind-card > a{margin-top:auto;padding-top:var(--l-s3)}
.pb-actions{gap:var(--l-s3)}
.pb-act{min-height:76px}

/* one width for long text blocks */
.legal-doc,.ind-narrow,.faq{max-width:820px}

/* footer: one grid, rows aligned to it */
.foot{padding-top:var(--l-s7)}
.foot-grid{grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:var(--l-s6) var(--l-s5);align-items:start}
.foot .col h5{margin-bottom:var(--l-s3)}
.foot .col a{padding:4px 0}
.foot-legal{justify-content:flex-start;gap:var(--l-s2) var(--l-s5);margin-top:var(--l-s6);padding-top:var(--l-s4)}
.foot-bottom{margin-top:var(--l-s5);padding-top:var(--l-s4);gap:var(--l-s3) var(--l-s5)}
.foot-legalid{display:flex;flex-wrap:wrap;gap:var(--l-s2)}
@media(max-width:900px){.foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.foot-grid{grid-template-columns:1fr}}

/* small screens: nothing wider than the screen */
@media(max-width:600px){
  .pb-actions{grid-template-columns:1fr}
  .rfq{padding:var(--l-s5)}
  .btn{white-space:normal;text-align:center}
  .hero-cta .btn,.acts .btn{flex:1 1 auto}
}

/* v1.4 002 components that need the same rhythm */
.ind-sec{padding-top:var(--l-s6);padding-bottom:var(--l-s6)}
.ind-list{margin:0;padding-left:1.1em;color:var(--slate);line-height:1.8}
.ind-more{margin-top:var(--l-s5);color:var(--slate)}
.nx-band{border-color:#b45309;color:#7c2d12;background:#fff7ed}
.rf-acts{display:flex;flex-wrap:wrap;gap:var(--l-s4);align-items:center;padding:var(--l-s2) var(--l-s4) var(--l-s3);font-size:.84rem}
.rf-acts form{margin:0}
.lnk{background:none;border:0;padding:0;color:var(--blue-strong);font:inherit;font-weight:600;cursor:pointer}
.lnk.danger{color:#b42318}
.lnk-wa{color:#128C4A;font-weight:600}
.bl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.bl-card{background:var(--card,#fff);border:1px solid var(--line)}
.bl-card header{display:flex;justify-content:space-between;align-items:baseline;gap:var(--l-s3)}
.bl-n,.bl-meta{color:var(--slate);font-size:.82rem}
.bl-row{display:flex;gap:var(--l-s2);flex-wrap:wrap;align-items:center;margin:var(--l-s3) 0 0}
.bl-card label{display:flex;flex-direction:column;gap:4px;font-size:.82rem;font-weight:600;margin-top:var(--l-s3)}
.bl-card input,.bl-card select,.bl-card textarea{font:inherit;border:1px solid var(--line);border-radius:8px;padding:8px 10px;width:100%}
.bl-edit{margin-top:var(--l-s3)}.bl-edit summary{cursor:pointer;font-weight:600;font-size:.86rem}
.bl-due{display:flex;flex-wrap:wrap;gap:var(--l-s3);align-items:center;justify-content:space-between;border:1px solid #f0c27b;background:#fffaf0;border-radius:var(--l-r);padding:var(--l-s4);margin-bottom:var(--l-s5)}
.bl-due form{margin:0}
.bl-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--l-r);background:var(--card,#fff)}
.bl-tbl{width:100%;border-collapse:collapse;font-size:.88rem}
.bl-tbl th{text-align:left;font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;color:var(--slate);padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.bl-tbl td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.bl-tbl .num{text-align:right;font-variant-numeric:tabular-nums}
.nx-direct{margin-top:var(--l-s4);border:1px solid #f0c27b;background:#fffaf0;border-radius:var(--l-r);padding:var(--l-s4)}
.nx-direct blockquote{margin:var(--l-s2) 0;padding:var(--l-s3);background:#fff;border-left:3px solid #c2410c;border-radius:6px;white-space:normal}
.nx-direct form{display:flex;flex-wrap:wrap;gap:var(--l-s3);align-items:center}

/* Narrow content keeps the SAME left edge as everything else.
   Pages narrowed their .wrap with an inline max-width (640–900px), which centred
   the block and moved its left edge away from the header, hero and footer above
   and below it. The container stays standard; only the content is narrowed. */
.wrap[style*="max-width"],.ind-narrow{max-width:calc(var(--l-maxw) + 2 * var(--l-gut)) !important}
.wrap[style*="max-width"] > *,.ind-narrow > *{max-width:880px}
.wrap[style*="max-width"] > .bl-scroll,.wrap[style*="max-width"] > table{max-width:100%}
/* labels size to their text, never to the card */
.eyebrow{align-self:flex-start;width:auto;max-width:100%}
/* .nx-brandfacts is both a chip row and, on some brand pages, a <section>: the
   chip styling indented the whole section off the grid. A section is a section. */
section.nx-brandfacts{display:block;margin-top:0;font-size:inherit;color:inherit;background:none;border:0;border-radius:0;padding-left:0;padding-right:0}
section.nx-brandfacts > .wrap{font-size:inherit;color:inherit;background:none;border:0;border-radius:0;padding:0 var(--l-gut)}

/* ── HEADER STANDARD (same structure as Infrecx; Netrecx palette) ──────────
   utility bar · white navigation bar · accent line. Graphite and amber/copper,
   so Netrecx never reads as Infrecx's navy/blue/green. */
.topbar{background:#17191e;color:#c9ccd3;font-size:.78rem;position:relative;z-index:51}
.topbar-in{display:flex;justify-content:space-between;align-items:center;gap:16px;height:36px}
.topbar a{color:#c9ccd3;text-decoration:none}
.topbar a:hover{color:#fff}
.topbar b{color:#fff;font-weight:500}
.tb-sep{display:inline-block;width:1px;height:12px;background:rgba(255,255,255,.25);margin:0 12px;vertical-align:-1px}
.tb-links{display:flex;gap:18px;align-items:center}
.tb-links a:first-child{color:#fbbf24;font-weight:600}
.hdr{background:rgba(255,255,255,.96);border-bottom:0;box-shadow:0 1px 0 #e6e3dd}
.hdr::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:linear-gradient(90deg,#f59e0b 0%,#ea580c 55%,#9a3412 100%);opacity:.95;pointer-events:none}
.hdr .inner{height:74px}
.hdr .nav a.is-active{color:#9a3412}
.hdr .nav a.is-active::after{background:#ea580c}
@media(max-width:900px){.tb-div{display:none}}
@media(max-width:760px){.topbar{font-size:.74rem}.topbar-in{gap:10px}.tb-links a:not(:first-child){display:none}.hdr .inner{height:64px}}

/* v1.4 003: the hero network strip */
.nx-net{margin:var(--l-s6) 0 0;border:1px solid var(--line);border-radius:var(--l-r);background:linear-gradient(180deg,#fff,#fffaf5);padding:var(--l-s3) var(--l-s4) var(--l-s4);box-shadow:var(--nx-sh-1,0 1px 2px rgba(0,0,0,.05))}
.nx-net canvas{display:block;width:100%;height:200px}
.nx-net figcaption{font-family:var(--mono);font-size:.74rem;color:var(--slate);text-align:center;margin-top:var(--l-s2)}
@media(max-width:640px){.nx-net canvas{height:170px}.nx-net figcaption{font-size:.68rem}}

/* ── v1.4 003 MOTION (nx-motion.js) — every effect off under reduced motion ── */
.nx-rv{opacity:0;transform:translateY(14px);transition:opacity .55s cubic-bezier(.22,.61,.36,1) var(--nx-delay,0ms),transform .55s cubic-bezier(.22,.61,.36,1) var(--nx-delay,0ms)}
.nx-rv.nx-in{opacity:1;transform:none}
/* process timeline: a copper rail fills as the steps light */
.nx-timeline{position:relative}
.nx-timeline::before{content:"";position:absolute;left:0;top:0;width:3px;height:var(--nx-tl,0%);background:var(--nx-grad,#ea580c);transition:height .45s ease;border-radius:2px;z-index:1}
.nx-timeline .specrow .st{transition:color .3s ease}
.nx-timeline .specrow.on .st{color:var(--nx-acc-strong,#c2410c)}
.nx-timeline .specrow .sv span{transition:background .3s ease,border-color .3s ease}
.nx-timeline .specrow.on .sv span{border-color:var(--nx-acc-line,#fdd3b4);background:var(--nx-acc-wash,#fff4ec)}
.nx-timeline.nx-tl-done::before{height:100%}
/* hover depth on cards */
.cat,.subcard,.pb-card{transform:perspective(900px) rotateX(var(--nx-rx,0)) rotateY(var(--nx-ry,0));transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.cat:hover,.subcard:hover,.pb-card:hover{box-shadow:var(--nx-sh-2);border-color:var(--nx-acc-line,#fdd3b4)}
/* brand marquee */
.nx-marquee{margin-top:var(--l-s5);overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:var(--l-s3) 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.nx-mq-track{display:flex;gap:var(--l-s3);width:max-content;animation:nx-mq 60s linear infinite}
.nx-mq-track a,.nx-mq-dup a{white-space:nowrap;font-size:.86rem;font-weight:600;color:var(--nx-ink-2,#2a2d35);border:1px solid var(--line);border-radius:999px;padding:6px 14px;background:#fff}
.nx-mq-track a:hover,.nx-mq-dup a:hover{border-color:var(--nx-acc);color:var(--nx-acc-strong)}
.nx-mq-dup{display:flex;gap:var(--l-s3)}
.nx-marquee:hover .nx-mq-track{animation-play-state:paused}
@keyframes nx-mq{to{transform:translateX(-50%)}}
/* upload progress */
.nx-up{position:relative;flex-basis:100%;height:30px;border:1px solid var(--line);border-radius:999px;background:#fff;overflow:hidden;margin-top:var(--l-s3)}
.nx-up-fill{position:absolute;inset:0 auto 0 0;width:0;background:var(--nx-grad,#ea580c);transition:width .2s linear}
.nx-up-t{position:relative;display:block;text-align:center;line-height:28px;font-size:.82rem;font-weight:600;color:var(--nx-ink)}
/* RFQ received tick */
.nx-done-tick circle{stroke:var(--nx-ok,#15803d);stroke-width:2.5;stroke-dasharray:151;stroke-dashoffset:151}
.nx-done-tick path{stroke:var(--nx-ok,#15803d);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:36;stroke-dashoffset:36}
.nx-done-tick.go circle{transition:stroke-dashoffset .6s ease-out;stroke-dashoffset:0}
.nx-done-tick.go path{transition:stroke-dashoffset .35s ease-out .5s;stroke-dashoffset:0}
@media(prefers-reduced-motion:reduce){
  .nx-rv{opacity:1;transform:none;transition:none}
  .nx-mq-track{animation:none;flex-wrap:wrap;width:auto}.nx-mq-dup{display:none}
  .cat,.subcard,.pb-card{transform:none}
  .nx-done-tick circle,.nx-done-tick path{stroke-dashoffset:0}
}
/* v1.4 003: one display weight (800) for every headline — the one preloaded */
.page-hero h1,.hero h1,.hero .h1-long,.sec-head h2,.brandmark{font-weight:800}
/* v1.4 003: content is visible by default; motion.js hides only what is below
   the fold, after it has run. A hidden-until-JS first screen was the LCP. */
.rev{opacity:1;transform:none}

/* ═══ v1.4 005 · one header/footer scheme ═══
   Graphite top bar, white header, graphite footer — and one accent, copper,
   as a single solid line on the header and on top of the footer. The navy
   footer, the four-colour rainbow rule, the blue legal links and the amber
   top-bar link are gone: two neutrals and one accent, nothing else. */
.tb-links a:first-child{color:#fff;font-weight:600}
.hdr::after{height:2px;bottom:-2px;background:#ea580c;opacity:1}
footer.foot{background:#17191e;color:#c9ccd3}
footer.foot::before{height:2px;background:#ea580c}
footer.foot .col h5{color:#8b919c;letter-spacing:.1em}
footer.foot .col a,footer.foot .foot-legal a{color:#d4d6db}
footer.foot .col a:hover,footer.foot .foot-legal a:hover{color:#fff}
footer.foot .about p,footer.foot .foot-addr,footer.foot .foot-addr > *,footer.foot .foot-bottom,
footer.foot .foot-bottom > span,footer.foot .foot-entity,footer.foot .foot-copy,footer.foot .foot-tag{color:#9ca1ab}
footer.foot .foot-legal,footer.foot .foot-bottom,footer.foot .foot-legalid{border-top-color:#2a2e35}
footer.foot .foot-legalid > span{background:#1f2228;border-color:#30343c;color:#a7abb4}
footer.foot .foot-parent{color:#fff;border-bottom-color:#ea580c}
footer.foot a:focus-visible{outline-color:#f59e0b}
/* the faint page grid stops where the hero glow stops — keep it under the hero only */
body::before{display:none}

/* ═══ v1.4 005 · page-hero motion (assets/nx-motion.js §6) ═══ */
.page-hero.nx-ph-on{position:relative;overflow:hidden;isolation:isolate}
.page-hero.nx-ph-on::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background-image:linear-gradient(to right,rgba(23,25,30,.04) 1px,transparent 1px),linear-gradient(to bottom,rgba(23,25,30,.04) 1px,transparent 1px);
  background-size:46px 46px;-webkit-mask-image:linear-gradient(180deg,#000 40%,transparent);mask-image:linear-gradient(180deg,#000 40%,transparent)}
.page-hero .wrap{position:relative}
.nx-ph-routes{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.nx-ph-routes .ph-lane{fill:none;stroke:#17191e;stroke-opacity:.07;stroke-width:1.4}
.nx-ph-scene{display:none}
.nx-ph-scene .ph-d,.nx-ph-scene .ph-s{fill:none;stroke:#17191e;stroke-opacity:.55;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.nx-ph-scene .ph-c{stroke:#ea580c;stroke-opacity:.9}
.nx-ph-scene .ph-thick{stroke-width:3}
.nx-ph-scene .ph-box{fill:#ea580c;fill-opacity:.85}
.nx-ph-scene .ph-sheet{fill:#fff;stroke:#17191e;stroke-opacity:.35;stroke-width:1.4}
.nx-ph-scene .ph-puff{fill:#17191e;fill-opacity:.12}
.nx-ph-scene .ph-ping{fill:none;stroke:#ea580c;stroke-width:1.5}
@media(min-width:1200px){
  .page-hero.nx-ph-has .wrap > :not(.nx-ph){max-width:min(100%,calc(100% - 420px))}
  .nx-ph-scene{display:block;position:absolute;right:28px;top:-8px;bottom:-8px;height:calc(100% + 16px);max-height:300px;width:auto;aspect-ratio:360/260;margin:auto 0;pointer-events:none}
}
.nx-ph-go .nx-ph-scene .ph-d{stroke-dasharray:1;stroke-dashoffset:1;animation:ph-draw 1.4s var(--d,0s) cubic-bezier(.4,.1,.2,1) forwards}
.nx-ph-go .ph-spin{animation:ph-spin 18s linear infinite}
.nx-ph-go .ph-float{animation:ph-float 6s ease-in-out infinite}
.nx-ph-go .ph-puff{animation:ph-puff 4s ease-out infinite}
.nx-ph-go .ph-ping{animation:ph-ping 2.8s ease-out infinite;transform-origin:180px 130px}
.nx-ph-go .ph-scan{animation:ph-scan 3.2s ease-in-out infinite alternate}
.nx-ph-paused *{animation-play-state:paused!important}
@keyframes ph-draw{to{stroke-dashoffset:0}}
@keyframes ph-spin{to{transform:rotate(360deg)}}
@keyframes ph-float{50%{transform:translateY(-6px)}}
@keyframes ph-puff{0%{transform:translateY(0);opacity:0}30%{opacity:1}100%{transform:translateY(-26px);opacity:0}}
@keyframes ph-ping{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.9);opacity:0}}
@keyframes ph-scan{from{transform:translateY(0)}to{transform:translateY(90px)}}
@media(prefers-reduced-motion:reduce){.nx-ph-scene *{animation:none!important}}

/* ═══ v1.4 005 · government: registrations + questions side by side ═══ */
.gv-info{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:var(--l-s6,40px);align-items:start}
.gv-info h2{font-size:1.25rem;margin:0 0 14px}
.reg-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}
.reg-grid > div{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 14px;box-shadow:inset 3px 0 0 #ea580c}
.reg-grid dt{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#6b7280}
.reg-grid dd{margin:2px 0 0;font-size:.84rem;color:#17191e;word-break:break-all}
.gv-more{display:inline-block;margin-top:14px;font-weight:600;color:#c2410c}
.gv-faq .faq{max-width:none}
@media(max-width:900px){.gv-info{grid-template-columns:1fr}}
@media(max-width:520px){.reg-grid{grid-template-columns:1fr}}
/* v1.4 005: every nav item at one size and weight — the smaller, faded
   "Government buyers" read as a formatting fault, not as a priority. */
.hdr .nav a.nav-gov{font-size:inherit;opacity:1;font-weight:inherit}