/* JPRAXC / shared public shell. Layered after public.css; all rules are opt-in.
   Homepage nx-* composition and product artwork belong to their own sheets. */
body.future-site.jx-next {
  --nx-ink: #32131f;
  --nx-wine: #650d2d;
  --nx-paper: #f7f2e9;
  --nx-muted: #71616a;
  --nx-gold: #b88442;
  --nx-line: #dfd2cf;
  --nx-line-strong: #baa3aa;
  --nx-surface: #fffdf8;
  --nx-soft: #eee6dd;
  --nx-accent: #650d2d;
  --nx-on-accent: #fff8ed;
  --nx-shadow: 0 16px 48px #32131f0a;
  --nx-radius: 16px;
  --nx-header-height: 88px;
  --jpx-paper: var(--nx-paper);
  --jpx-paper-raised: var(--nx-surface);
  --jpx-paper-soft: var(--nx-soft);
  --jpx-wine: var(--nx-accent);
  --jpx-wine-deep: #32131f;
  --jpx-wine-surface: var(--nx-wine);
  --jpx-ink: var(--nx-ink);
  --jpx-muted: var(--nx-muted);
  --jpx-line: var(--nx-line);
  --jpx-line-strong: var(--nx-line-strong);
  --jpx-amber: var(--nx-gold);
  --jpx-amber-soft: var(--nx-soft);
  --jpx-radius: var(--nx-radius);
  --jpx-shadow: var(--nx-shadow);
  --f-paper: var(--nx-paper);
  --f-ink: var(--nx-ink);
  --f-wine: var(--nx-accent);
  --f-muted: var(--nx-muted);
  --f-rule: var(--nx-line);
  --f-gold: var(--nx-gold);
  --jp-policy-link-color: #650d2d;
  margin: 0;
  padding: 0;
  background: var(--nx-paper);
  color: var(--nx-ink);
  font-family: Manrope, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.65;
  accent-color: var(--nx-accent);
}

html[data-theme="dark"] body.future-site.jx-next {
  --nx-ink: #f7f2e9;
  --nx-paper: #21121b;
  --nx-muted: #c9b8bf;
  --nx-line: #513641;
  --nx-line-strong: #886a78;
  --nx-surface: #2c1a24;
  --nx-soft: #38222e;
  --nx-accent: #edccae;
  --nx-on-accent: #32131f;
  --nx-shadow: 0 16px 48px #10070c24;
  --jpx-paper: var(--nx-paper);
  --jpx-paper-raised: var(--nx-surface);
  --jpx-paper-soft: var(--nx-soft);
  --jpx-wine: var(--nx-accent);
  --jpx-wine-deep: var(--nx-ink);
  --jpx-wine-surface: var(--nx-wine);
  --jpx-ink: var(--nx-ink);
  --jpx-muted: var(--nx-muted);
  --jpx-line: var(--nx-line);
  --jpx-line-strong: var(--nx-line-strong);
  --jpx-amber: var(--nx-gold);
  --jpx-amber-soft: var(--nx-soft);
  --jpx-shadow: var(--nx-shadow);
  --jp-policy-link-color: #f7f2e9;
}

.jx-next ::selection { background: #650d2d; color: #fff8ed; }
.jx-next :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--nx-accent);
  outline-offset: 4px;
}
.jx-next :is([id], .anchor-nav) { scroll-margin-top: calc(var(--nx-header-height) + 24px); }
.jx-next .future-skip { border-radius: 8px; background: var(--nx-ink); color: var(--nx-paper); }

/* The header participates in page flow. Contact and theme hooks are retained;
   catalogue/navigation access remains in the floating dock and website index. */
