/* JPRAXC / public content and connected services.
   Load after next-products.css and before next-forms.css.
   Native nesting keeps every shared rule inside the explicit page allowlist
   AND #main. No homepage, ERP/catalogue, demo-directory, shell, popup or
   form-control rules. next-forms.css owns the complete demo directory. */
body.jx-next:is(.page-about, .page-faq, .page-blog, .page-testimonials,
  .page-privacy, .page-terms, .page-refund, .page-legal, .page-deployments,
  .page-partners, .page-partner-apply, .page-download, .page-not-found,
  .page-website-service, .page-mail-service, .page-connectx-service,
  .page-whatsapp-service, .page-sms-service, .page-payment-service) #main {
  --nc-paper: var(--nx-paper, #f7f2e9);
  --nc-ink: var(--nx-ink, #32131f);
  --nc-muted: var(--nx-muted, #71616a);
  --nc-line: var(--nx-line, #d9cec0);
  --nc-soft: var(--nx-soft, #eee6dd);
  --nc-raised: var(--nx-surface, #fffdf8);
  --nc-accent: var(--nx-accent, #650d2d);
  --nc-gold: #b88442;
  --nc-display: 'Space Grotesk', Arial, sans-serif;
  --nc-width: 1320px;
  --nc-gutter: 56px;
  color: var(--nc-ink);
  background: var(--nc-paper);

  & > .band { padding-block: clamp(70px, 7.6vw, 110px); }
  & .container { width: min(var(--nc-width), calc(100% - var(--nc-gutter) * 2)); max-width: none; margin-inline: auto; }
  & .container--narrow { max-width: 1080px; }
  & .container--prose { max-width: 1080px; }
  & > :is(.band--paper, .band--wine, .band--deep) {
    --text: var(--nc-ink); --text-soft: var(--nc-muted); --text-muted: var(--nc-muted);
    --line: var(--nc-line); --line-2: var(--nc-line); --line-strong: var(--nc-line);
    --jp-policy-link-color: var(--nc-accent);
    color: var(--nc-ink); background: var(--nc-paper);
  }
  & > .band--cream { color: var(--nc-ink); background: var(--nc-soft); }
  & > :is(.band--grid, .band--mesh)::before,
  & > :is(.band--grid, .band--mesh)::after { background: none; }
  & > .band + .band { border-top: 1px solid var(--nc-line); }

  & > .band.page-hero {
    padding-top: clamp(34px, 4vw, 64px);
    padding-bottom: clamp(68px, 7vw, 108px);
    min-height: 0;
    border-bottom: 1px solid var(--nc-line);
    background: var(--nc-paper);
    color: var(--nc-ink);
  }
  & > .page-hero + .band { border-top: 0; }
  & .breadcrumb { margin-bottom: clamp(35px, 4vw, 58px); flex-wrap: wrap; gap: 9px 14px; }
  & .breadcrumb__item { color: var(--nc-muted); font-size: 11px; line-height: 1.6; }
  & .breadcrumb__item.is-current { color: var(--nc-ink); }
  & .page-title {
    max-width: 19ch;
    margin: 22px 0 28px;
    color: var(--nc-ink);
    font: 500 clamp(48px, 6.3vw, 96px)/1.04 var(--nc-display);
    letter-spacing: -.06em;
    text-wrap: balance;
  }
  & .page-hero .lead { max-width: 64ch; color: var(--nc-muted); font-size: clamp(16px, 1.4vw, 19px); line-height: 1.85; }
  & :is(.eyebrow, .section-num, .tiny-label) { color: var(--nc-accent); font: 700 10px/1.7 Manrope, Arial, sans-serif; letter-spacing: .13em; }
  & .hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 32px; }
  & .hero__micro { max-width: 66ch; color: var(--nc-muted); font-size: 11px; line-height: 1.8; margin-top: 24px; }
  & :is(a.button, span.button, a.future-button) { min-height: 48px; padding: 15px 20px; border-radius: 5px; font: 700 12px/1.55 Manrope, Arial, sans-serif; white-space: normal; text-align: left; }
  /* Existing shared button colours use !important; keep their contrast when
     a legacy wine band becomes a paper reading surface. */
  & :is(a.button-primary, a.future-button) { background: var(--nc-accent); border-color: var(--nc-accent); color: var(--nx-on-accent, #fff8ed) !important; box-shadow: none; }
  & :is(a.button-outline-light, a.button-light) { background: transparent; color: var(--nc-accent) !important; border: 1px solid var(--nc-line); box-shadow: none; }
  & :is(a.link-arrow, a.text-link) { color: var(--nc-accent); font-size: 12px; }
  & a:focus-visible { outline: 2px solid var(--nc-accent); outline-offset: 5px; }
  & .section-head { max-width: 960px; margin-bottom: 48px; }
  & .section-title { max-width: 25ch; margin-block: 18px 24px; color: var(--nc-ink); font: 500 clamp(34px, 4.25vw, 64px)/1.1 var(--nc-display); letter-spacing: -.05em; text-wrap: balance; }
  & .section-lead { max-width: 66ch; color: var(--nc-muted); font-size: 15px; line-height: 1.85; }
  & .card { min-width: 0; padding: 30px; background: var(--nc-raised); border: 1px solid var(--nc-line); border-radius: 7px; box-shadow: none; }
  & .card::before { background: none; }
  & .card:hover { box-shadow: none; transform: none; border-color: var(--nc-line); }
  & .card__head { align-items: flex-start; }
  & .card__title { color: var(--nc-ink); font: 500 clamp(23px, 2.2vw, 31px)/1.2 var(--nc-display); letter-spacing: -.035em; }
  & :is(.card__text, .card__meta, .outcome-list) { color: var(--nc-muted); font-size: 14px; line-height: 1.85; }
  & .card__icon-tile { flex-shrink: 0; width: 40px; height: 40px; border-radius: 6px; background: var(--nc-soft); color: var(--nc-accent); border: 1px solid var(--nc-line); box-shadow: none; }
  & :is(.card__foot, .outcome-list__item) { border-color: var(--nc-line); }
  & .context-card__heading { color: var(--nc-ink); font-family: var(--nc-display); font-weight: 500; letter-spacing: -.035em; }
  & .tag { border-radius: 4px; background: transparent; color: var(--nc-accent); border-color: var(--nc-line); font-size: 10px; line-height: 1.7; }
  & .anchor-nav { background: var(--nc-paper); border-block: 1px solid var(--nc-line); box-shadow: none; }
  & .anchor-nav__inner { gap: 12px 30px; flex-wrap: wrap; }
  & .anchor-nav__link { padding-block: 18px; color: var(--nc-muted); font-size: 12px; }
  & .anchor-nav__link:is(:hover, .is-active) { color: var(--nc-accent); }
  & :is(.step__title, .empty-state__title) { color: var(--nc-ink); font: 500 26px/1.2 var(--nc-display); letter-spacing: -.04em; }
  & :is(.step__text, .empty-state__text) { color: var(--nc-muted); line-height: 1.85; }
  & .step__num { background: transparent; color: var(--nc-accent); border: 1px solid var(--nc-line); border-radius: 5px; box-shadow: none; font: 500 22px/1 var(--nc-display); }
  & .timeline__line { background: var(--nc-line); }
  & > .cta-band { --jp-policy-link-color: #f7f2e9; background: #4a0c26; color: #f7f2e9; border-top: 0; }
  & .cta-band__inner { gap: 42px; align-items: center; }
  & .cta-band__title { max-width: 22ch; color: #f7f2e9; font: 500 clamp(36px, 4.8vw, 70px)/1.08 var(--nc-display); letter-spacing: -.05em; }
  & .cta-band__text { max-width: 66ch; color: #dfcbd1; font-size: 14px; line-height: 1.85; }
  & .cta-band :is(a.button-primary, a.button-outline-light) { border-color: #d4b38d; color: #f7f2e9 !important; }
  & .cta-band a.button-primary { color: #42192a !important; background: #ecd8b9; }
  & .cta-band a:not(.button) { color: #f1d7b5; }
  & :is(.cta-band, .blog-jpraxc, .blog-index-cta) a:focus-visible { outline-color: #ecd8b9; }

  @media (max-width: 1000px) {
    --nc-gutter: 32px;
    & .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    & .cta-band__inner { flex-wrap: wrap; }
  }
  @media (max-width: 620px) {
    --nc-gutter: 20px;
    & > .band { padding-block: 62px; }
    & > .band.page-hero { padding-top: 28px; padding-bottom: 56px; }
    & .page-title { font-size: clamp(40px, 10.5vw, 64px); letter-spacing: -.055em; overflow-wrap: break-word; }
    & .breadcrumb { margin-bottom: 34px; }
    & .section-head { margin-bottom: 32px; }
    & :is(.grid--2, .grid--3, .grid--4, .steps--4, .steps--5) { grid-template-columns: minmax(0, 1fr); }
    & .card { padding: 24px; }
    & .hero__actions { align-items: stretch; gap: 12px; }
    & .hero__actions :is(a.button, span.button) { width: 100%; justify-content: space-between; }
    & .cta-band__actions { width: 100%; min-width: 0; }
    & .cta-band__actions .button { width: 100%; }
  }
}

/* Connected services: retain the supplied overview, arranged as a diagram
   of four connected areas. Decoration carries no product claims. */
body.jx-next:is(.page-website-service, .page-mail-service, .page-connectx-service,
  .page-whatsapp-service, .page-sms-service) #main {
  & .page-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(40px, 5vw, 78px); align-items: center; }
  & :is(.hero__copy, .hero__visual) { min-width: 0; }
  & .hero__visual { padding-top: 54px; }
  & .page-title { font-size: clamp(48px, 5.35vw, 82px); max-width: 15ch; }
  & .product-page__logo { display: block; width: 82px; height: 82px; object-fit: contain; margin: 0 0 24px; filter: none; }
  & .web-hero-panel { position: relative; isolation: isolate; padding: clamp(26px, 3.1vw, 46px); border: 1px solid var(--nc-line); border-radius: 8px; background: var(--nc-soft); color: var(--nc-ink); box-shadow: 10px 12px 0 color-mix(in srgb, var(--nc-gold) 12%, transparent); overflow: hidden; }
  & .web-hero-panel::before { content: ''; position: absolute; z-index: -1; width: 230px; height: 230px; right: -145px; top: -155px; border: 28px solid color-mix(in srgb, var(--nc-gold) 18%, transparent); border-radius: 50%; pointer-events: none; }
  & .web-hero-panel__eyebrow { color: var(--nc-accent); font-size: 9px; font-weight: 700; letter-spacing: .11em; line-height: 1.7; }
  & .web-hero-panel h2 { margin: 22px 0; max-width: 22ch; color: var(--nc-ink); font: 500 clamp(28px, 2.7vw, 40px)/1.14 var(--nc-display); letter-spacing: -.045em; }
  & .web-hero-panel > p:not(.web-hero-panel__eyebrow) { color: var(--nc-muted); font-size: 13px; line-height: 1.85; }
  & .web-hero-panel__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-top: 30px; border-block: 1px solid var(--nc-line); }
  & .web-hero-panel__item { min-width: 0; padding: 21px 14px 21px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  & .web-hero-panel__item:nth-child(even) { padding-left: 18px; border-left: 1px solid var(--nc-line); }
  & .web-hero-panel__item:nth-child(n+3) { border-top: 1px solid var(--nc-line); }
  & .web-hero-panel__item strong { display: block; margin-bottom: 9px; color: var(--nc-ink); font: 500 22px/1.2 var(--nc-display); letter-spacing: -.035em; }
  & .web-hero-panel__item span { color: var(--nc-muted); font-size: 11px; line-height: 1.8; }
  & .grid--4 { gap: 0 28px; }
  & .grid--4 > .card { padding: 28px 0 34px; border: 0; border-top: 1px solid var(--nc-line); border-radius: 0; background: transparent; }
  & .grid--4 .card__head { display: flex; flex-direction: column; gap: 25px; }
  & .grid--4 .card__title { font-size: 27px; margin-bottom: 16px; }
  & .grid--4 .card__text { font-size: 13px; }
  & .context-card { background: var(--nc-soft); }
  & .context-card__details { border-color: var(--nc-line); }
  & .cta-row { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
  & .cta-row .section-title { max-width: 23ch; }
  & .cta-row > a { flex-shrink: 0; }
  @media (max-width: 900px) {
    & .page-hero__grid { grid-template-columns: 1fr; gap: 40px; }
    & .page-title { max-width: 18ch; }
    & .hero__visual { padding-top: 0; max-width: 720px; }
    & .cta-row { align-items: flex-start; flex-direction: column; }
  }
  @media (max-width: 620px) {
    & .page-title { font-size: clamp(40px, 10.5vw, 64px); }
    & .product-page__logo { width: 68px; height: 68px; }
    & .web-hero-panel { padding: 25px; box-shadow: 6px 7px 0 color-mix(in srgb, var(--nc-gold) 12%, transparent); }
    & .web-hero-panel__item strong { font-size: 20px; }
    & .web-hero-panel__item span { font-size: 12px; }
    & .grid--4 { grid-template-columns: 1fr; }
  }
}

/* Status text and data remain authoritative. Only the badge presentation
   changes; the same readable wine/paper treatment works in either theme. */
body.jx-next:is(.page-website-service, .page-mail-service, .page-connectx-service,
  .page-whatsapp-service, .page-sms-service, .page-payment-service) #main {
  & .availability-badge {
    --status-ink: #650d2d;
    --status-paper: #f7f2e9;
    --status-edge: #b9a08a;
    color: var(--status-ink);
    background: var(--status-paper);
    border: 1px solid var(--status-edge);
    border-radius: 5px;
    min-height: 30px;
    padding: 7px 10px;
    gap: 8px;
    font: 700 10px/1.6 Manrope, Arial, sans-serif;
    letter-spacing: .07em;
    box-shadow: none;
  }
  & .availability-badge::before { width: 5px; height: 5px; flex-basis: 5px; background: currentColor; box-shadow: none; }
}

/* Business Email's app section is a separate included composition. Keep its
   version, platform, account requirements and sync caveats in their markup. */
body.jx-next.page-mail-service #main #business-email-app {
  --ma-text: var(--nc-ink);
  --ma-muted: var(--nc-muted);
  --ma-panel: var(--nc-soft);
  --ma-line: var(--nc-line);
  --ma-accent: var(--nc-accent);
  padding-block: clamp(70px, 7.6vw, 110px);
  padding-inline: max(var(--nc-gutter), calc((100% - var(--nc-width)) / 2));
  border-top: 1px solid var(--nc-line);
  background: var(--nc-paper);
  color: var(--nc-ink);

  & > :is(.mail-app-intro, .mail-app-feature-grid, .mail-app-features-heading, .mail-app-start, .mail-app-sync-note) { max-width: var(--nc-width); margin-inline: auto; }
  & .mail-app-intro { grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr); gap: clamp(36px, 5vw, 72px); }
  & :is(.mail-app-copy, .mail-app-feature) { min-width: 0; }
  & .mail-app-eyebrow { color: var(--nc-accent); font: 700 10px/1.7 Manrope, Arial, sans-serif; letter-spacing: .13em; }
  & h2 { color: var(--nc-ink); font: 500 clamp(36px, 4.25vw, 64px)/1.1 var(--nc-display); letter-spacing: -.05em; }
  & h2 em { color: var(--nc-accent); }
  & h3 { color: var(--nc-ink); font: 500 clamp(29px, 3.3vw, 44px)/1.15 var(--nc-display); letter-spacing: -.045em; }
  & h4 { color: var(--nc-ink); font: 500 25px/1.22 var(--nc-display); letter-spacing: -.035em; }
  & .mail-app-lead { color: var(--nc-muted); font-size: 15px; line-height: 1.85; }
  & .mail-app-webmail { color: var(--nc-accent); border-color: var(--nc-line); font-size: 12px; font-weight: 700; }
  & .mail-app-availability { color: var(--nc-muted); font-size: 10px; font-weight: 700; line-height: 1.8; letter-spacing: .07em; }
  & .mail-app-art { border: 1px solid #d5c3ae; border-radius: 8px; background: #efe4d3; color: #42192a; }
  & .mail-app-orbit { border-color: #b99468; }
  & :is(.mail-app-art-top, .mail-app-art-bottom) { color: #61404b; }
  & .mail-app-letter { border-color: #c5aa87; border-radius: 5px; background: #f7f2e9; color: #650d2d; box-shadow: 0 9px 20px #32131f12; }
  & .mail-app-letter.letter-back { background: #ead5b6; }
  & .mail-app-letter > span { font-family: var(--nc-display); font-weight: 500; }
  & .mail-app-envelope { border-radius: 6px; background: #650d2d; box-shadow: 0 14px 26px #32131f20; }
  & .mail-app-envelope::before { background: #873454; }
  & .mail-app-envelope::after { background: #75233f; }
  & .mail-app-envelope-fold { background: #4a0c26; }
  & .mail-app-seal { background: #d9b27a; color: #650d2d; font-family: var(--nc-display); font-weight: 500; }
  & .mail-app-art-chip { border-color: #c5aa87; border-radius: 5px; background: #f7f2e9; color: #42192a; box-shadow: 5px 7px 0 #b8844212; }
  & .mail-app-art-chip.chip-security { background: #ead5b6; }
  & .mail-app-art-chip svg { stroke: #650d2d; }
  & .mail-app-art-chip strong { font-family: var(--nc-display); font-weight: 500; }
  & .mail-app-features-heading { padding-top: clamp(54px, 6vw, 84px); margin-bottom: 32px; }
  & .mail-app-feature-grid { gap: 0 32px; }
  & .mail-app-feature { border-color: var(--nc-line); }
  & .mail-app-feature-label { gap: 12px; flex-wrap: wrap; color: var(--nc-muted); font-weight: 700; }
  & .mail-app-feature p { color: var(--nc-muted); font-size: 14px; line-height: 1.85; }
  & .mail-app-start { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); padding: clamp(24px, 3vw, 42px); gap: 36px; border: 1px solid var(--nc-line); border-radius: 7px; background: var(--nc-soft); }
  & .mail-app-start li p { color: var(--nc-muted); line-height: 1.85; }
  & .mail-app-start li strong { color: var(--nc-ink); font-weight: 700; }
  & .mail-app-sync-note { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--nc-line); color: var(--nc-muted); font-size: 12px; line-height: 1.85; }

  @media (max-width: 900px) {
    & .mail-app-intro { grid-template-columns: 1fr; gap: 40px; }
    & .mail-app-art { width: 100%; max-width: 520px; margin-inline: auto; }
    & .mail-app-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 760px) { & .mail-app-start { grid-template-columns: 1fr; gap: 28px; } }
  @media (max-width: 620px) {
    padding-block: 62px;
    & .mail-app-feature-grid { grid-template-columns: 1fr; }
  }
}

/* About and its contact destination: editorial introduction, numbered
   principles, existing concept artwork and clearly separated contact roles. */
body.jx-next.page-about #main {
  & .page-hero .page-title { max-width: 22ch; }
  & .about-what__grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(40px, 7vw, 108px); }
  & .about-what__intro { align-self: start; }
  & :is(.about-what__title, .about-foundation__intro h2) { color: var(--nc-ink); font: 500 clamp(38px, 4.6vw, 68px)/1.08 var(--nc-display); letter-spacing: -.055em; }
  & :is(.about-what__eyebrow, .about-foundation__eyebrow, .about-contact-eyebrow) { color: var(--nc-accent); font-size: 10px; letter-spacing: .12em; }
  & :is(.about-what__lead, .about-what__body > p, .about-foundation__intro > p) { color: var(--nc-muted); font-size: 14px; line-height: 1.9; }
  & .about-what__body h3 { color: var(--nc-ink); font: 500 29px/1.2 var(--nc-display); letter-spacing: -.04em; }
  & .about-offer { border-color: var(--nc-line); border-radius: 5px; background: var(--nc-soft); }
  & .about-foundation__intro { gap: 60px; padding-bottom: 42px; }
  & .about-foundation__intro h2 em { font-style: normal; color: var(--nc-accent); }
  & .about-foundation__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 52px; padding: 0; border: 0; border-top: 1px solid var(--nc-line); border-radius: 0; background: transparent; box-shadow: none; }
  & .about-principle { padding: 34px 0; min-height: 0; border: 0; border-bottom: 1px solid var(--nc-line); border-radius: 0; background: transparent; color: var(--nc-ink); box-shadow: none; }
  & .about-principle::before { background: none; }
  & .about-principle::after { content: none; }
  & .about-principle__top { color: var(--nc-accent); border-color: var(--nc-line); margin-bottom: 32px; }
  & .about-principle__top span { color: var(--nc-gold); font: 500 28px/1 var(--nc-display); }
  & .about-principle__top i { color: var(--nc-muted); }
  & .about-principle h3 { margin-bottom: 18px; color: var(--nc-ink); font: 500 32px/1.15 var(--nc-display); letter-spacing: -.045em; }
  & .about-principle p { max-width: 61ch; color: var(--nc-muted); font-size: 14px; line-height: 1.9; }
  & .about-principle small { color: var(--nc-accent); border-color: var(--nc-line); font-size: 9px; line-height: 1.8; }
  & .about-foundation__note { background: var(--nc-soft); border: 1px solid var(--nc-line); border-radius: 6px; box-shadow: none; }
  & .about-foundation__note > span { background: #650d2d; color: #f7f2e9; border-radius: 5px; }
  & .about-build__grid { gap: 28px; }
  & .about-build__card { min-width: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  & .about-build__card > h3 { color: var(--nc-ink); font: 500 30px/1.16 var(--nc-display); letter-spacing: -.045em; }
  & .about-build__card > p { color: var(--nc-muted); font-size: 13px; line-height: 1.9; }
  & .about-art { border: 1px solid var(--nc-line); border-radius: 7px; box-shadow: none; }
  & :is(.about-art__tile, .about-browser, .about-orbit__node, .about-orbit__core) { border-radius: 6px; }
  & .about-steps { column-gap: 28px; }
  & .about-editions { border: 1px solid var(--nc-line); border-radius: 7px; background: var(--nc-soft); box-shadow: none; }
  & .about-edition { background: transparent; color: var(--nc-ink); border-radius: 0; box-shadow: none; }
  & .about-edition__mark { border-radius: 6px; }
  & .about-edition h3 { color: var(--nc-ink); font: 500 32px/1.15 var(--nc-display); letter-spacing: -.04em; }
  & .about-edition p { color: var(--nc-muted); line-height: 1.85; }
  & :is(.about-edition__label, .about-edition__path) { color: var(--nc-accent); }
  & .about-place { gap: 60px; }
  & .about-place__art { border-radius: 7px; border-color: var(--nc-line); box-shadow: none; }
  & .about-fact { border-color: var(--nc-line); }
  & .about-fact dt { color: var(--nc-accent); font: 500 43px/1 var(--nc-display); letter-spacing: -.055em; }
  & .about-fact dd { color: var(--nc-muted); }
  & .about-technology__group { padding-block: 32px; border-color: var(--nc-line); }
  & .about-technology__group h3 { color: var(--nc-ink); font: 500 29px/1.15 var(--nc-display); letter-spacing: -.04em; }
  & .about-technology__item { border-radius: 5px; box-shadow: none; }
  & .about-contact-layout { grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); gap: 24px; }
  & .about-office-card { background: var(--nc-soft); }
  & .about-reach-card { background: var(--nc-raised); }
  & .about-reach-heading h3 { color: var(--nc-ink); font: 500 35px/1.12 var(--nc-display); letter-spacing: -.045em; }
  & .about-team-title h4 { color: var(--nc-ink); font: 500 27px/1.2 var(--nc-display); letter-spacing: -.035em; }
  & :is(.about-team-contact, .about-team-email, .about-team-phone, .about-team-actions a, .about-contact-response) { border-color: var(--nc-line); }
  & :is(.about-team-email, .about-team-phone) { overflow-wrap: anywhere; border-radius: 5px; }
  & :is(.about-team-email strong, .about-team-phone strong) { color: var(--nc-accent); font-size: clamp(15px, 1.55vw, 20px); }
  & .about-team-actions a { border-radius: 5px; }
  & .about-team-purpose { color: var(--nc-muted); font-size: 13px; line-height: 1.8; }
  & .about-care-card { grid-column: 1 / -1; padding: 0; }
  @media (max-width: 1000px) {
    & :is(.about-build__grid, .about-steps) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    & .about-contact-layout { grid-template-columns: 1fr; }
    & :is(.about-office-card, .about-reach-card, .about-care-card) { grid-column: 1; grid-row: auto; }
  }
  @media (max-width: 800px) {
    & :is(.about-what__grid, .about-foundation__intro, .about-place) { grid-template-columns: 1fr; gap: 36px; }
    & .about-foundation__grid { column-gap: 28px; }
  }
  @media (max-width: 620px) {
    & :is(.about-foundation__grid, .about-build__grid, .about-steps) { grid-template-columns: 1fr; }
    & .about-team-contacts { grid-template-columns: 1fr; }
    & .about-technology__logos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
}

/* FAQs retain native disclosure controls and their open/closed semantics. */
body.jx-next:is(.page-faq, .page-partners) #main {
  & .faq { max-width: none; }
  & .faq-group { display: grid; grid-template-columns: minmax(180px, .62fr) minmax(0, 1.38fr); column-gap: 60px; margin-bottom: 66px; }
  & .faq-group__title { grid-column: 1; grid-row: 1; align-self: start; margin: 0; padding: 22px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--nc-ink); font: 500 clamp(26px, 2.6vw, 36px)/1.15 var(--nc-display); letter-spacing: -.045em; }
  & .faq__item { grid-column: 2; margin: 0; border: 0; border-top: 1px solid var(--nc-line); border-radius: 0; background: transparent; box-shadow: none; }
  & .faq__item:last-child { border-bottom: 1px solid var(--nc-line); }
  & .faq__item:first-of-type { grid-row: 1; border-top: 1px solid var(--nc-line); }
  & .faq__q { padding: 23px 0; color: var(--nc-ink); font: 500 21px/1.45 var(--nc-display); letter-spacing: -.025em; }
  & .faq__marker { flex-shrink: 0; color: var(--nc-accent); background: transparent; border-color: var(--nc-line); border-radius: 5px; }
  & .faq__a { padding: 0 36px 25px 0; color: var(--nc-muted); font-size: 14px; line-height: 1.9; }
  & .faq__q:focus-visible { outline: 2px solid var(--nc-accent); outline-offset: 4px; }
  @media (max-width: 760px) {
    & .faq-group { display: block; margin-bottom: 48px; }
    & .faq-group__title { padding: 0; margin-bottom: 26px; }
    & .faq__a { padding-right: 0; }
  }
}

/* Editorial journal: a restrained cover, generous reading column and
   a contents rail. All article copy and existing artwork remain present. */
body.jx-next.page-blog #main {
  & :is(.blog-index-hero, .blog-article-hero) { background: var(--nc-paper); color: var(--nc-ink); border-bottom: 1px solid var(--nc-line); }
  & :is(.blog-index-hero, .blog-article-hero)::before { background: none; }
  & .blog-index-hero__grid { min-height: 0; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 64px; padding-top: 42px; padding-bottom: 88px; }
  & :is(.blog-index-hero h1, .blog-article-hero h1, .blog-missing h1) { color: var(--nc-ink); font: 500 clamp(48px, 6.3vw, 94px)/1.04 var(--nc-display); letter-spacing: -.06em; text-wrap: balance; }
  & .blog-index-hero .lead { color: var(--nc-muted); font-size: 16px; line-height: 1.85; }
  & .blog-orbit { width: 100%; min-height: 380px; border-radius: 8px; background: #4a0c26; box-shadow: 10px 12px 0 var(--nc-soft); }
  & :is(.blog-orbit__core, .blog-orbit > b) { border-radius: 6px; font-family: var(--nc-display); font-weight: 500; }
  & .blog-feature-card { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); border-radius: 8px; background: var(--nc-raised); box-shadow: none; }
  & .blog-feature-card__copy { padding: clamp(28px, 4vw, 58px); }
  & .blog-feature-card__copy strong { color: var(--nc-ink); font: 500 clamp(32px, 3.5vw, 52px)/1.12 var(--nc-display); letter-spacing: -.045em; }
  & .blog-feature-card__copy em { font-size: 14px; line-height: 1.85; }
  & .blog-art { background: #650d2d; }
  & .blog-art > b { font-family: var(--nc-display); font-weight: 500; text-shadow: none; }
  & .blog-art > i { border-radius: 6px; }
  & .blog-grid { gap: 36px; }
  & .blog-card { display: flex; flex-direction: column; border-radius: 7px; border-color: var(--nc-line); background: var(--nc-raised); box-shadow: none; }
  & .blog-card:hover { transform: none; border-color: var(--nc-accent); box-shadow: none; }
  & .blog-card__art { min-height: 220px; }
  & .blog-card__body { display: flex; flex-direction: column; flex: 1; padding: 30px; }
  & .blog-card__body > div { margin-top: auto; padding-top: 22px; }
  & .blog-card h2 { color: var(--nc-ink); font: 500 clamp(28px, 2.6vw, 38px)/1.16 var(--nc-display); letter-spacing: -.04em; }
  & .blog-card p { min-height: 0; margin-bottom: 26px; font-size: 14px; line-height: 1.85; }
  & .blog-category { width: fit-content; border-radius: 4px; font-size: 9px; line-height: 1.7; padding: 5px 9px; }
  & .blog-article-hero { padding-top: 42px; padding-bottom: 80px; }
  & .blog-article-hero__grid { grid-template-columns: minmax(0, 1.45fr) minmax(0, .75fr); gap: 56px; margin-top: 38px; }
  & .blog-article-hero h1 { font-size: clamp(44px, 5.3vw, 78px); }
  & .blog-article-hero__grid > div:first-child > p { font-size: 16px; line-height: 1.85; }
  & .blog-article-hero__art { min-height: 370px; border-radius: 7px; box-shadow: 8px 10px 0 var(--nc-soft); }
  & .blog-article-layout { grid-template-columns: minmax(190px, 240px) minmax(0, 760px); gap: clamp(36px, 6vw, 90px); padding-block: 80px 110px; }
  & .blog-toc { position: sticky; top: calc(var(--nx-header-height, 88px) + 28px); grid-template-columns: 1fr; gap: 0; padding: 20px 0; border: 0; border-top: 1px solid var(--nc-line); border-radius: 0; background: transparent; }
  & .blog-toc > span { margin-bottom: 18px; }
  & .blog-toc a { display: block; padding-block: 10px; line-height: 1.65; }
  & :is(.blog-takeaways, .blog-jpraxc, .blog-comparison article, .blog-checklist li, .blog-steps li, .blog-related__grid > a) { border-radius: 6px; box-shadow: none; }
  & .blog-takeaways { padding: 30px; background: var(--nc-soft); }
  & :is(.blog-section > h2, .blog-jpraxc h2, .blog-sources h2) { font: 500 clamp(29px, 3.2vw, 44px)/1.2 var(--nc-display); letter-spacing: -.04em; }
  & :is(.blog-section > p, .blog-jpraxc > p) { font-size: 16px; line-height: 1.95; }
  & :is(.blog-steps h3, .blog-comparison h3) { font-family: var(--nc-display); font-weight: 500; }
  & .blog-steps li > span { border-radius: 5px; background: #650d2d; }
  & .blog-jpraxc { background: #4a0c26; }
  & .blog-jpraxc .link-arrow { color: #f7f2e9; }
  & :is(.blog-sources li > span, .blog-share a) { border-radius: 4px; }
  & .blog-related__grid strong { font: 500 28px/1.2 var(--nc-display); letter-spacing: -.035em; }
  & .blog-index-cta { background: #4a0c26; padding-block: 80px; }
  & .blog-index-cta .container { min-height: 0; }
  & .blog-index-cta h2 { font: 500 clamp(38px, 4.7vw, 68px)/1.1 var(--nc-display); letter-spacing: -.05em; }
  & .blog-index-cta p { font-size: 14px; line-height: 1.85; }
  & .blog-index-cta .future-button { background: #ecd8b9; color: #42192a !important; border-color: #ecd8b9; }
  & .blog-jpraxc a.button-primary { color: #42192a !important; background: #ecd8b9 !important; border-color: #ecd8b9 !important; }
  @media (max-width: 1000px) {
    & .blog-index-hero__grid { gap: 38px; }
    & .blog-orbit { min-height: 320px; }
    & .blog-article-hero__grid { grid-template-columns: 1fr; gap: 36px; }
    & .blog-article-hero__art { min-height: 260px; }
  }
  @media (max-width: 760px) {
    & :is(.blog-index-hero__grid, .blog-feature-card, .blog-grid, .blog-article-layout, .blog-related__grid) { grid-template-columns: 1fr; }
    & .blog-index-hero__grid { padding-bottom: 60px; }
    & .blog-orbit { max-width: 500px; }
    & .blog-article-layout { gap: 36px; padding-block: 40px 64px; }
    & .blog-toc { position: static; grid-template-columns: 1fr; }
    & .blog-takeaways { padding: 24px; margin-bottom: 45px; }
    & .blog-section { margin-top: 48px; }
    & .blog-card__body { padding: 24px; }
    & .blog-index-cta .container { align-items: flex-start; flex-direction: column; gap: 28px; }
    & :is(.blog-index-hero h1, .blog-article-hero h1) { font-size: clamp(40px, 10.5vw, 62px); }
  }
}

/* Policy and legal reading surfaces. Numbering and semantic tables are
   untouched. The grievance form, tickets and validation belong to forms. */
body.jx-next:is(.page-privacy, .page-terms, .page-refund, .page-legal) #main {
  & .page-title { max-width: 22ch; font-size: clamp(44px, 5.6vw, 82px); }
  & .page-hero .lead { max-width: 65ch; }
  & .legal-meta { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--nc-line); color: var(--nc-muted); font-size: 11px; line-height: 1.8; }
  & > .band--flush-top { padding-top: 46px; }
  & .toc { margin: 0 0 60px; padding: 22px 0; border: 0; border-block: 1px solid var(--nc-line); border-radius: 0; background: transparent; }
  & .toc--grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; }
  & .toc__link { display: block; padding-block: 10px; color: var(--nc-accent); font-size: 12px; line-height: 1.65; }
  & .prose { max-width: 78ch; margin-inline: auto; color: var(--nc-muted); font-size: 15px; line-height: 1.95; }
  & .prose > :is(p, ul, ol) { color: var(--nc-muted); font-size: 15px; line-height: 1.95; }
  & .prose .prose__lead { color: var(--nc-ink); font-size: 16px; line-height: 1.9; }
  & .prose > h2 { margin-top: 60px; padding-top: 26px; border-top: 1px solid var(--nc-line); color: var(--nc-ink); font: 500 clamp(27px, 3vw, 38px)/1.24 var(--nc-display); letter-spacing: -.035em; scroll-margin-top: calc(var(--nx-header-height, 88px) + 28px); }
  & .prose > h3 { margin-top: 30px; color: var(--nc-ink); font: 500 23px/1.35 var(--nc-display); letter-spacing: -.025em; }
  & .prose a { color: var(--nc-accent); text-underline-offset: .2em; overflow-wrap: anywhere; }
  & :is(.legal-glance, .legal-disclosure, .legal-officer, .legal-laws li, .legal-steps li, .note) { padding: 26px; border: 1px solid var(--nc-line); border-radius: 6px; background: var(--nc-soft); box-shadow: none; }
  & .legal-glance h2 { color: var(--nc-accent); font-size: 11px; letter-spacing: .1em; }
  & .legal-glance li { color: var(--nc-muted); font-size: 14px; line-height: 1.8; }
  & .legal-glance li::before { width: 6px; height: 6px; top: .7em; background: var(--nc-gold); box-shadow: none; }
  & .legal-table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid var(--nc-line); border-radius: 5px; }
  & .legal-table { min-width: 550px; font-size: 13px; line-height: 1.75; color: var(--nc-muted); }
  & .legal-table :is(th, td) { padding: 17px 18px; border-color: var(--nc-line); }
  & .legal-table thead th { background: var(--nc-soft); color: var(--nc-ink); font-size: 10px; }
  & .legal-card { padding: 30px; border: 1px solid var(--nc-line); border-radius: 7px; background: var(--nc-raised); box-shadow: none; }
  & .legal-card h2 { color: var(--nc-ink); font: 500 28px/1.16 var(--nc-display); letter-spacing: -.04em; }
  & .legal-card p { color: var(--nc-muted); font-size: 14px; line-height: 1.85; }
  & .legal-card:hover { transform: none; border-color: var(--nc-accent); }
  & .legal-section > h2 { margin-bottom: 20px; color: var(--nc-ink); font: 500 36px/1.18 var(--nc-display); letter-spacing: -.04em; }
  & .legal-steps li { padding-left: 66px; }
  & .legal-steps li::before { top: 26px; left: 20px; border-radius: 5px; background: var(--nc-accent); color: var(--nx-on-accent, #fff8ed); }
  & :is(.legal-laws, .legal-disclosure, .legal-hub) { gap: 20px; }
  @media (max-width: 760px) {
    & .toc--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 620px) {
    & .page-title { font-size: clamp(40px, 10vw, 58px); }
    & :is(.toc--grid, .legal-disclosure, .legal-laws, .legal-hub, .prose .legal-glance ul) { grid-template-columns: 1fr; }
    & .toc { margin-bottom: 38px; }
    & .legal-card { padding: 24px; }
    & .prose > h2 { margin-top: 42px; }
  }
}

/* Deployment choices and partners preserve their diagrams,
   links, truthful availability labels and the original comparison table. */
body.jx-next.page-deployments #main {
  & .feature-row { gap: clamp(36px, 6vw, 88px); }
  & .feature-row__copy .section-title { font-size: clamp(36px, 4vw, 58px); }
  & .deploy-concept { border: 1px solid var(--nc-line); border-radius: 8px; background: var(--nc-soft); box-shadow: none; }
  & .deploy-concept__badge { border-radius: 5px; }
  & .compare { padding: 0; border: 1px solid var(--nc-line); border-radius: 7px; background: var(--nc-raised); overflow: hidden; box-shadow: none; }
  & .scroll-x { overflow-x: auto; }
  & .compare-table { min-width: 680px; width: 100%; border-collapse: collapse; }
  & :is(.compare-table__th, .compare-table__row-label, .compare-table__td) { padding: 24px; color: var(--nc-ink); border-color: var(--nc-line); background: transparent; font-size: 14px; line-height: 1.8; }
  & .compare-table__th { background: var(--nc-soft); }
  & .compare-table__td { color: var(--nc-muted); }
  & .compare-note { margin: 0; padding: 24px; color: var(--nc-muted); border-top: 1px solid var(--nc-line); font-size: 12px; line-height: 1.8; }
  & .migration { border: 1px solid var(--nc-line); border-radius: 7px; background: var(--nc-soft); box-shadow: none; }
  & .migration__step { border-radius: 5px; }
  @media (max-width: 800px) {
    & .feature-row { grid-template-columns: 1fr; }
    & :is(.feature-row__copy, .feature-row__visual) { order: initial; }
  }
}
body.jx-next.page-partners #main {
  & .partner-journey { margin-top: 56px; border: 1px solid var(--nc-line); border-radius: 8px; box-shadow: none; }
  & .partner-journey__canvas { border-radius: 7px; background: var(--nc-soft); }
  & .partner-journey__heart { border-radius: 6px; background: #650d2d; color: #f7f2e9; box-shadow: none; }
  & .partner-journey__heart strong { font-family: var(--nc-display); font-weight: 500; letter-spacing: -.045em; }
  & .partner-journey__track li { border-radius: 5px; box-shadow: none; }
  & .partner-journey__track b { font-family: var(--nc-display); font-weight: 500; }
  & .grid--3 { gap: 28px; }
  & .grid--3 > .card { padding: 28px 0; background: transparent; border: 0; border-top: 1px solid var(--nc-line); border-radius: 0; }
}
/* Partner application is an app handoff guide; no HTML form lives here. */
body.jx-next.page-partner-apply #main {
  & .apply-app { border: 1px solid var(--nc-line); border-radius: 7px; padding: 34px; background: var(--nc-soft); color: var(--nc-ink); box-shadow: none; }
  & .apply-app h2 { color: var(--nc-ink); font: 500 36px/1.15 var(--nc-display); letter-spacing: -.045em; }
  & .apply-app > p:not(.eyebrow) { color: var(--nc-muted); font-size: 14px; line-height: 1.85; }
  & .store-badge { border-radius: 5px; }
  & .feature-row { gap: 56px; }
  @media (max-width: 760px) {
    & .feature-row { grid-template-columns: 1fr; gap: 32px; }
    & .apply-app { padding: 25px; }
  }
}

body.jx-next.page-testimonials #main {
  & .quote-grid { gap: 28px; }
  & .quote-card { margin: 0; padding: 32px; border: 1px solid var(--nc-line); border-radius: 7px; background: var(--nc-raised); box-shadow: none; }
  & .quote-card__mark { color: var(--nc-gold); font-family: var(--nc-display); font-weight: 500; }
  & .quote-card__text { color: var(--nc-ink); font: 500 24px/1.55 var(--nc-display); letter-spacing: -.025em; }
  & .quote-card__person { border-color: var(--nc-line); }
  & :is(.quote-card__role, .quote-card__org) { color: var(--nc-muted); }
  & .empty-state { max-width: 820px; margin-inline: auto; padding: clamp(30px, 5vw, 66px); text-align: left; border: 1px solid var(--nc-line); border-left: 3px solid var(--nc-gold); border-radius: 6px; background: var(--nc-soft); box-shadow: none; }
  & .empty-state__title { font-size: clamp(30px, 3.5vw, 46px); }
  @media (max-width: 950px) { & .quote-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 620px) { & .quote-grid { grid-template-columns: 1fr; } }
}
body.jx-next:is(.page-download, .page-not-found) #main {
  & .page-hero { min-height: 68svh; display: flex; align-items: center; }
  & .page-hero > .container { max-width: 1080px; }
  & .page-title { max-width: 19ch; }
  & .hero__micro { border-top: 1px solid var(--nc-line); padding-top: 22px; }
}

/* Payment's existing request/record illustration already supplies a useful
   composition; align its type, palette, surfaces and page margins. */
body.jx-next.page-payment-service #main {
  & :is(.pay-hero, .pay-workflows, .pay-start, .pay-related) { padding-inline: max(var(--nc-gutter), calc((100% - var(--nc-width)) / 2)); color: var(--nc-ink); }
  & .pay-hero { padding-block: 42px 88px; gap: 6%; }
  & .pay-hero h1 { font: 500 clamp(48px, 6.2vw, 92px)/1.03 var(--nc-display); letter-spacing: -.06em; }
  & :is(.pay-hero h1, .pay-section-heading h2, .pay-start h2) em { color: var(--nc-accent); font-style: normal; }
  & .pay-breadcrumb { margin-bottom: 40px; color: var(--nc-muted); }
  & .pay-art-card { border-radius: 7px; box-shadow: 8px 10px 0 #b8844217; }
  & .pay-art-card > b { font-family: var(--nc-display); font-weight: 500; }
  & .pay-art-request { background: #ead5b6; color: #42192a; }
  & .pay-art-receipt { background: #650d2d; color: #f7f2e9; border-color: #97596f; }
  & .pay-art-check { border-color: #d7b888; }
  & .pay-workflows { border-top: 1px solid var(--nc-line); padding-block: 90px; }
  & :is(.pay-section-heading h2, .pay-start h2) { font: 500 clamp(38px, 4.8vw, 70px)/1.1 var(--nc-display); letter-spacing: -.05em; }
  & .pay-feature-grid h3 { font: 500 28px/1.2 var(--nc-display); letter-spacing: -.04em; }
  & .pay-start { background: var(--nc-soft); padding-block: 90px; }
  & .pay-setup-list strong { font-family: var(--nc-display); font-weight: 500; }
  & .pay-related { border-top: 1px solid var(--nc-line); }
  @media (max-width: 760px) {
    & .pay-hero { display: block; padding-block: 30px 60px; }
    & .pay-hero h1 { font-size: clamp(42px, 11vw, 66px); }
    & .pay-art { max-width: 370px; min-height: 500px; }
    & :is(.pay-start, .pay-workflows) { padding-block: 62px; }
  }
}

/* Public form journeys: introductory reading area only. Form specialist
   owns all controls, fields, containers, validation and success states. */
body.jx-next:is(.page-demo, .page-buy, .page-feedback) #main > .page-hero {
  padding-top: clamp(32px, 4vw, 60px);
  padding-bottom: 64px;
  border-bottom: 1px solid var(--nx-line, #d9cec0);
  background: var(--nx-paper, #f7f2e9);
  & .page-title { color: var(--nx-ink, #32131f); font-family: 'Space Grotesk', Arial, sans-serif; font-weight: 500; line-height: 1.08; letter-spacing: -.05em; }
  & .lead { color: var(--nx-muted, #71616a); font-size: 16px; line-height: 1.85; }
}

/* Print belongs to the reader: no coloured legal panels behind small text. */
@media print {
  body.jx-next:is(.page-privacy, .page-terms, .page-refund, .page-legal) #main {
    --nc-paper: #fff; --nc-ink: #000; --nc-muted: #222;
    --nc-soft: #fff; --nc-raised: #fff; --nc-accent: #000; --nc-line: #aaa;
    & .container { width: 100%; max-width: none; }
    & .prose { max-width: none; }
    & .page-title { font-size: 32pt; }
    & > .band { padding-block: 18pt; }
    & .legal-table { min-width: 0; }
    & .legal-table-wrap { overflow: visible; }
  }
}