/* ============================================================
   eVehicle — NX CONTENT PAGES (shared)
   Page hero · sections · cards · form fields · FAQ · prose.
   Used by page-templates/template-partner.php (Sell with us); reusable
   for any page on the nx design system.
   Breakpoints: 1024 / 768 / 600.
   ============================================================ */

.nx-page { background: var(--nx-bg); overflow-x: clip; }

/* ── Page hero (dark) ────────────────────────────────────── */
.nx-phero {
  position: relative; isolation: isolate; overflow: hidden;
  padding: calc(var(--header-height, 108px) + clamp(28px, 4vw, 56px)) 0 calc(clamp(40px, 6vw, 80px) + 28px);
  color: var(--nx-on-dark);
  background:
    radial-gradient(55% 95% at 100% 0%, rgba(0, 200, 150, .24), transparent 62%),
    radial-gradient(45% 70% at 0% 100%, rgba(125, 255, 214, .08), transparent 70%),
    var(--nx-ink);
}
.nx-phero::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask: radial-gradient(70% 100% at 75% 0%, #000, transparent 72%);
          mask: radial-gradient(70% 100% at 75% 0%, #000, transparent 72%);
}
.nx-phero-glow {
  position: absolute; z-index: -1; top: -260px; right: -160px; width: 600px; height: 600px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(0, 200, 150, .3), transparent 65%);
  animation: nx-page-drift 16s ease-in-out infinite alternate;
}
@keyframes nx-page-drift { to { transform: translate3d(-90px, 50px, 0) scale(1.1); } }

.nx-phero-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .85fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.nx-phero .nx-crumbs { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-bottom: 18px; font: 500 .8rem/1.3 var(--nx-font); color: var(--nx-on-dark-muted); }
.nx-phero .nx-crumbs a { color: var(--nx-on-dark-muted); transition: color .2s; }
.nx-phero .nx-crumbs a:hover { color: #fff; }
.nx-phero .nx-crumb-sep { opacity: .4; }
.nx-phero-title {
  margin: 14px 0 0; color: #fff; text-wrap: balance;
  font: 700 clamp(2.3rem, 5.2vw, 4.2rem)/1.03 var(--nx-font-display); letter-spacing: -.04em;
}
.nx-phero-title em, .nx-page .nx-h2 em {
  font-style: normal; color: var(--nx-emerald-600);
}
.nx-phero-title em, .nx-on-dark .nx-h2 em {
  color: var(--nx-emerald);
  background: linear-gradient(100deg, var(--nx-emerald), var(--nx-mint));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.nx-phero-lead { max-width: 58ch; margin-top: 18px; font: 400 1.06rem/1.7 var(--nx-font); color: var(--nx-on-dark-muted); }
.nx-phero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

.nx-phero-card {
  padding: 24px; border-radius: 26px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .025));
  border: 1px solid rgba(255, 255, 255, .12);
}
.nx-phero-card-cap { margin: 0 0 12px; font: 700 .68rem/1 var(--nx-font); letter-spacing: .14em; text-transform: uppercase; color: var(--nx-on-dark-muted); }
.nx-phero-card-cap ~ .nx-phero-card-cap { margin-top: 22px; }
.nx-flags { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.nx-flags li { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 9px 12px; border-radius: 12px; background: rgba(255, 255, 255, .05); font: 600 .84rem/1.2 var(--nx-font); color: #fff; }
.nx-flags li span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.nx-flags svg, .nx-pill svg { flex: none; width: 22px; height: 15px; border-radius: 3px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .12); }
.nx-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.nx-tags li { padding: 7px 12px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .14); font: 500 .8rem/1 var(--nx-font); color: var(--nx-on-dark); }

/* ── Body + sections ─────────────────────────────────────── */
.nx-page-body { position: relative; z-index: 1; margin-top: -28px; background: var(--nx-bg); border-radius: 28px 28px 0 0; }
.nx-psec { padding: clamp(56px, 8vw, 104px) 0; }
.nx-psec-tight { padding-top: 0; }
.nx-psec-head { max-width: 760px; margin-bottom: clamp(28px, 4vw, 44px); }
.nx-psec-dark { background: radial-gradient(60% 80% at 100% 0%, rgba(0, 200, 150, .2), transparent 65%), var(--nx-ink); color: var(--nx-on-dark); }