.jx-next .jx-site-header {
  position: sticky;
  top: 0;
  z-index: 90;
  background: var(--nx-paper);
  border-top: 3px solid var(--nx-wine);
  border-bottom: 1px solid var(--nx-line);
}
.jx-next .jx-header-inner {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 28px;
  min-height: 84px;
  width: calc(100% - clamp(40px, 8vw, 128px));
  max-width: 1480px;
  margin-inline: auto;
}
.jx-next .jx-site-header .floating-brand {
  position: static;
  gap: 10px;
  min-height: 48px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--nx-ink);
  backdrop-filter: none;
}
.jx-next .jx-site-header .floating-brand img { width: 42px; height: 42px; }
.jx-next .jx-site-header .floating-brand > span {
  font-family: 'Space Grotesk', Arial, sans-serif;
  font-size: 23px;
  font-weight: 700;
  letter-spacing: -.045em;
}
.jx-next .jx-site-header .floating-brand small {
  margin-top: 5px;
  font-family: Manrope, Arial, sans-serif;
  font-size: 7px;
  letter-spacing: .14em;
  color: var(--nx-muted);
}
.jx-next .jx-primary-nav { display: flex; align-items: center; justify-content: center; gap: 4px; }
.jx-next .jx-primary-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 10px 14px;
  border-radius: 8px;
  color: var(--nx-ink);
  font-size: 14px;
  font-weight: 650;
  white-space: nowrap;
  transition: color .18s, background-color .18s;
}
.jx-next .jx-primary-nav a:hover,
.jx-next .jx-primary-nav a[aria-current="page"] { background: var(--nx-soft); color: var(--nx-accent); }
.jx-next .jx-primary-nav a[aria-current="page"] { box-shadow: inset 0 -2px var(--nx-accent); }
.jx-next .jx-site-header .contact-corner { position: static; display: flex; align-items: center; gap: 8px; }
.jx-next .jx-site-header :is(.corner-phone, .corner-email, .theme-toggle, .jx-motion-toggle) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  gap: 8px;
  width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid var(--nx-line);
  border-radius: 10px;
  background: transparent;
  color: var(--nx-ink);
  font-family: inherit;
  font-size: 13px;
  font-weight: 650;
  backdrop-filter: none;
  transition: background-color .18s, border-color .18s;
}
.jx-next .jx-site-header :is(.corner-phone, .corner-email, .theme-toggle, .jx-motion-toggle):hover {
  background: var(--nx-soft);
  border-color: var(--nx-line-strong);
}
.jx-next .jx-site-header :is(.corner-phone, .corner-email, .theme-toggle, .jx-motion-toggle) svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.jx-next .jx-site-header :is(.corner-email, .corner-phone, .jx-motion-toggle) > span {
  position: absolute;
  display: block;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.jx-next .jx-site-header .jx-motion-toggle { position: relative; }
.jx-next .jx-site-header .jx-motion-toggle:is(:hover, :focus-visible) > span {
  top: calc(100% + 8px);
  right: 0;
  z-index: 1;
  width: max-content;
  height: auto;
  margin: 0;
  padding: 7px 10px;
  overflow: visible;
  clip-path: none;
  border-radius: 6px;
  background: var(--nx-ink);
  color: var(--nx-paper);
  font-size: 12px;
}
.jx-next .jx-site-header .contact-trigger {
  min-height: 46px;
  padding: 11px 17px;
  gap: 9px;
  border: 1px solid var(--nx-accent);
  border-radius: 10px;
  background: var(--nx-accent);
  color: var(--nx-on-accent);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  box-shadow: none;
  white-space: nowrap;
  transition: box-shadow .18s, transform .18s;
}
.jx-next .jx-site-header .contact-trigger:hover { box-shadow: 0 5px 18px #650d2d20; transform: translateY(-1px); }
.jx-next .jx-site-header .contact-trigger > span:last-child { display: inline; margin-left: 5px; font-size: 18px; }
.jx-next .jx-site-header .availability-dot { display: inline-block; width: 5px; height: 5px; background: currentColor; box-shadow: none; }
.jx-next .chapter-rail { left: 12px; padding: 8px 3px; background: var(--nx-paper); color: var(--nx-muted); border-radius: 0; }
.jx-next .chapter-rail > i { background: var(--nx-line); }
.jx-next .chapter-rail b { background: var(--nx-accent); }

/* Secondary pages share typography and spacing; specialised product grids
   and artwork are deliberately owned by next-products.css. */
body.jx-next.future-page {
  --paper: var(--nx-paper);
  --cream: var(--nx-soft);
  --bg: var(--nx-paper);
  --white: var(--nx-surface);
  --ink: var(--nx-ink);
  --ink-soft: var(--nx-muted);
  --muted: var(--nx-muted);
  --muted-2: var(--nx-muted);
  --text: var(--nx-ink);
  --text-soft: var(--nx-muted);
  --text-muted: var(--nx-muted);
  --surface: var(--nx-surface);
  --surface-2: var(--nx-soft);
  --line: var(--nx-line);
  --line-2: var(--nx-line);
  --line-strong: var(--nx-line-strong);
  --cw: 1440px;
  --cw-wide: 1520px;
  --cw-narrow: 1120px;
  --gutter: clamp(20px, 5.5vw, 84px);
  --band-y: clamp(64px, 7vw, 110px);
  --band-y-tight: clamp(42px, 4vw, 64px);
  --space-card: clamp(24px, 2.7vw, 38px);
  --space-grid: clamp(20px, 2.5vw, 36px);
  --anchor-offset: calc(var(--nx-header-height) + 24px);
  padding-top: 0;
}
body.jx-next.future-page .band { background: var(--nx-paper); }
body.jx-next.future-page :is(.band--cream, .band--soft) { background: var(--nx-soft); }
body.jx-next.future-page .band.page-hero {
  --text: var(--nx-ink);
  --text-soft: var(--nx-muted);
  --text-muted: var(--nx-muted);
  --line: var(--nx-line);
  padding-top: clamp(34px, 4.5vw, 70px);
  padding-bottom: clamp(54px, 6vw, 92px);
  background: var(--nx-paper);
  border-bottom: 1px solid var(--nx-line);
  color: var(--nx-ink);
}
body.jx-next.future-page .page-title {
  max-width: 19ch;
  margin-block: 22px 28px;
  color: var(--nx-ink);
  font-size: clamp(42px, 5.6vw, 84px);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -.065em;
  text-wrap: balance;
}
body.jx-next.future-page :is(.section-title, .cta-band__title) {
  font-size: clamp(32px, 3.5vw, 54px);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -.05em;
  text-wrap: balance;
}
body.jx-next.future-page .section-head { margin-bottom: clamp(32px, 4vw, 58px); }
body.jx-next.future-page .page-hero .lead { max-width: 60ch; color: var(--nx-muted); font-size: clamp(17px, 1.5vw, 20px); line-height: 1.75; }
body.jx-next.future-page :is(.section-lead, .hero__micro) { color: var(--nx-muted); line-height: 1.75; }
body.jx-next.future-page .section-lead { font-size: 17px; }
body.jx-next.future-page .hero__actions { margin-top: 32px; gap: 12px; }
body.jx-next.future-page .breadcrumb { margin-bottom: 36px; gap: 10px; }
body.jx-next.future-page .breadcrumb__item { color: var(--nx-muted); font-size: 12px; }
body.jx-next.future-page .breadcrumb__item.is-current { color: var(--nx-ink); }
body.jx-next.future-page .page-hero :is(.eyebrow, .tag) { color: var(--nx-accent); letter-spacing: .13em; }
body.jx-next.future-page .anchor-nav { margin-top: 28px; }
body.jx-next.future-page .anchor-nav__link { min-height: 44px; padding: 11px 17px; border-radius: 8px; font-size: 13px; }

body.jx-next.future-page :is(.band--wine, .band--deep):not(.page-hero) {
  --text: #f7f2e9;
  --text-soft: #e2cfd7;
  --text-muted: #e2cfd7;
  --line: #94566d;
  --line-2: #94566d;
  --line-strong: #ba8398;
  --jp-policy-link-color: #f7f2e9;
  background: var(--nx-wine);
  color: #f7f2e9;
}
body.jx-next.future-page :is(.band--wine, .band--deep):not(.page-hero) :is(.section-lead, .cta-band__text) { color: #e2cfd7; }

body.jx-next.future-page :is(.card, .form-card, .feedback-form, .pricing-summary, .pricing-success, .quote-card, .download-card, .catalogue-download-card, .about-build__card, .about-fact) {
  --text: var(--nx-ink);
  --text-soft: var(--nx-muted);
  --text-muted: var(--nx-muted);
  --line: var(--nx-line);
  --line-2: var(--nx-line);
  --jp-policy-link-color: var(--nx-accent);
  border: 1px solid var(--nx-line);
  border-radius: var(--nx-radius);
  background: var(--nx-surface);
  color: var(--nx-ink);
  box-shadow: var(--nx-shadow);
}
body.jx-next.future-page :is(.card, .download-card, .catalogue-download-card):hover { border-color: var(--nx-line-strong); background: var(--nx-surface); }
body.jx-next.future-page :is(.card__title, .form-card__head h2) { color: var(--nx-ink); font-size: clamp(23px, 2.1vw, 30px); font-weight: 600; line-height: 1.2; letter-spacing: -.035em; }
body.jx-next.future-page :is(.card .card__text, .card .card__text a, .form-card__head .small, .quote-card__meta) { color: var(--nx-muted); line-height: 1.75; }
body.jx-next.future-page .card__head { margin-bottom: 20px; }
body.jx-next.future-page .card__foot { padding-top: 22px; margin-top: 26px; }
body.jx-next.future-page .card__icon-tile { background: var(--nx-soft); color: var(--nx-accent); border-radius: 10px; }

.jx-next.future-site :is(.button, .future-button) {
  min-height: 50px;
  padding: 14px 22px;
  gap: 20px;
  border-radius: 10px;
  font-family: Manrope, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: -.01em;
  box-shadow: none;
}
.jx-next.future-site :is(.button-primary, .future-button) { background: var(--nx-accent); border-color: var(--nx-accent); color: var(--nx-on-accent) !important; }
.jx-next.future-site :is(.button-primary, .future-button):hover { background: var(--nx-accent); border-color: var(--nx-accent); box-shadow: 0 5px 18px #650d2d18; transform: translateY(-2px); }
body.jx-next.future-page :is(.button-outline, .button-outline-light, .button-light) { background: transparent; border-color: var(--nx-line-strong); color: var(--nx-accent); }
body.jx-next.future-page :is(.button-outline, .button-outline-light, .button-light):hover { background: var(--nx-soft); border-color: var(--nx-accent); color: var(--nx-accent); }
.jx-next.future-site :is(.band--wine:not(.page-hero), .band--deep:not(.page-hero), .page-contact-end, .contact-finale) :is(.button-primary, .button-light, .future-button),
.jx-next.future-site .future-button.light { background: #f7f2e9; border-color: #f7f2e9; color: #650d2d !important; }
.jx-next.future-site :is(.band--wine:not(.page-hero), .band--deep:not(.page-hero)) :is(.button-outline, .button-outline-light) { color: #f7f2e9; background: transparent; border-color: #c197a6; }
.jx-next.future-site :is(.band--wine, .band--deep) .card .button-primary { background: var(--nx-accent); border-color: var(--nx-accent); color: var(--nx-on-accent) !important; }

/* Fields keep their display/required/hidden state and native widget behavior.
   In particular, this layer never gives all inputs a display property. */
body.jx-next.future-page :is(.form-card, .feedback-form, .pricing-success) { padding: clamp(24px, 4vw, 52px); }
body.jx-next.future-page .form-card__head { margin-bottom: 32px; padding-bottom: 28px; }
body.jx-next.future-page .form-grid,
body.jx-next.future-page .buy-form-section .form-grid { row-gap: 26px; column-gap: 28px; }
.jx-next.future-site :is(.field__label, .demo-dialog__field > span, .demo-dialog__products legend) { color: var(--nx-ink); font-size: 13px; font-weight: 700; line-height: 1.5; letter-spacing: 0; }
.jx-next.future-site :is(.field__hint, .form-note, .demo-dialog__products > small, .demo-dialog__actions p) { color: var(--nx-muted); font-size: 12px; line-height: 1.65; }
.jx-next.future-site :is(.input, .select, .textarea, .multi-select > summary),
.jx-next.future-site .demo-dialog__field :is(input, select, textarea),
.jx-next.future-site .feedback-grid :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
  min-height: 52px;
  max-width: 100%;
  padding: 13px 15px;
  border: 1px solid var(--nx-line-strong);
  border-radius: 8px;
  background-color: var(--nx-paper);
  color: var(--nx-ink);
  font: 500 16px/1.5 Manrope, Arial, sans-serif;
  box-shadow: none;
}
.jx-next.future-site .select { padding-right: 42px; }
.jx-next.future-site :is(.input, .textarea)::placeholder,
.jx-next.future-site .demo-dialog__field :is(input, textarea)::placeholder { color: var(--nx-muted); opacity: 1; }
.jx-next.future-site :is(.input, .select, .textarea):focus,
.jx-next.future-site .demo-dialog__field :is(input, select, textarea):focus { border-color: var(--nx-accent); background-color: var(--nx-surface); box-shadow: 0 0 0 3px var(--nx-soft); }
.jx-next.future-site :is(.checkbox, .demo-dialog__form .checkbox) { color: var(--nx-muted); font-size: 13px; line-height: 1.65; }
.jx-next.future-site .demo-dialog__products label { color: var(--nx-ink); min-height: 34px; }
.jx-next.future-site .demo-dialog__products label span { font-size: 13px; line-height: 1.55; }
body.jx-next.future-page :is(.buy-consent, .buy-otp__form, .buy-safety-note) { background: var(--nx-paper); border-color: var(--nx-line); border-radius: 10px; }
body.jx-next.future-page .buy-form-section legend { color: var(--nx-ink); }
body.jx-next.future-page .pricing-summary { top: calc(var(--nx-header-height) + 24px); }
body.jx-next.future-page .phone-prefix-control { background: var(--nx-soft); border-color: var(--nx-line-strong); border-radius: 8px; }
body.jx-next.future-page .phone-prefix-control > span { color: var(--nx-ink); }
body.jx-next.future-page .multi-select__menu { background: var(--nx-surface); border-color: var(--nx-line-strong); }
body.jx-next.future-page .multi-select__option { color: var(--nx-ink); }

body.jx-next.future-page .faq-group__title { padding: 24px 28px; border-radius: 12px; background: var(--nx-surface); color: var(--nx-accent); border-color: var(--nx-line); }
body.jx-next.future-page .faq__q { min-height: 76px; padding-block: 24px; font-weight: 600; color: var(--nx-ink); }
body.jx-next.future-page .faq__item[open] .faq__q { color: var(--nx-accent); }
body.jx-next.future-page .faq__a { max-width: 74ch; padding-bottom: 30px; font-size: 16px; color: var(--nx-muted); line-height: 1.85; }
body.jx-next.future-page .prose { max-width: 72ch; }
body.jx-next.future-page .prose :is(p, li) { font-size: 17px; line-height: 1.85; }
body.jx-next.future-page .prose h2 { font-weight: 600; letter-spacing: -.03em; }
body.jx-next.future-page .compare-table { background: var(--nx-surface); color: var(--nx-ink); border-radius: 12px; }
body.jx-next.future-page .compare-table thead th { background: var(--nx-soft); color: var(--nx-accent); }
body.jx-next.future-page .compare-table tbody :is(td, th) { color: var(--nx-ink); border-color: var(--nx-line); }
body.jx-next.future-page .compare-table tbody th { background: var(--nx-surface); }

/* Global dialogs and footer retain all original markup and action hooks. */
.jx-next.future-site dialog {
  padding: clamp(28px, 4vw, 52px);
  border: 1px solid var(--nx-line-strong);
  border-radius: 20px;
  background: var(--nx-surface);
  color: var(--nx-ink);
  max-height: calc(100svh - 32px);
  box-shadow: 0 30px 100px #21081140;
}
.jx-next.future-site dialog::backdrop { background: #210811a6; backdrop-filter: blur(8px); }
.jx-next.future-site .dialog-close { top: 16px; right: 16px; width: 44px; height: 44px; border-color: var(--nx-line-strong); background: var(--nx-paper); color: var(--nx-ink); }
.jx-next.future-site :is(.contact-dialog, .index-dialog, .demo-dialog) h2 { margin-top: 24px; font-size: clamp(38px, 5vw, 64px); letter-spacing: -.06em; line-height: 1.04; font-weight: 600; }
.jx-next.future-site .index-columns { gap: 30px; }
.jx-next.future-site .index-columns :is(a, button) { min-height: 36px; font-size: 14px; line-height: 1.6; color: var(--nx-ink); }
.jx-next.future-site .index-columns > div > span { color: var(--nx-muted); font-size: 10px; }
.jx-next.future-site .contact-methods { gap: 28px; padding-block: 26px; }
.jx-next.future-site .contact-methods > div > span { color: var(--nx-muted); font-size: 10px; }
.jx-next.future-site .contact-methods a { overflow-wrap: anywhere; }
.jx-next.future-site .contact-dialog address { color: var(--nx-muted); font-size: 13px; }
.jx-next.future-site .contact-dialog address b { color: var(--nx-ink); }
.jx-next.future-site :is(.complaint-dialog .complaint-dialog__lead, .contact-complaint-note > p, .complaint-box .form-note, .complaint-box .field__hint) { color: var(--nx-muted); }
.jx-next.future-site .contact-complaint-note > :is(span, b) { color: var(--nx-ink); }
.jx-next.future-site .demo-dialog__intro > p:not(.tiny-label) { color: var(--nx-muted); font-size: 14px; }
.jx-next.future-site .page-contact-end { padding: clamp(64px, 7vw, 108px) max(7%, calc((100% - 1240px) / 2)) 68px; background: var(--nx-wine); color: #f7f2e9; }
.jx-next.future-site .page-contact-end h2 { max-width: 20ch; font-size: clamp(40px, 5.8vw, 80px); line-height: 1.03; font-weight: 600; letter-spacing: -.06em; }
.jx-next.future-site .page-contact-end .tiny-label { color: #edccae; }
.jx-next.future-site .site-footer { padding: 52px max(7%, calc((100% - 1240px) / 2)) calc(124px + env(safe-area-inset-bottom, 0px)); background: #32131f; border-color: #825366; color: #f7f2e9; }
.jx-next.future-site .site-footer__grid { gap: 36px; }
.jx-next.future-site :is(.site-footer__col > span, .site-footer__brand p, .site-footer__brand small, .site-footer__bar) { color: #d8c4cd; }
.jx-next.future-site .site-footer__bar { margin-top: 42px; border-color: #6b4253; }
.jx-next.future-site .site-footer__brand > a > span { font-family: 'Space Grotesk', Arial, sans-serif; font-weight: 600; letter-spacing: -.04em; }

/* Preserve dock links, ordering, responsive visibility and all JS hooks. */
.jx-next.future-site .explore-dock { bottom: calc(20px + env(safe-area-inset-bottom, 0px)); padding: 7px; gap: 2px; background: #4c1229; border: 1px solid #93576f; color: #f7f2e9; box-shadow: 0 10px 36px #32131f2e; }
.jx-next.future-site .explore-dock > a { min-height: 44px; padding: 13px 15px; font-size: 12px; line-height: 1.5; }
.jx-next.future-site .explore-dock > a:hover,
.jx-next.future-site .explore-dock > a.is-current { background: #ffffff16; }
.jx-next.future-site .explore-dock .dock-demo { margin-left: 5px; padding: 13px 20px; background: #f7f2e9; color: #650d2d; }
.jx-next.future-site .explore-dock .dock-demo:hover { background: #edccae; }
.jx-next.future-site .dock-index { min-width: 44px; min-height: 44px; }
.jx-next.future-site :is(.explore-dock, .site-footer, .page-contact-end) :is(a, button):focus-visible { outline-color: #f7f2e9; }

/* The policy script continues to recognise all seven destinations, including
   fragments and dynamically inserted links. Surfaces control the ink. */
.jx-next :is(.site-footer, .page-contact-end, .contact-finale, .band--wine:not(.page-hero), .band--deep:not(.page-hero), [data-policy-surface="dark"]) { --jp-policy-link-color: #f7f2e9; }
.jx-next :is(dialog, [data-policy-surface="light"]) { --jp-policy-link-color: #650d2d; }
html[data-theme="dark"] .jx-next :is(dialog, .card, .form-card, .feedback-form, .pricing-summary, .pricing-success, .quote-card, .download-card, .catalogue-download-card) { --jp-policy-link-color: #f7f2e9; }
html body.jx-next a[href="/contact-consent"],
html body.jx-next a.jp-policy-link,
html body.jx-next a.jp-policy-link:is(:link, :visited, :hover, :focus, :active) {
  color: var(--jp-policy-link-color) !important;
  text-decoration: none !important;
}

/* Dark overrides match legacy specificity while keeping surfaces warm. */
html[data-theme="dark"] body.jx-next.future-page .band { background: var(--nx-paper); }
html[data-theme="dark"] body.jx-next.future-page :is(.band--cream, .band--soft) { background: var(--nx-soft); }
html[data-theme="dark"] body.jx-next.future-page :is(.band--wine, .band--deep):not(.page-hero) { background: var(--nx-wine); }
html[data-theme="dark"] body.jx-next.future-page .band.page-hero { background: var(--nx-paper); color: var(--nx-ink); }
html[data-theme="dark"] body.jx-next.future-page :is(.card, .form-card, .feedback-form, .pricing-summary, .pricing-success, .quote-card, .download-card, .catalogue-download-card, .about-build__card, .about-fact) { background: var(--nx-surface); border-color: var(--nx-line); color: var(--nx-ink); }
html[data-theme="dark"] body.jx-next.future-page .page-hero a.button-primary,
html[data-theme="dark"] body.jx-next.future-page .band .button-primary { background: var(--nx-accent); border-color: var(--nx-accent); color: var(--nx-on-accent) !important; }
html[data-theme="dark"] .jx-next.future-site .jx-site-header :is(.floating-brand, .corner-phone, .corner-email, .theme-toggle, .jx-motion-toggle) { background: transparent; color: var(--nx-ink); border-color: var(--nx-line); }
html[data-theme="dark"] .jx-next.future-site .jx-site-header :is(.corner-phone, .corner-email, .theme-toggle, .jx-motion-toggle):hover { background: var(--nx-soft); }
html[data-theme="dark"] .jx-next.future-site .jx-site-header .contact-trigger { background: var(--nx-accent); color: var(--nx-on-accent); border-color: var(--nx-accent); }
html[data-theme="dark"] .jx-next.future-site dialog { background: var(--nx-surface); color: var(--nx-ink); border-color: var(--nx-line-strong); }
html[data-theme="dark"] .jx-next.future-site .explore-dock { background: #4c1229; border-color: #93576f; }
html[data-theme="dark"] .jx-next.future-site .explore-dock .dock-demo { background: #f7f2e9; color: #650d2d; }
html[data-theme="dark"] .jx-next.future-site :is(.input, .select, .textarea, .multi-select > summary),
html[data-theme="dark"] .jx-next.future-site .demo-dialog__field :is(input, select, textarea) { background-color: var(--nx-paper); color: var(--nx-ink); border-color: var(--nx-line-strong); }
html[data-theme="dark"] body.jx-next.future-page :is(.page-title, .field__label, .card__title, .form-card__head h2, .buy-form-section legend) { color: var(--nx-ink); }
html[data-theme="dark"] body.jx-next.future-page :is(.page-hero .lead, .section-lead, .card .card__text, .card .card__text a, .form-card__head .small, .field__hint, .form-note) { color: var(--nx-muted); }
html[data-theme="dark"] body.jx-next.future-page :is(.band--wine, .band--deep):not(.page-hero) :is(.section-lead, .cta-band__text) { color: #e2cfd7; }

@media (min-width: 1500px) {
  .jx-next .jx-site-header .corner-phone { width: auto; padding-inline: 13px; }
  .jx-next .jx-site-header .corner-phone > span { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip-path: none; }
}
@media (max-width: 1180px) {
  body.future-site.jx-next { --nx-header-height: 134px; }
  .jx-next .jx-header-inner { grid-template-columns: auto 1fr; gap: 0 20px; padding-top: 12px; }
  .jx-next .jx-site-header .contact-corner { justify-self: end; }
  .jx-next .jx-primary-nav { grid-column: 1 / -1; grid-row: 2; margin-top: 10px; padding-block: 5px; border-top: 1px solid var(--nx-line); }
  .jx-next .jx-primary-nav a { padding-inline: 22px; }
  .jx-next .chapter-rail { opacity: 0; }
  .jx-next.future-site .explore-dock > a { padding-inline: 12px; }
  .jx-next.future-site .site-footer__grid { grid-template-columns: 1.3fr 1fr; }
}
@media (max-width: 760px) {
  body.jx-next.future-page { --gutter: 24px; --band-y: 64px; --band-y-tight: 42px; --space-card: 25px; --space-grid: 22px; }
  .jx-next .jx-header-inner { width: calc(100% - 40px); }
  .jx-next .jx-primary-nav { justify-content: space-between; gap: 0; }
  .jx-next .jx-primary-nav a { padding-inline: 12px; font-size: 13px; }
  body.jx-next.future-page .page-title { font-size: clamp(39px, 8vw, 60px); }
  body.jx-next.future-page .page-hero__grid { row-gap: 38px; }
  body.jx-next.future-page .section-title { font-size: clamp(30px, 6vw, 40px); }
  .jx-next.future-site dialog { padding: 54px 24px 30px; border-radius: 16px; max-width: calc(100vw - 24px); }
  .jx-next.future-site .index-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 20px; }
  .jx-next.future-site .index-columns > div:last-child { grid-column: auto; }
  .jx-next.future-site .contact-methods { grid-template-columns: 1fr; }
  .jx-next.future-site .contact-bottom { grid-template-columns: 1fr; gap: 20px; }
  .jx-next.future-site .contact-dialog .contact-bottom address { padding-right: 0; }
  .jx-next.future-site .contact-complaint-note { padding-left: 0; border-left: 0; }
  .jx-next.future-site .explore-dock { bottom: calc(12px + env(safe-area-inset-bottom, 0px)); max-width: calc(100vw - 20px); padding: 5px; gap: 0; }
  .jx-next.future-site .explore-dock > a { padding: 12px 9px; font-size: 11px; }
  .jx-next.future-site .explore-dock .dock-demo { padding: 12px; margin-left: 3px; font-size: 11px; }
  .jx-next.future-site .dock-index { padding: 13px; }
  /* Like Mail login and Partner, Docs stays in the full index on phones. */
  .jx-next.future-site .explore-dock [data-dock="docs"] { display: none; }
  .jx-next.future-site .site-footer { padding-inline: 24px; }
  .jx-next.future-site .site-footer__grid { gap: 32px 24px; }
}
@media (max-width: 640px) {
  body.future-site.jx-next { --nx-header-height: 125px; }
  .jx-next .jx-header-inner { width: calc(100% - 28px); gap: 0 8px; padding-top: 10px; }
  .jx-next .jx-site-header .floating-brand { gap: 7px; }
  .jx-next .jx-site-header .floating-brand img { width: 35px; height: 35px; }
  .jx-next .jx-site-header .floating-brand > span { font-size: 20px; }
  .jx-next .jx-site-header .floating-brand small { font-size: 6px; letter-spacing: .1em; }
  .jx-next .jx-site-header .contact-corner { gap: 5px; }
  .jx-next .jx-site-header .contact-trigger { width: 44px; height: 44px; min-height: 44px; padding: 0; justify-content: center; }
  .jx-next .jx-site-header .contact-trigger > span:last-child { margin: 0; font-size: 22px; }
  .jx-next .jx-site-header .contact-trigger :is(.availability-dot, .jx-contact-label) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .jx-next .jx-site-header .jx-motion-toggle { position: absolute; right: 0; bottom: 6px; width: 40px; height: 40px; min-height: 40px; }
  .jx-next .jx-primary-nav { padding-right: 48px; margin-top: 8px; }
  .jx-next .jx-primary-nav a { min-height: 44px; padding-inline: 8px; font-size: 12px; }
}
@media (max-width: 420px) {
  body.jx-next.future-page { --gutter: 20px; }
  .jx-next .jx-header-inner { width: calc(100% - 24px); }
  .jx-next .jx-site-header .floating-brand img { width: 32px; height: 32px; }
  .jx-next .jx-site-header .floating-brand > span { font-size: 18px; }
  .jx-next .jx-site-header .contact-corner { gap: 4px; }
  .jx-next .jx-site-header :is(.corner-phone, .corner-email, .theme-toggle, .contact-trigger) { width: 40px; height: 40px; min-height: 40px; }
  .jx-next .jx-primary-nav a { padding-inline: 5px; font-size: 12px; }
  .jx-next.future-site .explore-dock > a { padding-inline: 4px; font-size: 10px; }
  .jx-next.future-site .explore-dock .dock-demo { padding-inline: 8px; font-size: 10px; }
  .jx-next.future-site .dock-index { min-width: 34px; padding-inline: 8px; }
  .jx-next.future-site .site-footer__grid { grid-template-columns: 1fr; }
  .jx-next.future-site .index-columns { gap: 24px 14px; }
  .jx-next.future-site .index-columns :is(a, button) { font-size: 13px; }
}
@media (max-width: 360px) {
  .jx-next .jx-primary-nav a { padding-inline: 2px; }
}
@media (max-width: 340px) {
  /* The full index retains Blog; keep the primary dock within narrow screens. */
  .jx-next.future-site .explore-dock [data-dock="blog"] { display:none; }
  .jx-next.future-site .explore-dock > a { padding-inline:3px; font-size:9px; }
  .jx-next.future-site .explore-dock .dock-demo { padding-inline:5px; font-size:9px; }
  .jx-next.future-site .explore-dock .dock-index { min-width:30px; padding-inline:5px; }
}
@media (prefers-reduced-motion: reduce) {
  .jx-next :is(.jx-primary-nav a, .jx-site-header button, .jx-site-header a, .button, .future-button) { transition: none; }
}
@media print {
  .jx-next .jx-site-header { position: static; }
  html body.jx-next a.jp-policy-link { color: #650d2d !important; }
}
/* Contact-first header requested for the redesign. Full details stay visible. */
/* Keep compact assistant typography independent of editorial page headings. */
body.jx-next #connectx-widget { --cx-wine:#650d2d; --cx-line:var(--nx-line); z-index:100; }
body.jx-next #connectx-widget .cx-panel { border-color:var(--nx-line); }
body.jx-next #connectx-widget .cx-head { flex:none; gap:10px; padding:14px 12px 14px 18px; }
body.jx-next #connectx-widget .cx-head>img { width:40px; height:28px; object-fit:contain; }
body.jx-next #connectx-widget .cx-head>div { flex:1; min-width:0; }
body.jx-next #connectx-widget #cx-title { font:700 17px/1.3 var(--f-font-body,Lato,Arial,sans-serif); letter-spacing:-.2px; margin:0; color:#fff2ce; text-wrap:balance; }
body.jx-next #connectx-widget .cx-head p { margin:4px 0 0; font-size:11px; line-height:1.5; color:#ead4db; }
body.jx-next #connectx-widget .cx-close { flex:0 0 44px; width:44px; height:44px; display:grid; place-items:center; padding:0; margin:0; }
body.jx-next #connectx-widget :is(.cx-enquiry,.cx-success) h3 { font:700 22px/1.25 var(--f-font-body,Lato,Arial,sans-serif); letter-spacing:-.5px; margin:16px 0 10px; color:var(--nx-ink); }
body.jx-next #connectx-widget .cx-intro { font-size:16px; line-height:1.5; margin:0 0 15px; }
body.jx-next #connectx-widget :is(.cx-body,.cx-compose,.cx-footnote) { background:var(--nx-surface); color:var(--nx-ink); }
body.jx-next #connectx-widget .cx-compose { flex:none; }
body.jx-next #connectx-widget .cx-compose button { flex:0 0 44px; min-height:44px; }
body.jx-next #connectx-widget .cx-footnote { flex:none; font-size:10px; line-height:1.5; color:var(--nx-muted); }
body.jx-next #connectx-widget .cx-error { font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
body.jx-next #connectx-widget :is(.cx-topics,.cx-products) button { min-height:36px; }
@media(max-width:760px) {
  body.jx-next #connectx-widget .cx-panel { left:auto; right:12px; width:min(390px,calc(100% - 24px))!important; bottom:96px!important; height:min(680px,calc(100dvh - 120px)); max-height:calc(100dvh - 120px)!important; }
}
@media(max-width:370px) {
  body.jx-next #connectx-widget .cx-head { padding:10px; gap:7px; }
  body.jx-next #connectx-widget .cx-head>img { width:30px; }
  body.jx-next #connectx-widget #cx-title { font-size:16px; }
}
@media(max-height:500px) {
  body.jx-next #connectx-widget .cx-panel { top:10px; bottom:10px!important; height:auto; max-height:calc(100dvh - 20px)!important; }
}
body.future-site.jx-next{--nx-header-height:88px}
.jx-next .jx-header-inner{padding-block:0;gap:24px}
.jx-next .jx-site-header .contact-corner{justify-self:end;justify-content:flex-end}
.jx-next .jx-header-tools{display:flex;align-items:center;gap:8px}
.jx-next .jx-site-header :is(.corner-phone,.corner-email){width:auto;padding-inline:13px}
.jx-next .jx-site-header :is(.corner-phone,.corner-email)>span{position:static;display:inline;width:auto;height:auto;margin:0;padding:0;overflow:visible;clip-path:none;white-space:nowrap}
.jx-next .jx-site-header .jx-motion-toggle{position:relative;inset:auto;width:44px;height:44px;min-height:44px}
@media(max-width:900px){
  body.future-site.jx-next{--nx-header-height:132px}
  .jx-next .jx-header-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:calc(100% - 32px);min-height:0;padding-block:12px;gap:10px}
  .jx-next .jx-site-header .contact-corner{display:contents}
  .jx-next .jx-site-header .floating-brand{grid-area:1/1;min-width:0}
  .jx-next .jx-header-tools{grid-area:1/2;justify-self:end;gap:6px}
  .jx-next .jx-site-header .corner-phone{grid-area:2/1}
  .jx-next .jx-site-header .corner-email{grid-area:2/2}
  .jx-next .jx-site-header :is(.corner-phone,.corner-email){width:100%;min-width:0;font-size:12px;padding-inline:8px;gap:7px}
  .jx-next .jx-site-header :is(.corner-phone,.corner-email) svg{width:16px;height:16px;flex-shrink:0}
  .jx-next .jx-site-header .contact-trigger{width:44px;height:44px;min-height:44px;padding:0;justify-content:center}
  .jx-next .jx-site-header .contact-trigger :is(.availability-dot,.jx-contact-label){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .jx-next .jx-site-header .contact-trigger>span:last-child{margin:0;font-size:22px}
}
@media(max-width:370px){
  .jx-next .jx-header-inner{width:calc(100% - 24px);gap:8px}
  .jx-next .jx-header-tools{gap:4px}
  .jx-next .jx-site-header :is(.corner-phone,.corner-email){font-size:11px;padding-inline:5px;gap:5px}
  .jx-next .jx-site-header :is(.theme-toggle,.jx-motion-toggle,.contact-trigger){width:40px;min-height:40px;height:40px}
}

/* Service icons shared with the homepage hero (includes/service-icons.php).
   ConnectX and JPRAXC are their mono glyphs, tinted with the text colour. */
.jx-service-icon{flex:none;overflow:visible}
.jx-glyph{display:inline-block;width:1.75em;height:1em;background:currentColor;-webkit-mask:var(--jx-glyph) center/contain no-repeat;mask:var(--jx-glyph) center/contain no-repeat}
.jx-glyph--connectx{--jx-glyph:url("/assets/images/jpraxc-connectx-glyph-96.png?v=mono1")}
.jx-glyph--jpraxc{--jx-glyph:url("/assets/images/jpraxc-glyph-96.png?v=mono1")}
/* The hero draws on a 32-unit grid; beside 24-unit icons the line keeps their weight. */
.card__icon.jx-service-icon:not(.jx-glyph){stroke-width:2.2}
.jx-next .jx-site-header .corner-email svg.jx-service-icon{stroke-width:2.1}
.jx-next .nx-service-icon .jx-service-icon{width:26px;height:26px}
.jx-next .nx-service-icon .jx-glyph{width:34px}
.blog-orbit>b .jx-service-icon{width:28px;height:28px}
body.future-page .about-orbit__node .jx-service-icon{width:24px;height:24px;color:inherit}
body.future-page .about-orbit__node .jx-glyph{width:30px;height:20px}
/* The Live Classes module card's "Ask about plans" link sits in the card's own margins. */
.module--illustrated .module__link{align-self:flex-start;justify-content:flex-start;gap:8px;margin:0 22px;font-size:13px}
/* Mobile app catalogue in two rows: the three School ERP apps, then Business E-mail and Partner. */
.jx-next .mobile-catalogue .mobile-catalogue-group{margin:0 0 16px}
.jx-next .mobile-catalogue .mobile-catalogue-grid+.mobile-catalogue-group{margin-top:44px}
.jx-next .mobile-catalogue .mobile-catalogue-grid.mobile-catalogue-grid--school{grid-template-columns:repeat(3,minmax(0,1fr))}
.jx-next .mobile-catalogue .mobile-catalogue-grid.mobile-catalogue-grid--business{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:960px){.jx-next .mobile-catalogue .mobile-catalogue-grid.mobile-catalogue-grid--school{grid-template-columns:1fr}}
@media(max-width:640px){.jx-next .mobile-catalogue .mobile-catalogue-grid.mobile-catalogue-grid--business{grid-template-columns:1fr}}
/* site.css clips sideways overflow with overflow-x:hidden on html and body. On body that
   makes its own scroll box, so the sticky header scrolled away on every page but home.
   clip keeps the clipping without the scroll box. Docs keep their own layout. */
body.jx-next:not(.page-docs){overflow-x:clip}
/* The header has no band of its own (owner, 30 Sep 2026): no background, no bottom rule. */
.jx-next .jx-site-header{background:transparent;border-bottom-color:transparent}
/* Floating pills: only the header's own pieces carry a background, so they stay readable
   over the page while the header is pinned. Hover colours (more specific) still apply. */
.jx-next .jx-site-header :is(.floating-brand,.corner-phone,.corner-email,.theme-toggle,.jx-motion-toggle){background:var(--nx-paper)}
html[data-theme="dark"] .jx-next.future-site .jx-site-header :is(.floating-brand,.corner-phone,.corner-email,.theme-toggle,.jx-motion-toggle){background:var(--nx-paper)}
.jx-next .jx-site-header .floating-brand{border:1px solid var(--nx-line);border-radius:12px;padding:4px 14px 4px 4px}

/* Lossless image sources retain the existing layout and PNG fallback. */
.public-picture{display:contents}
.site-footer__privacy{color:inherit;text-underline-offset:4px;line-height:1.6;min-height:44px;display:inline-flex;align-items:center}
.site-footer__privacy:focus-visible{outline:2px solid currentColor;outline-offset:4px}