/* Models */
.nx-models { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.nx-model {
  position: relative; display: flex; flex-direction: column; gap: 12px; padding: 28px 26px 26px; border-radius: 26px;
  background: var(--nx-surface); border: 1px solid #e3eae6; box-shadow: 0 16px 36px -28px rgba(5, 13, 10, .4);
  transition: transform .4s var(--nx-ease), box-shadow .4s var(--nx-ease), border-color .3s;
}
@media (hover: hover) { .nx-model:hover { transform: translateY(-6px); border-color: rgba(0, 200, 150, .5); box-shadow: 0 30px 56px -30px rgba(5, 13, 10, .5); } }
.nx-model-num { position: absolute; top: 22px; right: 24px; font: 800 2.6rem/1 var(--nx-font-display); letter-spacing: -.04em; color: #e9efec; }
.nx-model-ic { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; background: var(--nx-ink); color: var(--nx-emerald); font-size: 1.25rem; }
.nx-model h3 { margin-top: 6px; font: 700 1.25rem/1.25 var(--nx-font-display); letter-spacing: -.02em; color: var(--nx-text); }
.nx-model p { flex: 1; color: var(--nx-muted); line-height: 1.65; }
.nx-model .nx-link-arrow { align-self: flex-start; margin-top: 6px; }

/* Why */
.nx-why { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.nx-why li { padding: 24px; border-radius: 22px; background: rgba(255, 255, 255, .045); border: 1px solid var(--nx-line-dark); }
.nx-why-ic { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: rgba(0, 200, 150, .14); color: var(--nx-mint); font-size: 1.05rem; }
.nx-why h3 { margin-top: 16px; font: 700 1.05rem/1.3 var(--nx-font-display); color: #fff; }
.nx-why p { margin-top: 8px; font-size: .92rem; line-height: 1.65; color: var(--nx-on-dark-muted); }

/* Steps + requirements */
.nx-how-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.nx-steps { position: relative; display: flex; flex-direction: column; gap: 22px; counter-reset: none; }
.nx-steps::before { content: ''; position: absolute; top: 24px; bottom: 24px; left: 23px; width: 2px; background: linear-gradient(var(--nx-emerald), rgba(0, 200, 150, .1)); }
.nx-steps li { position: relative; display: flex; gap: 18px; }
.nx-step-n {
  position: relative; flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
  background: var(--nx-ink); color: var(--nx-emerald); font: 800 1.05rem/1 var(--nx-font-display); box-shadow: 0 0 0 6px var(--nx-bg);
}
.nx-steps h3 { margin-top: 4px; font: 700 1.12rem/1.3 var(--nx-font-display); color: var(--nx-text); }
.nx-steps p { margin-top: 6px; color: var(--nx-muted); line-height: 1.65; }
.nx-needs { padding: 28px; border-radius: 26px; background: var(--nx-surface); border: 1px solid var(--nx-line); }
.nx-needs h3 { font: 700 1.15rem/1.3 var(--nx-font-display); color: var(--nx-text); }
.nx-needs ul { display: flex; flex-direction: column; gap: 12px; margin-top: 18px; }
.nx-needs li { position: relative; padding-left: 32px; color: #33433c; line-height: 1.55; }
.nx-needs li::before {
  content: ''; position: absolute; top: 1px; left: 0; width: 22px; height: 22px; border-radius: 50%;
  background: #e3f7ee url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007a5c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 13px no-repeat;
}
.nx-needs-note { margin-top: 20px; padding-top: 16px; border-top: 1px dashed var(--nx-line); font-size: .88rem; color: var(--nx-muted); }

/* ── Application ─────────────────────────────────────────── */
.nx-apply { background: linear-gradient(180deg, var(--nx-bg), #e9f1ed); }
.nx-apply-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
.nx-apply-intro { position: sticky; top: calc(var(--header-height, 108px) - var(--nx-topbar-h, 0px) + 28px); }
.nx-apply-points { display: flex; flex-direction: column; gap: 12px; margin-top: 26px; }
.nx-apply-points li { display: flex; align-items: center; gap: 12px; font: 600 .92rem/1.3 var(--nx-font); color: var(--nx-text); }
.nx-apply-points i { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: var(--nx-surface); border: 1px solid var(--nx-line); color: var(--nx-emerald-600); }

.nx-form-card { padding: clamp(22px, 3.5vw, 40px); border-radius: 28px; background: var(--nx-surface); border: 1px solid var(--nx-line); box-shadow: 0 30px 70px -40px rgba(5, 13, 10, .45); }
.nx-form { display: flex; flex-direction: column; gap: 26px; }
.nx-fs { margin: 0; padding: 0; border: 0; min-width: 0; }
.nx-fs legend { padding: 0; margin-bottom: 14px; font: 700 1rem/1.3 var(--nx-font-display); letter-spacing: -.01em; color: var(--nx-text); }
.nx-fgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.nx-fld { position: relative; display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.nx-fs > .nx-fld + .nx-fld { margin-top: 14px; }
.nx-fld > span { font: 600 .8rem/1.3 var(--nx-font); color: var(--nx-text); }
.nx-fld input, .nx-fld textarea {
  width: 100%; padding: 0 14px; height: 48px; border: 1.5px solid var(--nx-line); border-radius: 14px; outline: 0;
  background: #fff; font: 400 1rem/1.4 var(--nx-font); color: var(--nx-text); transition: border-color .2s, box-shadow .2s;
}
.nx-fld textarea { height: auto; min-height: 120px; padding: 12px 14px; resize: vertical; }
.nx-fld input::placeholder, .nx-fld textarea::placeholder { color: #9aaba3; }
.nx-fld input:focus, .nx-fld textarea:focus { border-color: var(--nx-emerald); box-shadow: 0 0 0 3px rgba(0, 200, 150, .18); }
.nx-fld small { font-size: .78rem; color: var(--nx-muted); }
.nx-fld .nx-dd, .nx-fld .nx-dd-btn { width: 100%; }
.nx-fld .nx-dd-btn { height: 48px; border: 1.5px solid var(--nx-line); border-radius: 14px; font: 400 1rem/1 var(--nx-font); }
.nx-fld .nx-dd-menu { left: 0; right: auto; }

.nx-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.nx-pill { position: relative; cursor: pointer; }
.nx-pill input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.nx-pill span {
  display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 8px 16px; border-radius: 999px;
  background: #fff; border: 1.5px solid var(--nx-line); font: 600 .86rem/1.2 var(--nx-font); color: var(--nx-text);
  transition: border-color .2s, background .2s, color .2s;
}
.nx-pill span i { color: var(--nx-emerald-600); }
.nx-pill:hover span { border-color: var(--nx-text); }
.nx-pill input:checked + span { background: var(--nx-ink); border-color: var(--nx-ink); color: #fff; }
.nx-pill input:checked + span i { color: var(--nx-emerald); }
.nx-pill input:focus-visible + span { box-shadow: 0 0 0 3px rgba(0, 200, 150, .35); }

.nx-check { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; font: 500 .9rem/1.5 var(--nx-font); color: #33433c; }
.nx-check input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--nx-emerald-600); }
.nx-check a { color: var(--nx-emerald-700); text-decoration: underline; }

.nx-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Errors + messages */
.nx-fld-err { display: block; margin-top: 6px; font: 600 .78rem/1.35 var(--nx-font); color: #be123c; }
.nx-fld.is-error input, .nx-fld.is-error textarea, .nx-fld.is-error .nx-dd-btn { border-color: #e11d48; box-shadow: 0 0 0 3px rgba(225, 29, 72, .12); }
.nx-fs.is-error .nx-pill span { border-color: #f3a5b5; }
.nx-form-msg { margin: 0; padding: 12px 16px; border-radius: 14px; background: #fdecef; color: #9f1239; font: 600 .88rem/1.45 var(--nx-font); }
.nx-form-submit { height: 56px; font-size: 1rem; }
.nx-form-submit.loading { opacity: .75; pointer-events: none; }
.nx-form-submit.loading i { animation: nx-spin .8s linear infinite; }

.nx-form-done { padding: clamp(10px, 3vw, 30px) 0; text-align: center; outline: none; }
.nx-form-done-ic { display: inline-grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: #e3f7ee; color: var(--nx-emerald-600); font-size: 2.2rem; }
.nx-form-done h3 { margin-top: 18px; font: 700 1.5rem/1.2 var(--nx-font-display); color: var(--nx-text); }
.nx-form-done p { max-width: 44ch; margin: 10px auto 22px; color: var(--nx-muted); line-height: 1.65; }
.nx-form-done b { color: var(--nx-text); }

/* ── FAQ + prose ─────────────────────────────────────────── */
.nx-pfaq-wrap { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 64px); }
.nx-pfaq { display: flex; flex-direction: column; gap: 10px; }
.nx-pfaq details { border-radius: 18px; background: var(--nx-surface); border: 1px solid var(--nx-line); transition: border-color .2s; }
.nx-pfaq details[open] { border-color: rgba(0, 200, 150, .45); }
.nx-pfaq summary { position: relative; padding: 18px 54px 18px 20px; cursor: pointer; list-style: none; font: 600 1rem/1.4 var(--nx-font-display); color: var(--nx-text); }
.nx-pfaq summary::-webkit-details-marker { display: none; }
.nx-pfaq summary::after {
  content: ''; position: absolute; top: 50%; right: 18px; width: 28px; height: 28px; margin-top: -14px; border-radius: 50%;
  background: var(--nx-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a1411' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center / 14px no-repeat;
  transition: transform .3s var(--nx-ease);
}
.nx-pfaq details[open] summary::after { transform: rotate(45deg); }
.nx-pfaq details p { padding: 0 20px 20px; color: #3c4c45; line-height: 1.7; }

.nx-prose { max-width: 820px; font: 400 1.02rem/1.75 var(--nx-font); color: #33433c; }
.nx-prose > * + * { margin-top: 1em; }
.nx-prose :is(h2, h3) { margin-top: 1.5em; font-family: var(--nx-font-display); letter-spacing: -.02em; color: var(--nx-text); }
.nx-prose ul { padding-left: 1.3em; list-style: disc; }
.nx-prose ol { padding-left: 1.4em; list-style: decimal; }
.nx-prose a { color: var(--nx-emerald-700); text-decoration: underline; }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 1024px) {
  .nx-phero-grid, .nx-how-grid, .nx-apply-grid, .nx-pfaq-wrap { grid-template-columns: minmax(0, 1fr); }
  .nx-apply-intro { position: static; }
  .nx-models { grid-template-columns: minmax(0, 1fr); }
  .nx-why { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .nx-phero { padding-top: calc(var(--header-height, 98px) + 22px); }
  .nx-phero .nx-eyebrow { font-size: .66rem; }
  .nx-phero-title { font-size: clamp(2rem, 9vw, 2.6rem); }
  .nx-phero-lead { font-size: .98rem; }
  .nx-phero-ctas .nx-btn { flex: 1 1 100%; }
  .nx-phero-card { padding: 18px; border-radius: 22px; }
  .nx-page-body { margin-top: -22px; border-radius: 22px 22px 0 0; }
  .nx-why { grid-template-columns: minmax(0, 1fr); }
  .nx-model, .nx-needs { padding: 22px 20px; border-radius: 22px; }
  .nx-fgrid { grid-template-columns: minmax(0, 1fr); }
  .nx-form-card { border-radius: 22px; }
  .nx-pill span { min-height: 40px; padding: 7px 13px; font-size: .84rem; }
}
@media (prefers-reduced-motion: reduce) { .nx-phero-glow { animation: none; } .nx-model { transition: none; } }

/* ============================================================
   404 + SEARCH RESULTS + DISCOVER BLOCK
   ============================================================ */
.nx-psec-head-row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 24px; max-width: none; }
.nx-psec-head-row .nx-h2 { margin: 0; }
.nx-psec-first { padding-top: clamp(40px, 5vw, 64px); }
.nx-phero-compact { padding-bottom: calc(clamp(32px, 4vw, 56px) + 28px); }
.nx-phero-compact .nx-phero-title { font-size: clamp(2rem, 4.4vw, 3.4rem); }

/* 404 hero */
.nx-404-in { display: flex; flex-direction: column; align-items: center; text-align: center; }
.nx-404-in .nx-phero-lead { margin-inline: auto; }
.nx-404-code {
  display: flex; align-items: center; justify-content: center; gap: .04em; margin: 0 0 6px;
  font: 800 clamp(5.5rem, 15vw, 10rem)/.9 var(--nx-font-display); letter-spacing: -.06em; color: transparent;
  -webkit-text-stroke: 2px rgba(125, 255, 214, .55);
}
.nx-404-bolt {
  display: inline-grid; place-items: center; width: .82em; height: .82em; margin: 0 .03em; border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, rgba(0, 200, 150, .45), rgba(0, 200, 150, .12) 70%);
  box-shadow: inset 0 0 0 2px rgba(125, 255, 214, .5), 0 0 60px -10px rgba(0, 200, 150, .8);
  color: var(--nx-emerald); animation: nx-404-flicker 3.2s ease-in-out infinite;
}
.nx-404-bolt svg { width: 52%; height: 52%; }
@keyframes nx-404-flicker { 0%, 45%, 51%, 57%, 100% { opacity: 1; } 48% { opacity: .35; } 54% { opacity: .55; } }

.nx-404-search {
  position: relative; display: flex; align-items: center; gap: 8px; width: min(640px, 100%); margin: 30px auto 0; padding: 6px 6px 6px 50px;
  border-radius: 999px; background: #fff; box-shadow: 0 24px 60px -24px rgba(0, 0, 0, .6);
}
.nx-404-search > i { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); color: var(--nx-muted); }
.nx-404-search input[type="search"] {
  flex: 1; min-width: 0; height: 50px; padding: 0; border: 0; outline: 0; background: none;
  font: 500 1rem/1 var(--nx-font); color: var(--nx-text); -webkit-appearance: none; appearance: none;
}
.nx-404-search input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
.nx-404-search .nx-btn { flex: none; height: 50px; }
.nx-phero-compact .nx-404-search { margin-left: 0; }

.nx-404-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 22px; }
.nx-404-links a {
  display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 999px;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); color: #fff; font: 600 .84rem/1 var(--nx-font);
  transition: background .2s, border-color .2s;
}
.nx-404-links a:hover { color: #fff; background: rgba(0, 200, 150, .14); border-color: rgba(0, 200, 150, .6); }
.nx-404-links i { color: var(--nx-emerald); }

/* Best matches for the missing URL */
.nx-match-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.nx-match {
  display: flex; align-items: center; gap: 14px; height: 100%; padding: 12px 18px 12px 12px; border-radius: 20px;
  background: var(--nx-surface); border: 1px solid var(--nx-line); color: var(--nx-text);
  transition: transform .35s var(--nx-ease), border-color .25s, box-shadow .35s;
}
.nx-match:hover { color: var(--nx-text); transform: translateY(-3px); border-color: rgba(0, 165, 124, .45); box-shadow: var(--nx-shadow); }
.nx-match-img { flex: none; display: grid; place-items: center; width: 64px; height: 64px; overflow: hidden; border-radius: 14px; background: var(--nx-bg); color: var(--nx-emerald-600); font-size: 1.2rem; }
.nx-match-img img { width: 100%; height: 100%; object-fit: cover; }
.nx-match-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.nx-match-type { font: 700 .62rem/1 var(--nx-font); letter-spacing: .12em; text-transform: uppercase; color: var(--nx-emerald-700); }
.nx-match-title { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font: 600 .95rem/1.35 var(--nx-font-display); }
.nx-match-price { font: 700 .88rem/1.2 var(--nx-font); }
.nx-match-price del { margin-right: 6px; font-weight: 500; color: var(--nx-muted); }
.nx-match-price ins { text-decoration: none; }
.nx-match-go { flex: none; color: var(--nx-muted); transition: transform .3s var(--nx-ease), color .2s; }
.nx-match:hover .nx-match-go { transform: translateX(3px); color: var(--nx-emerald-600); }

/* Search scope tabs */
.nx-scope { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 18px; }
.nx-scope a {
  display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px; border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .16); color: var(--nx-on-dark); font: 600 .84rem/1 var(--nx-font); transition: background .2s;
}
.nx-scope a:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.nx-scope a[aria-current="page"] { background: var(--nx-emerald); border-color: var(--nx-emerald); color: var(--nx-ink); }
.nx-scope span { display: grid; place-items: center; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; background: rgba(255, 255, 255, .14); font-size: .7rem; }
.nx-scope a[aria-current="page"] span { background: rgba(5, 13, 10, .14); }

/* Product grid (search) — cards from nx-core.css */
.nx-sgrid ul.products { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.nx-sgrid ul.products::before, .nx-sgrid ul.products::after { content: none; display: none; }
.nx-sgrid ul.products li.product { width: auto; float: none; margin: 0; }
.nx-blog-grid { display: grid !important; overflow: visible !important; }
.nx-blog-grid .nx-post { flex: initial !important; }
.nx-pager { margin-top: 32px; }
.nx-pager .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.nx-pager .page-numbers { display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 12px; border-radius: 12px; background: var(--nx-surface); border: 1px solid var(--nx-line); font: 600 .88rem/1 var(--nx-font); color: var(--nx-text); }
.nx-pager .page-numbers.current { background: var(--nx-ink); border-color: var(--nx-ink); color: #fff; }

/* Discover: vehicles grid + spacing */
.nx-discover .nx-psec-tight:first-child { padding-top: clamp(48px, 6vw, 80px); }
.nx-discover .nx-psec-tight + .nx-psec-tight { padding-top: clamp(40px, 5vw, 64px); }
.nx-discover .nx-pcarousel { padding-top: clamp(48px, 6vw, 80px); }
.nx-vgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.nx-vgrid a {
  display: flex; flex-direction: column; align-items: center; gap: 8px; height: 100%; padding: 20px 12px 18px; border-radius: 20px; text-align: center;
  background: var(--nx-surface); border: 1px solid var(--nx-line); color: var(--nx-text);
  transition: transform .35s var(--nx-ease), border-color .25s, box-shadow .35s;
}
.nx-vgrid a:hover { color: var(--nx-text); transform: translateY(-4px); border-color: rgba(0, 165, 124, .45); box-shadow: var(--nx-shadow); }
.nx-vgrid-ic { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(145deg, #ecfaf5, #d3f2e5); color: var(--nx-emerald-700); transition: background .3s, color .3s; }
.nx-vgrid a:hover .nx-vgrid-ic { background: var(--nx-ink); color: var(--nx-emerald); }
.nx-vgrid-ic svg { width: 30px; height: 30px; max-width: none; }
.nx-vgrid-name { font: 700 .95rem/1.25 var(--nx-font-display); }
.nx-vgrid-n { font: 500 .76rem/1.2 var(--nx-font); color: var(--nx-muted); }

@media (max-width: 1024px) {
  .nx-sgrid ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 768px) {
  .nx-match-list { grid-template-columns: minmax(0, 1fr); }
  .nx-blog-grid { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 600px) {
  .nx-404-code { font-size: clamp(4.6rem, 26vw, 6rem); }
  .nx-404-search { padding-left: 42px; }
  .nx-404-search > i { left: 16px; }
  .nx-404-search .nx-btn { padding: 0 18px; }
  .nx-404-links a { height: 38px; padding: 0 13px; font-size: .8rem; }
  .nx-sgrid ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .nx-vgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}
@media (prefers-reduced-motion: reduce) { .nx-404-bolt { animation: none; } }
