.jn-proof-loop{--jn-ink:#172033;--jn-muted:#5d6678;--jn-line:#dfe4ea;--jn-paper:#fff;--jn-warm:#f7f3eb;--jn-orange:#e96424;--jn-blue:#1f5b89;color:var(--jn-ink);background:var(--jn-paper);font-family:inherit}
.jn-proof-loop *{box-sizing:border-box}
.jn-proof-loop a:focus-visible{outline:3px solid #f28a50;outline-offset:4px}
.jn-proof-loop ::selection{background:#f5c8ad;color:#172033}
.jn-loop-shell{width:min(1380px,calc(100% - 40px));margin-inline:auto}
.jn-loop-heading{font-size:clamp(2rem,4vw,4.5rem);line-height:1.05;letter-spacing:-.035em;font-weight:800;max-width:900px;margin:0 0 24px}
.jn-loop-lead{font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.75;color:var(--jn-muted);max-width:760px;margin:0}
.jn-loop-intro{padding:96px 0 64px;background:var(--jn-warm);border-top:1px solid #eee7db}
.jn-audience-switch{margin-top:42px;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #cfc8bb;border-bottom:1px solid #cfc8bb}
.jn-audience-link{display:flex;gap:20px;align-items:center;padding:28px 4px;color:var(--jn-ink);text-decoration:none;transition:color .25s ease,background .25s ease}
.jn-audience-link+ .jn-audience-link{border-left:1px solid #cfc8bb;padding-left:32px}
.jn-audience-link:hover{color:var(--jn-orange)}
.jn-audience-icon{width:48px;height:48px;flex:none;color:currentColor}
.jn-audience-link strong{display:block;font-size:1.18rem;margin-bottom:5px}
.jn-audience-link span{display:block;color:var(--jn-muted);line-height:1.55}
.jn-scenarios{padding:92px 0}
.jn-section-top{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:40px}
.jn-section-top .jn-loop-heading{font-size:clamp(2rem,3.3vw,3.6rem);margin-bottom:0}
.jn-section-note{max-width:440px;line-height:1.7;color:var(--jn-muted);margin:0}
.jn-scenario-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--jn-line);border-bottom:1px solid var(--jn-line)}
.jn-scenario{min-height:330px;padding:30px 26px 28px;text-decoration:none;color:inherit;display:flex;flex-direction:column;position:relative;overflow:hidden}
.jn-scenario+.jn-scenario{border-left:1px solid var(--jn-line)}
.jn-scenario h3{transition:color .25s ease}
.jn-scenario:hover h3{color:var(--accent)}
.jn-scenario-index{font-variant-numeric:tabular-nums;color:var(--accent);font-weight:700;font-size:.82rem;letter-spacing:.12em}
.jn-scenario svg{width:64px;height:64px;margin:48px 0 34px;color:var(--accent)}
.jn-scenario h3{font-size:1.35rem;line-height:1.3;margin:0 0 10px}
.jn-scenario p{color:var(--jn-muted);line-height:1.65;margin:0}
.jn-selector{background:#172033;color:white;padding:96px 0}
.jn-selector .jn-loop-heading{color:#fff}
.jn-selector .jn-section-note{color:#bac3d2}
.jn-model-grid{border-top:1px solid #465064;margin-top:42px}
.jn-model{display:grid;grid-template-columns:160px 1.15fr 1fr 160px;align-items:center;gap:28px;padding:28px 0;border-bottom:1px solid #465064;color:white;text-decoration:none}
.jn-model-code{font-size:clamp(1.55rem,2.4vw,2.45rem);font-weight:800;letter-spacing:-.025em;font-variant-numeric:tabular-nums;color:var(--model)}
.jn-model strong{font-size:1.14rem}
.jn-model span{color:#bac3d2;line-height:1.55}
.jn-model-action{text-align:right;color:#fff!important;font-weight:700}
.jn-model:hover .jn-model-action{color:var(--model)!important}
.jn-evidence{padding:100px 0;background:#f3f6f8}
.jn-evidence-layout{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(0,1.35fr);gap:80px;align-items:start}
.jn-report-meta{margin-top:36px;padding-top:24px;border-top:1px solid #ccd3da;color:var(--jn-muted);line-height:1.8;font-size:.95rem}
.jn-report-meta strong{color:var(--jn-ink)}
.jn-metric-list{border-top:1px solid #c8d0d8}
.jn-metric{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;padding:24px 0;border-bottom:1px solid #c8d0d8}
.jn-metric-label{font-weight:700}.jn-metric-source{display:block;margin-top:5px;color:var(--jn-muted);font-size:.9rem}
.jn-metric-value{font-size:clamp(1.8rem,3vw,3.1rem);font-weight:800;letter-spacing:-.035em;color:var(--jn-blue);font-variant-numeric:tabular-nums}
.jn-report-caution{margin:22px 0 0;color:var(--jn-muted);font-size:.9rem;line-height:1.6}
.jn-cases{padding:100px 0}
.jn-case-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.jn-case{min-height:260px;padding:32px;background:#f6f6f3;color:var(--jn-ink);text-decoration:none;display:flex;flex-direction:column;justify-content:space-between;position:relative}
.jn-case:nth-child(2),.jn-case:nth-child(3){background:#edf2f5}
.jn-case h3{font-size:clamp(1.35rem,2vw,2rem);margin:0 0 12px;max-width:420px}
.jn-case p{color:var(--jn-muted);line-height:1.65;max-width:520px;margin:0}
.jn-case span{font-weight:700;color:var(--jn-orange);margin-top:30px}
.jn-actions{background:var(--jn-orange);color:#fff;padding:72px 0}
.jn-action-layout{display:grid;grid-template-columns:1fr auto;gap:50px;align-items:center}
.jn-actions h2{font-size:clamp(2rem,4vw,4rem);line-height:1.05;letter-spacing:-.035em;margin:0;max-width:730px}
.jn-action-links{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.jn-action-links a{display:inline-flex;align-items:center;min-height:50px;padding:0 20px;border:1px solid rgba(255,255,255,.72);color:#fff;text-decoration:none;font-weight:700;transition:background .2s,color .2s}
.jn-action-links a:first-child{background:#fff;color:#b84413}
.jn-action-links a:hover{background:#172033;border-color:#172033;color:#fff}
@media(max-width:960px){.jn-scenario-grid{grid-template-columns:repeat(2,1fr)}.jn-scenario:nth-child(3){border-left:0;border-top:1px solid var(--jn-line)}.jn-scenario:nth-child(4){border-top:1px solid var(--jn-line)}.jn-model{grid-template-columns:130px 1fr 1fr}.jn-model-action{display:none}.jn-evidence-layout{grid-template-columns:1fr;gap:44px}.jn-action-layout{grid-template-columns:1fr}.jn-action-links{justify-content:flex-start}}
@media(max-width:640px){.jn-loop-shell{width:min(100% - 28px,1380px)}.jn-loop-intro,.jn-scenarios,.jn-selector,.jn-evidence,.jn-cases{padding:68px 0}.jn-section-top{display:block}.jn-section-note{margin-top:16px}.jn-audience-switch,.jn-scenario-grid,.jn-case-grid{grid-template-columns:1fr}.jn-audience-link+.jn-audience-link,.jn-scenario+.jn-scenario{border-left:0}.jn-audience-link+.jn-audience-link{border-top:1px solid #cfc8bb;padding-left:4px}.jn-scenario{min-height:270px;border-top:1px solid var(--jn-line)}.jn-scenario:first-child{border-top:0}.jn-scenario svg{margin:34px 0 26px}.jn-model{grid-template-columns:1fr;gap:8px;padding:24px 0}.jn-metric{align-items:start}.jn-metric-value{font-size:1.8rem}.jn-actions{padding:58px 0}.jn-action-links{display:grid}.jn-action-links a{justify-content:center}}
@media(prefers-reduced-motion:reduce){.jn-proof-loop *{scroll-behavior:auto!important;transition:none!important}}
section[data-component-file="Home.tsx"]:first-child{background-image:linear-gradient(rgba(8,18,28,.52),rgba(8,18,28,.52)),url("/junaimei-factory-hero.png")!important;background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important}section[data-component-file="Home.tsx"]:first-child p{color:rgba(255,255,255,.92)!important;text-shadow:0 2px 12px rgba(0,0,0,.7)}section[data-component-file="Home.tsx"]:first-child h1,section[data-component-file="Home.tsx"]:first-child h2{text-shadow:0 3px 18px rgba(0,0,0,.48)}
section[data-component-file="Home.tsx"]:first-child h1,section[data-component-file="Home.tsx"]:first-child h2{background:none!important;background-image:none!important;background-clip:border-box!important;-webkit-background-clip:border-box!important;color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 3px 18px rgba(0,0,0,.7)!important}
/* Homepage visual alignment with the C1520 product-detail system. */
:root {
  --jnm-home-ink: #111827;
  --jnm-home-muted: #4b5563;
  --jnm-home-cyan: #0891b2;
  --jnm-home-blue: #3b82f6;
  --jnm-home-orange: #f97316;
  --jnm-home-yellow: #eab308;
  --jnm-home-line: #dbe4ee;
  --jnm-home-soft: #f8fafc;
  --jnm-home-radius: 16px;
  --jnm-home-shadow: 0 20px 25px -5px rgba(15, 23, 42, .10), 0 8px 10px -6px rgba(15, 23, 42, .08);
  --jnm-home-shadow-small: 0 10px 15px -3px rgba(15, 23, 42, .08), 0 4px 6px -4px rgba(15, 23, 42, .08);
}

main[data-component-file="Home.tsx"] {
  color: var(--jnm-home-ink);
  background: #fff;
}

html[data-jnm-home-product-ui="20260830-v1"] main[data-component-file="Home.tsx"] > section:not(:first-child) {
  display: none !important;
}

main[data-component-file="Home.tsx"] *,
main[data-component-file="Home.tsx"] *::before,
main[data-component-file="Home.tsx"] *::after {
  box-sizing: border-box;
}

main[data-component-file="Home.tsx"] ::selection {
  color: #0c2e46;
  background: #bae6fd;
}

main[data-component-file="Home.tsx"] a {
  text-underline-offset: .22em;
}

main[data-component-file="Home.tsx"] a:focus-visible {
  outline: 3px solid #06b6d4 !important;
  outline-offset: 4px !important;
}

/* Hero: the product-detail title surface expanded into an editorial split. */
main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child {
  position: relative !important;
  isolation: isolate;
  min-height: 660px !important;
  overflow: hidden;
  justify-content: flex-start !important;
  padding: 92px 0 !important;
  background: linear-gradient(110deg, #ecfeff 0%, #eff6ff 54%, #faf5ff 100%) !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: auto auto -190px -150px;
  width: 430px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(6, 182, 212, .13), rgba(6, 182, 212, 0) 70%);
  pointer-events: none;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 72px;
  right: max(32px, calc((100vw - 1380px) / 2 + 32px));
  width: min(42vw, 620px);
  height: 516px;
  border-radius: var(--jnm-home-radius);
  background: url("/junaimei-factory-hero.png") center 49% / cover no-repeat;
  background: image-set(
    url("/junaimei-factory-hero.png.webp") type("image/webp") 1x,
    url("/junaimei-factory-hero.png") type("image/png") 1x
  ) center 49% / cover no-repeat;
  box-shadow: var(--jnm-home-shadow);
  pointer-events: none;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child > div {
  width: min(1380px, calc(100% - 64px)) !important;
  max-width: 1380px !important;
  margin: 0 auto !important;
  padding: 0 min(50%, 710px) 0 32px !important;
  text-align: left !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h1,
main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2 {
  max-width: 680px;
  color: var(--jnm-home-ink) !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
  letter-spacing: -.03em;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h1 {
  margin: 0 0 12px !important;
  font-size: clamp(2.55rem, 3.55vw, 3.5rem) !important;
  line-height: 1.08 !important;
  font-weight: 800 !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2 {
  margin: 0 0 26px !important;
  font-size: clamp(1.75rem, 2.55vw, 2.55rem) !important;
  line-height: 1.18 !important;
  font-weight: 750 !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child p {
  max-width: 62ch !important;
  margin: 0 0 34px !important;
  color: var(--jnm-home-muted) !important;
  font-size: clamp(1.02rem, 1.3vw, 1.18rem) !important;
  line-height: 1.8 !important;
  text-shadow: none !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child div > div:last-child {
  justify-content: flex-start !important;
  gap: 14px !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 26px !important;
  border: 0 !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  text-decoration: none;
  transform: none !important;
  transition: color .22s ease, background .22s ease, box-shadow .22s ease, transform .22s ease !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a:first-child {
  color: #fff !important;
  background: linear-gradient(90deg, #06b6d4, #3b82f6) !important;
  box-shadow: var(--jnm-home-shadow-small) !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a:last-child {
  color: #c2410c !important;
  background: #fff !important;
  box-shadow: inset 0 0 0 1px #fdba74 !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--jnm-home-shadow) !important;
}

/* Shared product-detail typography and section rhythm. */
main[data-component-file="Home.tsx"] .jn-proof-loop {
  --jn-ink: var(--jnm-home-ink);
  --jn-muted: var(--jnm-home-muted);
  --jn-line: var(--jnm-home-line);
  --jn-paper: #fff;
  --jn-warm: #f8fafc;
  --jn-orange: var(--jnm-home-orange);
  --jn-blue: var(--jnm-home-cyan);
  color: var(--jnm-home-ink);
  background: #fff;
}

main[data-component-file="Home.tsx"] .jn-loop-shell {
  width: min(1380px, calc(100% - 64px));
}

main[data-component-file="Home.tsx"] .jn-loop-heading,
main[data-component-file="Home.tsx"] .jn-actions h2 {
  max-width: 880px;
  color: var(--jnm-home-ink);
  font-size: clamp(2.2rem, 3.2vw, 3.25rem);
  line-height: 1.12;
  letter-spacing: -.03em;
  font-weight: 800;
  text-wrap: balance;
}

main[data-component-file="Home.tsx"] .jn-loop-lead,
main[data-component-file="Home.tsx"] .jn-section-note {
  color: var(--jnm-home-muted);
  line-height: 1.78;
}

main[data-component-file="Home.tsx"] .jn-loop-intro,
main[data-component-file="Home.tsx"] .jn-scenarios,
main[data-component-file="Home.tsx"] .jn-selector,
main[data-component-file="Home.tsx"] .jn-evidence,
main[data-component-file="Home.tsx"] .jn-cases {
  padding: 84px 0;
}

main[data-component-file="Home.tsx"] .jn-loop-intro {
  border: 0;
  background: linear-gradient(105deg, #ecfeff 0%, #eff6ff 52%, #faf5ff 100%);
}

main[data-component-file="Home.tsx"] .jn-audience-switch {
  gap: 20px;
  margin-top: 38px;
  border: 0;
}

main[data-component-file="Home.tsx"] .jn-audience-link {
  min-height: 122px;
  padding: 24px 26px;
  border: 0 !important;
  border-radius: 12px;
  color: var(--jnm-home-ink);
  background: linear-gradient(145deg, #fff, #f8fafc);
  box-shadow: var(--jnm-home-shadow-small);
  transition: color .22s ease, box-shadow .22s ease, transform .22s ease;
}

main[data-component-file="Home.tsx"] .jn-audience-link + .jn-audience-link {
  padding-left: 26px;
}

main[data-component-file="Home.tsx"] .jn-audience-link:hover {
  color: var(--jnm-home-cyan);
  transform: translateY(-3px);
  box-shadow: var(--jnm-home-shadow);
}

main[data-component-file="Home.tsx"] .jn-audience-icon {
  width: 54px;
  height: 54px;
  padding: 12px;
  border-radius: 12px;
  color: #0891b2;
  background: #cffafe;
}

main[data-component-file="Home.tsx"] .jn-audience-link + .jn-audience-link .jn-audience-icon {
  color: #c2410c;
  background: #ffedd5;
}

main[data-component-file="Home.tsx"] .jn-audience-link strong {
  color: var(--jnm-home-ink);
  font-size: 1.15rem;
}

main[data-component-file="Home.tsx"] .jn-audience-link span span {
  color: var(--jnm-home-muted);
}

main[data-component-file="Home.tsx"] .jn-scenarios,
main[data-component-file="Home.tsx"] .jn-cases {
  background: #fff;
}

main[data-component-file="Home.tsx"] .jn-section-top {
  margin-bottom: 34px;
}

main[data-component-file="Home.tsx"] .jn-scenario-grid {
  gap: 18px;
  border: 0;
}

main[data-component-file="Home.tsx"] .jn-scenario {
  min-height: 318px;
  padding: 26px;
  border: 0 !important;
  border-radius: 12px;
  background: linear-gradient(145deg, #f8fafc, #fff);
  box-shadow: var(--jnm-home-shadow-small);
  transition: box-shadow .22s ease, transform .22s ease;
}

main[data-component-file="Home.tsx"] .jn-scenario:hover {
  transform: translateY(-4px);
  box-shadow: var(--jnm-home-shadow);
}

main[data-component-file="Home.tsx"] .jn-scenario-index {
  letter-spacing: .09em;
}

main[data-component-file="Home.tsx"] .jn-scenario svg {
  width: 58px;
  height: 58px;
  margin: 38px 0 30px;
}

main[data-component-file="Home.tsx"] .jn-scenario h3,
main[data-component-file="Home.tsx"] .jn-case h3 {
  color: var(--jnm-home-ink);
}

/* The model selector mirrors the C1520 technical-parameter card. */
main[data-component-file="Home.tsx"] .jn-selector {
  color: var(--jnm-home-ink);
  background: linear-gradient(105deg, #ecfeff 0%, #eff6ff 56%, #faf5ff 100%);
}

main[data-component-file="Home.tsx"] .jn-selector .jn-loop-heading {
  color: var(--jnm-home-ink);
}

main[data-component-file="Home.tsx"] .jn-selector .jn-section-note {
  color: var(--jnm-home-muted);
}

main[data-component-file="Home.tsx"] .jn-model-grid {
  overflow: hidden;
  margin-top: 36px;
  border: 0;
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--jnm-home-shadow);
}

main[data-component-file="Home.tsx"] .jn-model {
  grid-template-columns: 170px minmax(150px, .85fr) minmax(280px, 1.45fr) 150px;
  gap: 24px;
  min-height: 94px;
  padding: 22px 26px;
  border-color: #e2e8f0;
  color: var(--jnm-home-ink);
  background: #fff;
  transition: background .2s ease;
}

main[data-component-file="Home.tsx"] .jn-model:nth-child(even) {
  background: #f8fafc;
}

main[data-component-file="Home.tsx"] .jn-model:hover {
  background: #ecfeff;
}

main[data-component-file="Home.tsx"] .jn-model-code {
  font-size: clamp(1.55rem, 2.15vw, 2.2rem);
}

main[data-component-file="Home.tsx"] .jn-model strong {
  color: var(--jnm-home-ink);
}

main[data-component-file="Home.tsx"] .jn-model span {
  color: var(--jnm-home-muted);
}

main[data-component-file="Home.tsx"] .jn-model .jn-model-action {
  color: var(--jnm-home-cyan) !important;
}

main[data-component-file="Home.tsx"] .jn-evidence {
  background: #fff;
}

main[data-component-file="Home.tsx"] .jn-evidence-layout {
  grid-template-columns: minmax(300px, .9fr) minmax(0, 1.25fr);
  gap: 72px;
}

main[data-component-file="Home.tsx"] .jn-report-meta {
  padding: 22px 24px;
  border: 0;
  border-radius: 12px;
  color: var(--jnm-home-muted);
  background: linear-gradient(135deg, #fff7ed, #fefce8);
  box-shadow: var(--jnm-home-shadow-small);
}

main[data-component-file="Home.tsx"] .jn-report-meta strong {
  color: var(--jnm-home-ink);
}

main[data-component-file="Home.tsx"] .jn-metric-list {
  overflow: hidden;
  border: 0;
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--jnm-home-shadow);
}

main[data-component-file="Home.tsx"] .jn-metric {
  min-height: 96px;
  padding: 21px 24px;
  border-color: #e2e8f0;
}

main[data-component-file="Home.tsx"] .jn-metric:nth-child(even) {
  background: #f8fafc;
}

main[data-component-file="Home.tsx"] .jn-metric-source,
main[data-component-file="Home.tsx"] .jn-report-caution {
  color: var(--jnm-home-muted);
}

main[data-component-file="Home.tsx"] .jn-metric-value {
  color: var(--jnm-home-cyan);
  font-size: clamp(1.65rem, 2.45vw, 2.7rem);
}

main[data-component-file="Home.tsx"] .jn-cases {
  background: #f8fafc;
}

main[data-component-file="Home.tsx"] .jn-case-grid {
  gap: 20px;
}

main[data-component-file="Home.tsx"] .jn-case,
main[data-component-file="Home.tsx"] .jn-case:nth-child(2),
main[data-component-file="Home.tsx"] .jn-case:nth-child(3) {
  min-height: 244px;
  padding: 30px;
  border-radius: 12px;
  background: linear-gradient(145deg, #fff, #f8fafc);
  box-shadow: var(--jnm-home-shadow-small);
  transition: box-shadow .22s ease, transform .22s ease;
}

main[data-component-file="Home.tsx"] .jn-case:nth-child(2),
main[data-component-file="Home.tsx"] .jn-case:nth-child(4) {
  background: linear-gradient(145deg, #f0f9ff, #fff);
}

main[data-component-file="Home.tsx"] .jn-case:hover {
  transform: translateY(-3px);
  box-shadow: var(--jnm-home-shadow);
}

main[data-component-file="Home.tsx"] .jn-case span {
  color: var(--jnm-home-cyan);
}

main[data-component-file="Home.tsx"] .jn-actions {
  padding: 72px 0;
  color: var(--jnm-home-ink);
  background: linear-gradient(90deg, #ecfeff, #eff6ff);
}

main[data-component-file="Home.tsx"] .jn-actions h2 {
  color: var(--jnm-home-ink);
}

main[data-component-file="Home.tsx"] .jn-action-links {
  gap: 12px;
}

main[data-component-file="Home.tsx"] .jn-action-links a {
  min-height: 52px;
  padding: 0 20px;
  border: 0;
  border-radius: 12px;
  color: #fff;
  background: linear-gradient(90deg, #06b6d4, #3b82f6);
  box-shadow: var(--jnm-home-shadow-small);
  transition: box-shadow .22s ease, transform .22s ease;
}

main[data-component-file="Home.tsx"] .jn-action-links a:first-child {
  color: #fff;
  background: linear-gradient(90deg, #06b6d4, #3b82f6);
}

main[data-component-file="Home.tsx"] .jn-action-links a:nth-child(2) {
  color: #fff;
  background: linear-gradient(90deg, #f97316, #eab308);
}

main[data-component-file="Home.tsx"] .jn-action-links a:nth-child(3) {
  color: #1d4ed8;
  background: #fff;
  box-shadow: inset 0 0 0 1px #93c5fd;
}

main[data-component-file="Home.tsx"] .jn-action-links a:hover {
  color: #fff;
  background: #111827;
  transform: translateY(-2px);
  box-shadow: var(--jnm-home-shadow);
}

@media (max-width: 1120px) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child {
    min-height: 620px !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::after {
    width: 42vw;
    height: 450px;
    top: 84px;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child > div {
    padding-right: 49% !important;
  }

  main[data-component-file="Home.tsx"] .jn-model {
    grid-template-columns: 140px .8fr 1.3fr 120px;
  }
}

@media (max-width: 960px) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child {
    min-height: 760px !important;
    align-items: flex-start !important;
    padding: 52px 0 356px !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::after {
    top: auto;
    right: 32px;
    bottom: 32px;
    left: 32px;
    width: auto;
    height: 320px;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child > div {
    padding: 0 10px !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h1,
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2,
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child p {
    max-width: 760px !important;
  }

  main[data-component-file="Home.tsx"] .jn-model {
    grid-template-columns: 130px 1fr 1.45fr;
  }

  main[data-component-file="Home.tsx"] .jn-model-action {
    display: none;
  }

  main[data-component-file="Home.tsx"] .jn-evidence-layout {
    grid-template-columns: 1fr;
    gap: 44px;
  }
}

@media (max-width: 640px) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child {
    min-height: 760px !important;
    padding: 48px 0 310px !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::after {
    right: 14px;
    bottom: 40px;
    left: 14px;
    height: 232px;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child > div,
  main[data-component-file="Home.tsx"] .jn-loop-shell {
    width: calc(100% - 28px) !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h1 {
    font-size: clamp(2.1rem, 10vw, 2.75rem) !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2 {
    font-size: clamp(1.42rem, 6.2vw, 1.82rem) !important;
    line-height: 1.25 !important;
    letter-spacing: -.018em !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child p {
    font-size: 1rem !important;
    line-height: 1.72 !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child div > div:last-child {
    display: grid !important;
    grid-template-columns: 1fr;
  }

  main[data-component-file="Home.tsx"] .jn-loop-intro,
  main[data-component-file="Home.tsx"] .jn-scenarios,
  main[data-component-file="Home.tsx"] .jn-selector,
  main[data-component-file="Home.tsx"] .jn-evidence,
  main[data-component-file="Home.tsx"] .jn-cases {
    padding: 64px 0;
  }

  main[data-component-file="Home.tsx"] .jn-loop-heading,
  main[data-component-file="Home.tsx"] .jn-actions h2 {
    font-size: clamp(2rem, 9vw, 2.55rem);
  }

  main[data-component-file="Home.tsx"] .jn-audience-switch,
  main[data-component-file="Home.tsx"] .jn-scenario-grid,
  main[data-component-file="Home.tsx"] .jn-case-grid {
    grid-template-columns: 1fr;
  }

  main[data-component-file="Home.tsx"] .jn-audience-link,
  main[data-component-file="Home.tsx"] .jn-audience-link + .jn-audience-link {
    min-height: 110px;
    padding: 22px;
    border: 0;
  }

  main[data-component-file="Home.tsx"] .jn-scenario {
    min-height: 270px;
  }

  main[data-component-file="Home.tsx"] .jn-model {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 22px;
  }

  main[data-component-file="Home.tsx"] .jn-metric {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 12px;
  }

  main[data-component-file="Home.tsx"] .jn-case {
    min-height: 230px;
  }

  main[data-component-file="Home.tsx"] .jn-actions {
    padding: 58px 0;
  }

  main[data-component-file="Home.tsx"] .jn-action-links {
    display: grid;
    width: 100%;
  }

  main[data-component-file="Home.tsx"] .jn-action-links a {
    justify-content: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  main[data-component-file="Home.tsx"] *,
  main[data-component-file="Home.tsx"] *::before,
  main[data-component-file="Home.tsx"] *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}
/* Homepage palette and pointer-interaction refinement layered over product-ui-v1. */
:root {
  --jnm-home-ink: #081c34;
  --jnm-home-muted: #40566f;
  --jnm-home-cyan: #087a91;
  --jnm-home-blue: #2457a6;
  --jnm-home-indigo: #3154a8;
  --jnm-home-violet: #6f4a8e;
  --jnm-home-orange: #b84b0f;
  --jnm-home-gold: #9a6500;
  --jnm-home-line: #d4e0ee;
  --jnm-home-soft: #f5f8ff;
  --jnm-home-shadow: 0 26px 68px -30px rgba(20, 70, 126, .34), 0 16px 34px -24px rgba(44, 61, 105, .28);
  --jnm-home-shadow-small: 0 16px 36px -24px rgba(18, 67, 120, .30), 0 8px 20px -16px rgba(44, 61, 105, .22);
  --jnm-home-shadow-hover: 0 34px 80px -28px rgba(37, 99, 235, .36), 0 22px 48px -30px rgba(124, 58, 237, .34);
  --jnm-home-ease-out: cubic-bezier(.16, 1, .3, 1);
}

html[data-jnm-home-product-ui="20260830-v1"] {
  scrollbar-color: #4f73d8 #eaf1fb;
}

main[data-component-file="Home.tsx"] {
  color: var(--jnm-home-ink);
  background: #fbfdff;
}

main[data-component-file="Home.tsx"] ::selection {
  color: #fff;
  background: #3159c9;
}

main[data-component-file="Home.tsx"] a:focus-visible {
  outline: 3px solid #fff !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 6px #0e7490 !important;
}

/* A richer product-spectrum hero with a pointer-positioned light field. */
main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child {
  --jnm-hero-x: 68%;
  --jnm-hero-y: 30%;
  --jnm-hero-rx: 0deg;
  --jnm-hero-ry: 0deg;
  background:
    radial-gradient(circle at var(--jnm-hero-x) var(--jnm-hero-y), rgba(0, 183, 214, .25) 0, rgba(0, 183, 214, 0) 27%),
    radial-gradient(circle at 86% 7%, rgba(124, 58, 237, .19) 0, rgba(124, 58, 237, 0) 34%),
    radial-gradient(circle at 8% 94%, rgba(255, 122, 38, .13) 0, rgba(255, 122, 38, 0) 28%),
    linear-gradient(118deg, #e5fbff 0%, #edf4ff 42%, #f5efff 72%, #fff3e8 100%) !important;
  transition: background-position .45s var(--jnm-home-ease-out) !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::before {
  inset: auto auto -210px -130px;
  width: 500px;
  background: radial-gradient(circle, rgba(0, 159, 191, .24), rgba(79, 70, 217, .08) 40%, rgba(0, 159, 191, 0) 72%);
  filter: blur(3px);
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::after {
  outline: 1px solid rgba(255, 255, 255, .82);
  outline-offset: -1px;
  filter: saturate(1.1) contrast(1.035);
  box-shadow: 0 34px 80px -28px rgba(21, 70, 128, .42), 0 18px 44px -30px rgba(84, 44, 176, .38), 0 0 0 10px rgba(255, 255, 255, .28);
  transform: perspective(1200px) rotateX(var(--jnm-hero-rx)) rotateY(var(--jnm-hero-ry)) translateZ(0);
  transform-origin: center;
  transition: transform .7s var(--jnm-home-ease-out), box-shadow .7s var(--jnm-home-ease-out), filter .7s var(--jnm-home-ease-out);
  will-change: transform;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h1,
main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2,
main[data-component-file="Home.tsx"] .jn-loop-heading,
main[data-component-file="Home.tsx"] .jn-actions h2 {
  color: var(--jnm-home-ink) !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2 {
  position: relative;
  padding-bottom: 18px;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 112px;
  height: 4px;
  border-radius: 4px;
  background: linear-gradient(90deg, #087a91 0 38%, #2457a6 38% 70%, #6f4a8e 70% 84%, #b84b0f 84% 100%);
  box-shadow: 0 7px 18px rgba(37, 99, 235, .22);
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a,
main[data-component-file="Home.tsx"] .jn-action-links a {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: transform .45s var(--jnm-home-ease-out), box-shadow .45s var(--jnm-home-ease-out), filter .45s var(--jnm-home-ease-out) !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a::after,
main[data-component-file="Home.tsx"] .jn-action-links a::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -70%;
  left: -45%;
  width: 34%;
  height: 240%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .72), transparent);
  transform: translateX(-220%) rotate(18deg);
  transition: transform .85s var(--jnm-home-ease-out);
  pointer-events: none;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a:first-child,
main[data-component-file="Home.tsx"] .jn-action-links a:first-child {
  background: linear-gradient(105deg, #087a91 0%, #2457a6 66%, #6f4a8e 100%) !important;
  box-shadow: 0 15px 32px -16px rgba(37, 99, 235, .64) !important;
}

main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a:last-child {
  color: #92390a !important;
  background: rgba(255, 255, 255, .9) !important;
  box-shadow: inset 0 0 0 1px #7893a8, 0 13px 30px -22px rgba(146, 57, 10, .42) !important;
  backdrop-filter: blur(10px);
}

/* Alternating product surfaces keep the C1520 family but add chromatic depth. */
main[data-component-file="Home.tsx"] .jn-loop-intro {
  background:
    radial-gradient(circle at 8% 18%, rgba(0, 173, 204, .17), transparent 29%),
    radial-gradient(circle at 92% 80%, rgba(124, 58, 237, .12), transparent 33%),
    linear-gradient(110deg, #e7fbff 0%, #edf4ff 48%, #f7f1ff 76%, #fff7ee 100%);
}

main[data-component-file="Home.tsx"] .jn-selector {
  background:
    radial-gradient(circle at 82% 12%, rgba(79, 70, 217, .15), transparent 31%),
    radial-gradient(circle at 12% 90%, rgba(0, 169, 199, .13), transparent 32%),
    linear-gradient(112deg, #eefbff 0%, #edf3ff 44%, #f6efff 76%, #fff6ec 100%);
}

main[data-component-file="Home.tsx"] .jn-cases {
  background: linear-gradient(180deg, #f7faff 0%, #f2f7ff 100%);
}

main[data-component-file="Home.tsx"] .jn-actions {
  --jnm-hero-x: 76%;
  --jnm-hero-y: 34%;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #eaf4ff;
  background:
    radial-gradient(circle at var(--jnm-hero-x) var(--jnm-hero-y), rgba(0, 203, 232, .32), transparent 25%),
    radial-gradient(circle at 89% 12%, rgba(159, 91, 255, .38), transparent 32%),
    linear-gradient(118deg, #071c33 0%, #0b3b67 46%, #312e81 75%, #6d28d9 100%);
}

main[data-component-file="Home.tsx"] .jn-actions h2 {
  color: #fff !important;
  text-shadow: 0 12px 34px rgba(0, 0, 0, .22);
}

main[data-component-file="Home.tsx"] .jn-action-links a:nth-child(2) {
  color: #fff;
  background: linear-gradient(105deg, #b84b0f, #9a6500) !important;
  box-shadow: 0 15px 34px -18px rgba(242, 106, 33, .72) !important;
}

main[data-component-file="Home.tsx"] .jn-action-links a:nth-child(3) {
  color: #2457a6;
  background: #fff !important;
  box-shadow: 0 14px 32px -20px rgba(255, 255, 255, .52), inset 0 0 0 1px #7893a8 !important;
}

/* Pointer spotlight + responsive 3D tilt on meaningful interactive surfaces. */
main[data-component-file="Home.tsx"] .jn-audience-link,
main[data-component-file="Home.tsx"] .jn-scenario,
main[data-component-file="Home.tsx"] .jn-case,
main[data-component-file="Home.tsx"] .jn-report-meta {
  --jnm-pointer-x: 50%;
  --jnm-pointer-y: 50%;
  --jnm-tilt-x: 0deg;
  --jnm-tilt-y: 0deg;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transform: perspective(1100px) rotateX(var(--jnm-tilt-x)) rotateY(var(--jnm-tilt-y)) translate3d(0, 0, 0);
  transform-style: preserve-3d;
  transition: transform .55s var(--jnm-home-ease-out), box-shadow .55s var(--jnm-home-ease-out), filter .55s var(--jnm-home-ease-out);
}

main[data-component-file="Home.tsx"] .jn-audience-link::before,
main[data-component-file="Home.tsx"] .jn-scenario::before,
main[data-component-file="Home.tsx"] .jn-case::before,
main[data-component-file="Home.tsx"] .jn-report-meta::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: 0;
  background: radial-gradient(circle at var(--jnm-pointer-x) var(--jnm-pointer-y), rgba(77, 177, 255, .23), rgba(124, 58, 237, .07) 34%, transparent 67%);
  transition: opacity .45s var(--jnm-home-ease-out);
  pointer-events: none;
}

main[data-component-file="Home.tsx"] .jn-audience-link {
  background: linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(245, 249, 255, .94));
}

main[data-component-file="Home.tsx"] .jn-scenario {
  background: linear-gradient(145deg, #f8fbff, #fff 58%, #f6f4ff);
}

main[data-component-file="Home.tsx"] .jn-case,
main[data-component-file="Home.tsx"] .jn-case:nth-child(2),
main[data-component-file="Home.tsx"] .jn-case:nth-child(3) {
  background: linear-gradient(145deg, #fff, #f6faff 58%, #f6f2ff);
}

main[data-component-file="Home.tsx"] .jn-case:nth-child(2),
main[data-component-file="Home.tsx"] .jn-case:nth-child(4) {
  background: linear-gradient(145deg, #f0fbff, #fff 58%, #fff6ec);
}

main[data-component-file="Home.tsx"] .jn-audience-icon,
main[data-component-file="Home.tsx"] .jn-scenario svg,
main[data-component-file="Home.tsx"] .jn-model-code,
main[data-component-file="Home.tsx"] .jn-metric-value {
  transition: transform .55s var(--jnm-home-ease-out), color .45s var(--jnm-home-ease-out), filter .45s var(--jnm-home-ease-out);
}

main[data-component-file="Home.tsx"] .jn-audience-icon {
  color: #087a91;
  background: linear-gradient(145deg, #c9f6ff, #ddebff);
  box-shadow: 0 12px 24px -18px rgba(0, 127, 155, .7);
}

main[data-component-file="Home.tsx"] .jn-audience-link + .jn-audience-link .jn-audience-icon {
  color: #b84b0f;
  background: linear-gradient(145deg, #fff0dc, #ffe1cb);
  box-shadow: 0 12px 24px -18px rgba(184, 65, 8, .65);
}

main[data-component-file="Home.tsx"] .jn-model-grid,
main[data-component-file="Home.tsx"] .jn-metric-list {
  box-shadow: var(--jnm-home-shadow-hover);
}

main[data-component-file="Home.tsx"] .jn-model,
main[data-component-file="Home.tsx"] .jn-metric {
  --jnm-pointer-x: 50%;
  --jnm-pointer-y: 50%;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at var(--jnm-pointer-x) var(--jnm-pointer-y), rgba(73, 171, 255, 0), transparent 34%),
    #fff;
  transition: transform .48s var(--jnm-home-ease-out), background .48s var(--jnm-home-ease-out), box-shadow .48s var(--jnm-home-ease-out);
}

main[data-component-file="Home.tsx"] .jn-model:nth-child(even),
main[data-component-file="Home.tsx"] .jn-metric:nth-child(even) {
  background:
    radial-gradient(circle at var(--jnm-pointer-x) var(--jnm-pointer-y), rgba(73, 171, 255, 0), transparent 34%),
    #f5f8fd;
}

main[data-component-file="Home.tsx"] .jn-report-meta {
  background: linear-gradient(135deg, #fff2df, #fff9e8 55%, #f4f0ff);
  box-shadow: 0 20px 44px -28px rgba(212, 87, 15, .4), 0 12px 28px -24px rgba(79, 70, 217, .3);
}

main[data-component-file="Home.tsx"] .jn-metric-value,
main[data-component-file="Home.tsx"] .jn-model .jn-model-action,
main[data-component-file="Home.tsx"] .jn-case span {
  color: #087a91 !important;
}

main[data-component-file="Home.tsx"] .jn-scenario:nth-child(1) { --accent: #b84b0f !important; }
main[data-component-file="Home.tsx"] .jn-scenario:nth-child(2) { --accent: #087a91 !important; }
main[data-component-file="Home.tsx"] .jn-scenario:nth-child(3) { --accent: #2457a6 !important; }
main[data-component-file="Home.tsx"] .jn-scenario:nth-child(4) { --accent: #6f4a8e !important; }
main[data-component-file="Home.tsx"] .jn-model:nth-child(1) { --model: #b84b0f !important; }
main[data-component-file="Home.tsx"] .jn-model:nth-child(2) { --model: #2457a6 !important; }
main[data-component-file="Home.tsx"] .jn-model:nth-child(3) { --model: #087a91 !important; }
main[data-component-file="Home.tsx"] .jn-model:nth-child(4) { --model: #6f4a8e !important; }

@media (min-width: 961px) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child:hover::after {
    box-shadow: 0 46px 96px -30px rgba(25, 91, 170, .50), 0 24px 54px -30px rgba(124, 58, 237, .43), 0 0 0 10px rgba(255, 255, 255, .36);
    filter: saturate(1.16) contrast(1.04);
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-audience-link,
  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-scenario,
  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-case,
  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-report-meta {
    transform: perspective(1100px) rotateX(var(--jnm-tilt-x)) rotateY(var(--jnm-tilt-y)) translate3d(0, -9px, 0) scale(1.018);
    box-shadow: var(--jnm-home-shadow-hover);
    will-change: transform;
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-audience-link::before,
  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-scenario::before,
  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-case::before,
  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-report-meta::before {
    opacity: 1;
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active .jn-audience-icon {
    transform: translateZ(24px) scale(1.1) rotate(-4deg);
    filter: drop-shadow(0 10px 16px rgba(37, 99, 235, .18));
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-scenario svg {
    transform: translateZ(28px) translateY(-4px) scale(1.09);
    filter: drop-shadow(0 10px 14px color-mix(in srgb, var(--accent) 28%, transparent));
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-model {
    z-index: 2;
    background:
      radial-gradient(circle at var(--jnm-pointer-x) var(--jnm-pointer-y), color-mix(in srgb, var(--model) 24%, transparent) 0, transparent 38%),
      #fff;
    transform: translate3d(10px, 0, 0) scale(1.008);
    box-shadow: 0 18px 40px -28px color-mix(in srgb, var(--model) 62%, #2563eb);
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-model .jn-model-code {
    transform: translateX(4px) scale(1.06);
    filter: drop-shadow(0 8px 13px color-mix(in srgb, var(--model) 24%, transparent));
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-metric {
    z-index: 2;
    background:
      radial-gradient(circle at var(--jnm-pointer-x) var(--jnm-pointer-y), rgba(0, 174, 212, .20), transparent 38%),
      #fff;
    transform: translate3d(-8px, 0, 0) scale(1.008);
    box-shadow: 0 18px 42px -30px rgba(0, 126, 155, .5);
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jn-metric .jn-metric-value {
    transform: translateX(-4px) scale(1.06);
    filter: drop-shadow(0 8px 14px rgba(0, 126, 155, .2));
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .jn-action-links a:first-child.is-jnm-pointer-active {
    transform: translate3d(var(--jnm-magnet-x, 0), var(--jnm-magnet-y, 0), 0) translateY(-4px) scale(1.045) !important;
    box-shadow: 0 24px 48px -20px rgba(37, 99, 235, .64) !important;
    filter: saturate(1.14);
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .jn-action-links a:first-child.is-jnm-pointer-active::after {
    transform: translateX(520%) rotate(18deg);
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pressed {
    transform: perspective(1100px) rotateX(0) rotateY(0) translate3d(0, -2px, 0) scale(.985) !important;
    transition-duration: .12s !important;
  }
}

@media (max-width: 960px) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::after {
    transform: none;
    box-shadow: 0 28px 64px -32px rgba(21, 70, 128, .40), 0 0 0 7px rgba(255, 255, 255, .27);
  }
}

@media (max-width: 640px) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child {
    background:
      radial-gradient(circle at 82% 7%, rgba(124, 58, 237, .17), transparent 30%),
      radial-gradient(circle at 5% 70%, rgba(0, 183, 214, .18), transparent 30%),
      linear-gradient(155deg, #e7fbff 0%, #eef4ff 47%, #f7f0ff 75%, #fff3e8 100%) !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2 {
    padding-bottom: 14px;
    max-width: 100% !important;
    text-wrap: balance;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2::after {
    width: 86px;
    height: 3px;
  }

  main[data-component-file="Home.tsx"] .jn-actions {
    background:
      radial-gradient(circle at 85% 10%, rgba(159, 91, 255, .34), transparent 31%),
      linear-gradient(148deg, #071c33, #0b3b67 48%, #3f248f 100%);
  }
}

@media (prefers-reduced-motion: reduce) {
  main[data-component-file="Home.tsx"] {
    --jnm-hero-rx: 0deg !important;
    --jnm-hero-ry: 0deg !important;
    --jnm-tilt-x: 0deg !important;
    --jnm-tilt-y: 0deg !important;
    --jnm-magnet-x: 0 !important;
    --jnm-magnet-y: 0 !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::after,
  main[data-component-file="Home.tsx"] .jn-audience-link,
  main[data-component-file="Home.tsx"] .jn-scenario,
  main[data-component-file="Home.tsx"] .jn-case,
  main[data-component-file="Home.tsx"] .jn-report-meta,
  main[data-component-file="Home.tsx"] .jn-model,
  main[data-component-file="Home.tsx"] .jn-metric,
  main[data-component-file="Home.tsx"] .jn-action-links a,
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a {
    transform: none !important;
    filter: none !important;
    animation: none !important;
  }

  main[data-component-file="Home.tsx"] .jn-audience-link::before,
  main[data-component-file="Home.tsx"] .jn-scenario::before,
  main[data-component-file="Home.tsx"] .jn-case::before,
  main[data-component-file="Home.tsx"] .jn-report-meta::before {
    opacity: 0 !important;
  }
}

@media (forced-colors: active) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child,
  main[data-component-file="Home.tsx"] .jn-loop-intro,
  main[data-component-file="Home.tsx"] .jn-selector,
  main[data-component-file="Home.tsx"] .jn-actions,
  main[data-component-file="Home.tsx"] .jn-audience-link,
  main[data-component-file="Home.tsx"] .jn-scenario,
  main[data-component-file="Home.tsx"] .jn-model,
  main[data-component-file="Home.tsx"] .jn-report-meta,
  main[data-component-file="Home.tsx"] .jn-metric,
  main[data-component-file="Home.tsx"] .jn-case {
    color: CanvasText !important;
    background: Canvas !important;
    box-shadow: none !important;
    forced-color-adjust: auto;
  }
}

/* Direction 3: diagonal factory hero and the four-part deployable material system. */
main[data-component-file="Home.tsx"] .jnm-system-strip-v2 {
  position: relative;
  z-index: 5;
  padding: 0 28px;
  background: linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%);
  border-top: 1px solid rgba(75, 119, 190, .20);
  border-bottom: 1px solid rgba(75, 119, 190, .24);
  box-shadow: 0 18px 50px -42px rgba(22, 75, 147, .70);
}

main[data-component-file="Home.tsx"] .jnm-layer-strip-shell {
  width: min(1420px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 0;
}

main[data-component-file="Home.tsx"] .jnm-layer-card-v2 {
  --jnm-pointer-x: 50%;
  --jnm-pointer-y: 50%;
  --jnm-tilt-x: 0deg;
  --jnm-tilt-y: 0deg;
  position: relative;
  min-width: 0;
  min-height: 120px;
  display: grid;
  grid-template-columns: 42px 116px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 10px 20px 10px 18px;
  color: #0b2340;
  text-decoration: none;
  background:
    radial-gradient(circle at var(--jnm-pointer-x) var(--jnm-pointer-y), rgba(51, 112, 231, .14), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(245,249,255,.96));
  border: 1px solid rgba(85, 121, 176, .28);
  clip-path: polygon(5% 0, 95% 0, 100% 50%, 95% 100%, 5% 100%, 0 50%);
  box-shadow: 0 15px 38px -32px rgba(22, 62, 119, .62);
  transform: perspective(1100px) rotateX(var(--jnm-tilt-x)) rotateY(var(--jnm-tilt-y)) translate3d(0, 0, 0);
  transition: transform .46s var(--jnm-home-ease-out), border-color .3s ease, box-shadow .46s var(--jnm-home-ease-out), background .3s ease;
}

main[data-component-file="Home.tsx"] .jnm-layer-card-v2:focus-visible {
  z-index: 4;
  outline: 0 !important;
  box-shadow:
    inset 0 0 0 3px #fff,
    inset 0 0 0 6px #0b62cc,
    0 18px 44px -28px rgba(20, 74, 162, .72) !important;
}

main[data-component-file="Home.tsx"] .jnm-layer-card-v2::after {
  content: "";
  position: absolute;
  inset: 0 8% auto;
  height: 3px;
  background: linear-gradient(90deg, #3b82f6, #6d5dfc);
  opacity: .88;
}

main[data-component-file="Home.tsx"] .jnm-layer-card-v2.is-primary::after {
  background: linear-gradient(90deg, #ff7a00, #ffb000);
}

main[data-component-file="Home.tsx"] .jnm-layer-number-v2 {
  align-self: start;
  padding-top: 17px;
  color: #3269d7;
  font-size: .88rem;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .04em;
}

main[data-component-file="Home.tsx"] .jnm-layer-card-v2.is-primary .jnm-layer-number-v2 {
  color: #ad4800;
}

main[data-component-file="Home.tsx"] .jnm-layer-card-v2 img {
  width: 116px;
  height: 82px;
  object-fit: contain;
  mix-blend-mode: multiply;
  transform: translateZ(18px) scale(1);
  transition: transform .46s var(--jnm-home-ease-out), filter .46s var(--jnm-home-ease-out);
}

main[data-component-file="Home.tsx"] .jnm-layer-card-v2 strong {
  min-width: 0;
  color: #0b2340;
  font-size: clamp(1.02rem, 1.35vw, 1.28rem);
  line-height: 1.25;
  font-weight: 800;
  white-space: nowrap;
}

main[data-component-file="Home.tsx"] .jn-loop-intro {
  padding: 54px 0 72px;
  text-align: center;
  background:
    radial-gradient(circle at 14% 20%, rgba(58, 137, 246, .10), transparent 30%),
    radial-gradient(circle at 86% 75%, rgba(114, 83, 235, .09), transparent 30%),
    linear-gradient(180deg, #f8fbff 0%, #fff 100%);
}

main[data-component-file="Home.tsx"] .jn-loop-intro .jn-loop-heading {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  padding-bottom: 18px;
  font-size: clamp(2rem, 3vw, 2.85rem);
}

main[data-component-file="Home.tsx"] .jn-loop-intro .jn-loop-heading::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 54px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, #ff7a00, #3b82f6);
  transform: translateX(-50%);
}

main[data-component-file="Home.tsx"] .jn-loop-intro .jn-loop-lead {
  display: none;
}

main[data-component-file="Home.tsx"] .jn-loop-intro .jn-audience-switch {
  max-width: 1160px;
  margin: 34px auto 0;
  gap: 20px;
}

main[data-component-file="Home.tsx"] .jn-loop-intro .jn-audience-link,
main[data-component-file="Home.tsx"] .jn-loop-intro .jn-audience-link + .jn-audience-link {
  min-height: 112px;
  padding: 20px 28px;
  text-align: left;
  border: 1px solid rgba(78, 126, 202, .20) !important;
  border-radius: 16px;
  background: linear-gradient(135deg, #f5faff, #fff) !important;
  box-shadow: 0 18px 46px -34px rgba(26, 84, 166, .50);
}

main[data-component-file="Home.tsx"] .jn-loop-intro .jn-audience-link + .jn-audience-link {
  background: linear-gradient(135deg, #faf7ff, #fff) !important;
}

main[data-component-file="Home.tsx"] .jn-loop-intro .jn-audience-icon {
  width: 62px;
  height: 62px;
  padding: 15px;
  border-radius: 50%;
  color: #2869df;
  background: linear-gradient(145deg, #dcecff, #eef5ff);
  box-shadow: inset 0 0 0 1px rgba(59,130,246,.16);
}

main[data-component-file="Home.tsx"] .jn-loop-intro .jn-audience-link + .jn-audience-link .jn-audience-icon {
  color: #6f4be8;
  background: linear-gradient(145deg, #ece5ff, #f8f4ff);
  box-shadow: inset 0 0 0 1px rgba(111,75,232,.14);
}

@media (min-width: 1121px) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child {
    min-height: 560px !important;
    height: 560px;
    padding: 0 !important;
    background:
      radial-gradient(circle at 17% 20%, rgba(91, 176, 255, .15), transparent 26%),
      linear-gradient(115deg, #f0fbff 0%, #eef6ff 42%, #e9f1ff 64%, #fff 100%) !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::before {
    inset: 0 auto 0 0;
    width: 65%;
    height: auto;
    aspect-ratio: auto;
    border-radius: 0;
    background:
      radial-gradient(circle at var(--jnm-hero-x) var(--jnm-hero-y), rgba(77, 153, 255, .16), transparent 30%),
      linear-gradient(90deg, rgba(240,251,255,.96), rgba(235,244,255,.86));
    filter: none;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::after {
    top: 0;
    right: 0;
    width: 60%;
    height: 100%;
    border-radius: 0;
    outline: 0;
    background-position: center 48%;
    clip-path: polygon(40% 0, 100% 0, 100% 100%, 26% 100%, 10% 70%, 31% 28%);
    box-shadow: -26px 0 54px -44px rgba(21, 75, 157, .76);
    transform: perspective(1500px) rotateX(var(--jnm-hero-rx)) rotateY(var(--jnm-hero-ry)) scale(1.018) translateZ(0);
    transform-origin: 78% 50%;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child > div {
    min-height: 560px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: min(1380px, calc(100% - 64px)) !important;
    padding: 0 52% 0 32px !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h1 {
    margin-bottom: 10px !important;
    font-size: clamp(3rem, 4.2vw, 4.1rem) !important;
    line-height: 1.05 !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2 {
    margin-bottom: 22px !important;
    padding-bottom: 18px;
    font-size: clamp(2rem, 2.75vw, 2.75rem) !important;
    line-height: 1.15 !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child p {
    max-width: 34em !important;
    margin-bottom: 30px !important;
    font-size: clamp(1rem, 1.22vw, 1.14rem) !important;
    line-height: 1.75 !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a:first-child {
    color: #fff !important;
    background: linear-gradient(105deg, var(--jnm-home-orange), var(--jnm-home-gold)) !important;
    box-shadow: 0 18px 34px -18px rgba(154, 78, 0, .72) !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child a:last-child {
    color: #245dcc !important;
    background: rgba(255,255,255,.76) !important;
    box-shadow: inset 0 0 0 2px #3776e8, 0 14px 30px -24px rgba(37, 93, 204, .62) !important;
  }
}

@media (min-width: 1121px) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jnm-layer-card-v2 {
    z-index: 3;
    border-color: rgba(54, 112, 221, .58);
    box-shadow: 0 28px 62px -34px rgba(34, 88, 180, .68);
    transform: perspective(1100px) rotateX(var(--jnm-tilt-x)) rotateY(var(--jnm-tilt-y)) translate3d(0, -9px, 0) scale(1.025);
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] .is-jnm-pointer-active.jnm-layer-card-v2 img {
    transform: translateZ(34px) translateY(-6px) scale(1.09);
    filter: drop-shadow(0 14px 14px rgba(29, 82, 164, .20));
  }

  html[data-jnm-home-motion="20260830-v2"] main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child:hover::after {
    transform: perspective(1500px) rotateX(var(--jnm-hero-rx)) rotateY(var(--jnm-hero-ry)) scale(1.035) translateZ(0);
    box-shadow: -34px 0 70px -44px rgba(21, 86, 180, .88);
  }
}

@media (max-width: 1120px) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child {
    min-height: 760px !important;
    height: auto;
    align-items: flex-start !important;
    padding: 52px 0 356px !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child::after {
    top: auto;
    right: 32px;
    bottom: 32px;
    left: 32px;
    width: auto;
    height: 320px;
    border-radius: 16px;
    clip-path: none;
    transform: none;
    transform-origin: center;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child > div {
    width: min(1380px, calc(100% - 64px)) !important;
    padding: 0 10px !important;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h1,
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child h2,
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child p {
    max-width: 760px !important;
  }

  main[data-component-file="Home.tsx"] .jnm-system-strip-v2 {
    padding: 14px 22px;
  }

  main[data-component-file="Home.tsx"] .jnm-layer-strip-shell {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  main[data-component-file="Home.tsx"] .jnm-layer-card-v2 {
    min-height: 104px;
    grid-template-columns: 34px 92px minmax(0, 1fr);
    padding: 8px 18px;
    clip-path: none;
    border-radius: 14px;
  }

  main[data-component-file="Home.tsx"] .jnm-layer-card-v2 img {
    width: 92px;
    height: 68px;
  }
}

@media (max-width: 620px) {
  main[data-component-file="Home.tsx"] .jnm-system-strip-v2 {
    padding: 14px;
    overflow: hidden;
  }

  main[data-component-file="Home.tsx"] .jnm-layer-strip-shell {
    display: flex;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scrollbar-width: thin;
    padding: 2px 0 8px;
  }

  main[data-component-file="Home.tsx"] .jnm-layer-card-v2 {
    flex: 0 0 min(82vw, 300px);
    scroll-snap-align: center;
    grid-template-columns: 32px 88px minmax(0, 1fr);
  }

  main[data-component-file="Home.tsx"] .jn-loop-intro {
    padding: 48px 0 60px;
  }
}

/* Footer: match the supplied four-column information architecture without copying its purple palette. */
footer[data-component-file="Footer.tsx"] {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 82% 4%, rgba(87, 110, 255, .30), transparent 30%),
    radial-gradient(circle at 10% 88%, rgba(0, 176, 220, .18), transparent 28%),
    linear-gradient(118deg, #071c33 0%, #0a3159 48%, #293b91 100%) !important;
}

footer[data-component-file="Footer.tsx"]::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, #ff7900 0 15%, #2d7be8 40% 72%, #7658ee 100%);
}

footer[data-component-file="Footer.tsx"] > div {
  max-width: 1380px !important;
  padding: 80px 24px 22px !important;
}

footer[data-component-file="Footer.tsx"] > div > .grid {
  display: grid !important;
  grid-template-columns: 1.35fr 1.1fr .95fr .78fr !important;
  grid-template-rows: auto auto;
  align-items: start;
  column-gap: clamp(36px, 5vw, 82px) !important;
  row-gap: 28px !important;
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(1) {
  grid-column: 1;
  grid-row: 1 / span 2;
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(4) {
  grid-column: 2;
  grid-row: 1 / span 2;
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(2) {
  grid-column: 3;
  grid-row: 1;
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(5) {
  grid-column: 3;
  grid-row: 2;
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(3) {
  grid-column: 4;
  grid-row: 1 / span 2;
}

footer[data-component-file="Footer.tsx"] h4 {
  margin-bottom: 20px !important;
  color: #fff;
  font-size: 1rem !important;
  line-height: 1.35;
  font-weight: 800 !important;
  letter-spacing: .02em;
}

footer[data-component-file="Footer.tsx"] [data-junaimei-footer-logo-wrap] {
  display: block !important;
  margin-bottom: 26px;
}

footer[data-component-file="Footer.tsx"] [data-junaimei-footer-logo-wrap] img {
  width: 218px !important;
  height: auto !important;
  max-height: 92px;
  object-fit: contain;
  object-position: left center;
  filter: brightness(0) invert(1) !important;
}

footer[data-component-file="Footer.tsx"] [data-junaimei-footer-logo-wrap] > div {
  display: none !important;
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(1) > :nth-child(2) {
  color: rgba(255,255,255,.82) !important;
  line-height: 1.7;
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(1) > :nth-child(2) > :first-child {
  color: #fff;
  font-size: 1.02rem;
  font-weight: 800;
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(1) > :nth-child(2) > :nth-child(n+4) {
  display: none !important;
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(4) ul > :first-child {
  display: none !important;
}

footer[data-component-file="Footer.tsx"] ul {
  color: rgba(255,255,255,.82) !important;
}

footer[data-component-file="Footer.tsx"] li,
footer[data-component-file="Footer.tsx"] p {
  line-height: 1.7;
}

footer[data-component-file="Footer.tsx"] a {
  color: rgba(255,255,255,.84) !important;
  text-underline-offset: 5px;
  transition: color .22s ease, transform .22s ease, opacity .22s ease !important;
}

footer[data-component-file="Footer.tsx"] a:hover {
  color: #fff !important;
  transform: translateX(3px);
}

footer[data-component-file="Footer.tsx"] [data-official-store] {
  display: flex;
  align-items: center;
  gap: 10px;
}

footer[data-component-file="Footer.tsx"] [data-official-store] img {
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px;
  border-radius: 2px;
  object-fit: contain;
}

footer[data-component-file="Footer.tsx"] [data-official-store="tmall"] img {
  content: url("/home-store-tmall-v2.png?v=20260830-home-polish-v2");
}

footer[data-component-file="Footer.tsx"] [data-official-store="jd"] img {
  content: url("/home-store-jd-v2.png?v=20260830-home-polish-v2");
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(5) a {
  border: 1px solid rgba(255,255,255,.34);
  background: rgba(255,255,255,.07) !important;
  box-shadow: 0 10px 22px -16px rgba(0,0,0,.55);
  backdrop-filter: blur(8px);
}

footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(5) a:hover {
  background: rgba(255,255,255,.17) !important;
  transform: translateY(-3px);
}

footer[data-component-file="Footer.tsx"] > div > :last-child {
  margin-top: 75px !important;
  padding-top: 22px !important;
  color: rgba(255,255,255,.68) !important;
  border-color: rgba(255,255,255,.18) !important;
}

.jnm-back-top-v2 {
  position: fixed;
  z-index: 10001;
  right: 22px;
  bottom: 96px;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255,255,255,.52);
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(145deg, rgba(34, 93, 196, .94), rgba(75, 62, 179, .94));
  box-shadow: 0 18px 40px -18px rgba(13, 39, 87, .72);
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity .25s ease, transform .32s var(--jnm-home-ease-out), box-shadow .25s ease;
  backdrop-filter: blur(10px);
}

.jnm-back-top-v2 span {
  font-size: 1.45rem;
  line-height: 1;
}

.jnm-back-top-v2.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.jnm-back-top-v2:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 46px -18px rgba(13, 39, 87, .80);
}

.jnm-back-top-v2:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

@media (max-width: 1023px) {
  footer[data-component-file="Footer.tsx"] > div > .grid {
    grid-template-columns: 1.15fr 1fr !important;
  }

  footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(1) { grid-column: 1; grid-row: 1; }
  footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(4) { grid-column: 2; grid-row: 1; }
  footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(2) { grid-column: 1; grid-row: 2; }
  footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(5) { grid-column: 1; grid-row: 3; }
  footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(3) { grid-column: 2; grid-row: 2 / span 2; }
}

@media (max-width: 680px) {
  footer[data-component-file="Footer.tsx"] > div {
    padding: 52px 20px 20px !important;
  }

  footer[data-component-file="Footer.tsx"] > div > .grid {
    grid-template-columns: 1fr !important;
    row-gap: 36px !important;
  }

  footer[data-component-file="Footer.tsx"] > div > .grid > :nth-child(n) {
    grid-column: 1;
    grid-row: auto;
  }

  footer[data-component-file="Footer.tsx"] [data-junaimei-footer-logo-wrap] img {
    width: 190px !important;
  }

  footer[data-component-file="Footer.tsx"] > div > :last-child {
    margin-top: 38px !important;
    text-align: left !important;
    line-height: 1.7;
  }

  .jnm-back-top-v2 {
    right: 14px;
    bottom: 78px;
    width: 44px;
    height: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  main[data-component-file="Home.tsx"] .jnm-layer-card-v2,
  main[data-component-file="Home.tsx"] .jnm-layer-card-v2 img,
  .jnm-back-top-v2 {
    transform: none !important;
    animation: none !important;
    transition-duration: .01ms !important;
  }
}

@media (forced-colors: active) {
  main[data-component-file="Home.tsx"] .jnm-system-strip-v2,
  main[data-component-file="Home.tsx"] .jnm-layer-card-v2,
  footer[data-component-file="Footer.tsx"],
  .jnm-back-top-v2 {
    color: CanvasText !important;
    background: Canvas !important;
    border-color: CanvasText !important;
    box-shadow: none !important;
    forced-color-adjust: auto;
  }
}
/* Keep the Direction 3 hero copy at its approved 1488px measure on wider displays. */
@media (min-width: 1121px) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child > div {
    padding: 0 min(52%, 774px) 0 32px !important;
  }
}
/* Homepage hero height refinement: desktop only. */
@media (min-width: 1121px) {
  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child {
    min-height: 640px !important;
    height: 640px;
  }

  main[data-component-file="Home.tsx"] > section[data-component-file="Home.tsx"]:first-child > div {
    min-height: 640px;
  }
}
/*
 * Homepage visual-system bridge for Solution, Technical Academy, About and Contact.
 * CSS-only by design: every selector is scoped to an existing route-owned host.
 */

:root {
  --jnm-family-ink: #081c34;
  --jnm-family-muted: #40566f;
  --jnm-family-cyan: #087a91;
  --jnm-family-blue: #2457a6;
  --jnm-family-indigo: #3154a8;
  --jnm-family-violet: #6f4a8e;
  --jnm-family-orange: #b84b0f;
  --jnm-family-gold: #9a6500;
  --jnm-family-line: #d4e0ee;
  --jnm-family-canvas: #f5f8ff;
  --jnm-family-paper: #ffffff;
  --jnm-family-spectrum:
    radial-gradient(circle at 11% 18%, rgba(0, 173, 204, .15), transparent 28%),
    radial-gradient(circle at 88% 16%, rgba(124, 58, 237, .13), transparent 31%),
    radial-gradient(circle at 84% 92%, rgba(255, 122, 38, .10), transparent 25%),
    linear-gradient(112deg, #e8fbff 0%, #edf4ff 46%, #f7f1ff 76%, #fff7ee 100%);
  --jnm-family-dark:
    radial-gradient(circle at 78% 24%, rgba(0, 203, 232, .25), transparent 25%),
    radial-gradient(circle at 92% 8%, rgba(159, 91, 255, .32), transparent 30%),
    linear-gradient(118deg, #071c33 0%, #0b3b67 48%, #312e81 76%, #5b2b91 100%);
  --jnm-family-shadow: 0 26px 68px -30px rgba(20, 70, 126, .34), 0 16px 34px -24px rgba(44, 61, 105, .28);
  --jnm-family-shadow-small: 0 16px 36px -24px rgba(18, 67, 120, .30), 0 8px 20px -16px rgba(44, 61, 105, .22);
  --jnm-family-shadow-hover: 0 34px 80px -28px rgba(37, 99, 235, .36), 0 22px 48px -30px rgba(124, 58, 237, .30);
  --jnm-family-ease: cubic-bezier(.16, 1, .3, 1);
}

/* --------------------------------------------------------------------------
   Solution family — the renderer already owns motion and route transitions.
   -------------------------------------------------------------------------- */

main[data-jnm-external-route-host][data-owner="solution"] > article.jnm-lab[data-route^="/solution"] {
  --lab-navy: var(--jnm-family-ink);
  --lab-navy-deep: #071c33;
  --lab-blue: var(--jnm-family-blue);
  --lab-blue-bright: #3b82f6;
  --lab-orange: var(--jnm-family-orange);
  --lab-orange-ink: #92390a;
  --lab-ink: var(--jnm-family-ink);
  --lab-body: var(--jnm-family-muted);
  --lab-muted: #5b6e85;
  --lab-line: var(--jnm-family-line);
  --lab-wash: #edf4ff;
  --lab-paper: var(--jnm-family-paper);
  --lab-warm: #fff3e8;
  --lab-ease-out: var(--jnm-family-ease);
  color: var(--jnm-family-ink);
  background: linear-gradient(180deg, #f9fbff 0%, #f5f8ff 100%);
}

main[data-owner="solution"] > .jnm-lab[data-route="/solution"] {
  --lab-page-accent: var(--jnm-family-blue);
  --lab-page-strong: #173f84;
}

main[data-owner="solution"] > .jnm-lab[data-route="/solution/waterproofing"] {
  --lab-page-accent: var(--jnm-family-cyan);
  --lab-page-strong: #066375;
}

main[data-owner="solution"] > .jnm-lab[data-route="/solution/flooring"] {
  --lab-page-accent: var(--jnm-family-indigo);
  --lab-page-strong: #263f88;
}

main[data-owner="solution"] > .jnm-lab[data-route="/solution/anti-corrosion"] {
  --lab-page-accent: var(--jnm-family-violet);
  --lab-page-strong: #56336f;
}

main[data-owner="solution"] > .jnm-lab[data-route="/solution/coating"] {
  --lab-page-accent: var(--jnm-family-orange);
  --lab-page-strong: #92390a;
}

main[data-owner="solution"] > .jnm-lab[data-route="/solution/adhesive"] {
  --lab-page-accent: #515ac9;
  --lab-page-strong: #373b92;
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--jnm-family-spectrum);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .16), transparent 35%),
    radial-gradient(circle at 46% 70%, color-mix(in srgb, var(--lab-page-accent) 12%, transparent), transparent 34%);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-hero h1,
main[data-owner="solution"] > .jnm-lab .jnm-lab-detail__heading h2,
main[data-owner="solution"] > .jnm-lab .jnm-lab-subheading h2,
main[data-owner="solution"] > .jnm-lab .jnm-lab-chapter__body h2,
main[data-owner="solution"] > .jnm-lab .jnm-lab-chapter__body h3 {
  color: var(--jnm-family-ink);
  letter-spacing: -.025em;
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-hero__media {
  border: 1px solid rgba(255, 255, 255, .86);
  border-radius: 18px;
  box-shadow: var(--jnm-family-shadow);
  clip-path: polygon(11% 0, 100% 0, 100% 100%, 0 100%);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-hero__media::before {
  background: linear-gradient(90deg, var(--jnm-family-orange), var(--jnm-family-blue), var(--jnm-family-violet));
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-button:not(.jnm-lab-button--quiet) {
  color: #fff !important;
  background: linear-gradient(105deg, var(--jnm-family-orange), var(--jnm-family-gold));
  box-shadow: 0 16px 34px -17px rgba(184, 75, 15, .72);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-button--quiet {
  color: var(--jnm-family-blue);
  border-color: #7893a8;
  background: rgba(255, 255, 255, .90);
  box-shadow: inset 0 0 0 1px rgba(120, 147, 168, .18), 0 13px 30px -22px rgba(36, 87, 166, .40);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-nav-shell {
  border-color: #c9d9e9;
  background: rgba(248, 251, 255, .92);
  box-shadow: 0 18px 42px -34px rgba(8, 28, 52, .55);
  backdrop-filter: blur(14px) saturate(1.08);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-nav button[aria-current="true"],
main[data-owner="solution"] > .jnm-lab .jnm-lab-nav button[aria-pressed="true"] {
  color: var(--jnm-family-blue);
  background: #edf4ff;
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-content {
  background:
    radial-gradient(circle at 9% 14%, rgba(0, 166, 197, .07), transparent 24%),
    radial-gradient(circle at 91% 45%, rgba(111, 74, 142, .07), transparent 27%),
    #f9fbff;
}

main[data-owner="solution"] > .jnm-lab :is(.jnm-lab-detail, .jnm-lab-fact, .jnm-lab-system, .jnm-lab-note, .jnm-lab-table-wrap) {
  border-color: var(--jnm-family-line);
  background: rgba(255, 255, 255, .94);
  box-shadow: var(--jnm-family-shadow-small);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-fact {
  border-radius: 16px;
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-chapter {
  border-color: var(--jnm-family-line);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-chapter::before {
  background: linear-gradient(118deg, rgba(232, 251, 255, .82), rgba(237, 244, 255, .76) 48%, rgba(247, 241, 255, .72));
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-chapter__media,
main[data-owner="solution"] > .jnm-lab .jnm-lab-system__figure,
main[data-owner="solution"] > .jnm-lab .jnm-lab-stack {
  border-radius: 18px;
  box-shadow: var(--jnm-family-shadow-small);
}

main[data-owner="solution"] > .jnm-lab .jnm-layers-button {
  border-color: #cfdbeb;
  background: linear-gradient(110deg, #f7fbff, #f3f6ff);
}

main[data-owner="solution"] > .jnm-lab .jnm-layers-button[aria-pressed="true"] {
  border-color: var(--lab-page-accent);
  background: #fff;
  box-shadow: var(--jnm-family-shadow-small), inset 0 0 0 1px color-mix(in srgb, var(--lab-page-accent) 34%, transparent);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-table thead {
  color: #fff;
  background: linear-gradient(105deg, #0b3b67, #3154a8);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-cta {
  color: #eaf4ff;
  border: 0;
  background: var(--jnm-family-dark);
  box-shadow: var(--jnm-family-shadow);
}

main[data-owner="solution"] > .jnm-lab .jnm-lab-cta h2,
main[data-owner="solution"] > .jnm-lab .jnm-lab-cta p {
  color: #fff;
}

/* --------------------------------------------------------------------------
   Technical Academy family — high-specificity overrides for runtime styles.
   -------------------------------------------------------------------------- */

main[data-jnm-external-route-host][data-owner^="technical-"] {
  color: var(--jnm-family-ink);
  background: var(--jnm-family-canvas);
}

main[data-owner="technical-academy"] .academy-hub,
main[data-owner="technical-resin"] .coating-library-root,
main[data-owner="technical-coating"] .coating-library-root {
  color: var(--jnm-family-ink);
  background:
    radial-gradient(circle at 8% 24%, rgba(0, 169, 199, .07), transparent 24%),
    radial-gradient(circle at 92% 68%, rgba(111, 74, 142, .07), transparent 26%),
    var(--jnm-family-canvas);
}

main[data-owner="technical-academy"] .academy-hub__hero,
main[data-owner="technical-resin"] .coating-library-hero,
main[data-owner="technical-coating"] .coating-library-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--jnm-family-spectrum);
}

main[data-owner="technical-academy"] .academy-hub__hero::after,
main[data-owner="technical-resin"] .coating-library-hero::after,
main[data-owner="technical-coating"] .coating-library-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: 7%;
  bottom: -78px;
  width: 260px;
  height: 260px;
  border: 1px solid rgba(49, 84, 168, .14);
  border-radius: 50%;
  box-shadow: 0 0 0 40px rgba(8, 122, 145, .04), 0 0 0 86px rgba(111, 74, 142, .03);
}

main[data-owner="technical-academy"] .academy-hub__hero h1,
main[data-owner="technical-resin"] .coating-library-hero h1,
main[data-owner="technical-coating"] .coating-library-hero h1,
main[data-owner^="technical-"] .coating-library-heading h2,
main[data-owner="technical-academy"] .academy-hub__heading h2 {
  color: var(--jnm-family-ink);
  letter-spacing: -.025em;
}

main[data-owner="technical-academy"] .academy-hub__hero p,
main[data-owner="technical-resin"] .coating-library-hero p,
main[data-owner="technical-coating"] .coating-library-hero p,
main[data-owner^="technical-"] .coating-library-heading p,
main[data-owner="technical-academy"] .academy-hub__heading p {
  color: var(--jnm-family-muted);
}

main[data-owner="technical-academy"] .academy-hub__tabs,
main[data-owner="technical-resin"] .coating-library-tab-band,
main[data-owner="technical-coating"] .coating-library-tab-band {
  border-color: var(--jnm-family-line);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 16px 34px -32px rgba(8, 28, 52, .55);
}

main[data-owner="technical-academy"] .academy-hub__tabs a,
main[data-owner="technical-resin"] .coating-library-tabs a,
main[data-owner="technical-coating"] .coating-library-tabs a {
  color: #2a4059;
  background: #f1f5fb;
}

main[data-owner="technical-academy"] .academy-hub__tabs a.is-active {
  color: #fff;
  background: linear-gradient(105deg, var(--jnm-family-orange), var(--jnm-family-gold));
  box-shadow: 0 15px 30px -16px rgba(184, 75, 15, .65);
}

main[data-owner="technical-resin"] .coating-library-tabs a.is-active {
  color: #fff;
  background: linear-gradient(105deg, var(--jnm-family-blue), var(--jnm-family-indigo));
  box-shadow: 0 15px 30px -16px rgba(36, 87, 166, .62);
}

main[data-owner="technical-coating"] .coating-library-tabs a.is-active {
  color: #fff;
  background: linear-gradient(105deg, var(--jnm-family-cyan), var(--jnm-family-blue));
  box-shadow: 0 15px 30px -16px rgba(8, 122, 145, .62);
}

main[data-owner="technical-academy"] .academy-hub__content,
main[data-owner="technical-resin"] .coating-library-content,
main[data-owner="technical-coating"] .coating-library-content {
  padding-top: 64px;
}

main[data-owner="technical-academy"] .academy-hub__card,
main[data-owner="technical-resin"] .coating-library-card,
main[data-owner="technical-coating"] .coating-library-card {
  border: 1px solid rgba(196, 213, 231, .82);
  border-radius: 18px;
  background: rgba(255, 255, 255, .96);
  box-shadow: var(--jnm-family-shadow-small);
}

main[data-owner="technical-academy"] .academy-hub__card:nth-child(4n+1),
main[data-owner="technical-resin"] .coating-library-card:nth-child(4n+1),
main[data-owner="technical-coating"] .coating-library-card:nth-child(4n+1) {
  background: linear-gradient(145deg, #fff, #f2f8ff);
}

main[data-owner="technical-academy"] .academy-hub__card:nth-child(4n+2),
main[data-owner="technical-resin"] .coating-library-card:nth-child(4n+2),
main[data-owner="technical-coating"] .coating-library-card:nth-child(4n+2) {
  background: linear-gradient(145deg, #fff, #f7f2ff);
}

main[data-owner="technical-academy"] .academy-hub__card:nth-child(4n+3),
main[data-owner="technical-resin"] .coating-library-card:nth-child(4n+3),
main[data-owner="technical-coating"] .coating-library-card:nth-child(4n+3) {
  background: linear-gradient(145deg, #fff, #effbfb);
}

main[data-owner="technical-academy"] .academy-hub__card:nth-child(4n),
main[data-owner="technical-resin"] .coating-library-card:nth-child(4n),
main[data-owner="technical-coating"] .coating-library-card:nth-child(4n) {
  background: linear-gradient(145deg, #fff, #fff5ec);
}

main[data-owner="technical-academy"] .academy-hub__body strong,
main[data-owner^="technical-"] .coating-library-card-title {
  color: var(--jnm-family-ink);
}

main[data-owner="technical-academy"] .academy-hub__copy,
main[data-owner^="technical-"] .coating-library-card-copy {
  color: var(--jnm-family-muted);
}

main[data-owner="technical-academy"] .academy-hub__read,
main[data-owner="technical-academy"] .academy-hub__label,
main[data-owner="technical-resin"] .coating-library-read,
main[data-owner="technical-resin"] .coating-library-meta span:first-child {
  color: var(--jnm-family-blue);
}

main[data-owner="technical-coating"] .coating-library-read,
main[data-owner="technical-coating"] .coating-library-meta span:first-child {
  color: var(--jnm-family-cyan);
}

/* --------------------------------------------------------------------------
   About / Junaimei — stable editorial host, visual order remains untouched.
   -------------------------------------------------------------------------- */

[data-stable-editorial-host][data-stable-editorial-route="about:/about/junaimei"] {
  color: var(--jnm-family-ink);
  background:
    radial-gradient(circle at 8% 28%, rgba(0, 169, 199, .07), transparent 24%),
    radial-gradient(circle at 91% 64%, rgba(111, 74, 142, .07), transparent 27%),
    #f7faff;
}

[data-stable-editorial-route="about:/about/junaimei"] .stable-about-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--jnm-family-spectrum);
}

[data-stable-editorial-route="about:/about/junaimei"] .stable-about-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: 10%;
  bottom: -86px;
  width: 280px;
  height: 280px;
  border: 1px solid rgba(49, 84, 168, .14);
  border-radius: 50%;
  box-shadow: 0 0 0 44px rgba(8, 122, 145, .04), 0 0 0 96px rgba(111, 74, 142, .03);
}

[data-stable-editorial-route="about:/about/junaimei"] .stable-about-hero h1,
[data-stable-editorial-route="about:/about/junaimei"] .jnm-page h2,
[data-stable-editorial-route="about:/about/junaimei"] .jnm-page h3 {
  color: var(--jnm-family-ink);
  letter-spacing: -.025em;
}

[data-stable-editorial-route="about:/about/junaimei"] .stable-about-hero p,
[data-stable-editorial-route="about:/about/junaimei"] .jnm-page p {
  color: var(--jnm-family-muted);
}

[data-stable-editorial-route="about:/about/junaimei"] .stable-about-tabs-band {
  border-color: var(--jnm-family-line);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 16px 34px -32px rgba(8, 28, 52, .55);
}

[data-stable-editorial-route="about:/about/junaimei"] .stable-about-tabs a {
  color: #2a4059;
  background: #f1f5fb;
}

[data-stable-editorial-route="about:/about/junaimei"] .stable-about-tabs a.is-active,
[data-stable-editorial-route="about:/about/junaimei"] .stable-about-tabs a[data-accent="profile"].is-active {
  color: #fff !important;
  background: linear-gradient(105deg, var(--jnm-family-orange), var(--jnm-family-gold)) !important;
  box-shadow: 0 15px 30px -16px rgba(184, 75, 15, .65) !important;
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-page {
  --jnm-navy: var(--jnm-family-ink);
  --jnm-blue: var(--jnm-family-blue);
  --jnm-red: var(--jnm-family-orange);
  --jnm-ink: var(--jnm-family-ink);
  --jnm-muted: var(--jnm-family-muted);
  --jnm-line: var(--jnm-family-line);
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-lead__copy {
  border: 1px solid var(--jnm-family-line);
  border-radius: 18px;
  background: linear-gradient(135deg, #f0f8ff 0%, #fff 72%, #f8f3ff 100%);
  box-shadow: var(--jnm-family-shadow-small);
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-kicker,
[data-stable-editorial-route="about:/about/junaimei"] .jnm-factory__index {
  color: var(--jnm-family-orange);
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-lead__visual {
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 18px;
  background: var(--jnm-family-dark);
  box-shadow: var(--jnm-family-shadow);
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-lead__visual-inner,
[data-stable-editorial-route="about:/about/junaimei"] .jnm-lead__visual-inner span {
  color: #fff;
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-section-title::before {
  width: 5px;
  border-radius: 4px;
  background: linear-gradient(180deg, var(--jnm-family-cyan), var(--jnm-family-blue), var(--jnm-family-violet));
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-factory,
[data-stable-editorial-route="about:/about/junaimei"] .jnm-chain article {
  border-color: var(--jnm-family-line);
  border-radius: 18px;
  background: rgba(255, 255, 255, .96);
  box-shadow: var(--jnm-family-shadow-small);
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-factory:nth-child(2) {
  background: linear-gradient(145deg, #fff, #f5f1ff);
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-capacity strong {
  color: var(--jnm-family-blue);
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-closing {
  color: #eaf4ff !important;
  border: 0;
  background: var(--jnm-family-dark);
  box-shadow: var(--jnm-family-shadow);
}

[data-stable-editorial-route="about:/about/junaimei"] .jnm-closing :is(p, strong, span, a) {
  color: #eaf4ff !important;
}

/* --------------------------------------------------------------------------
   Contact — style only, never replace or reparent React-owned nodes.
   -------------------------------------------------------------------------- */

main[data-component-file="Contact.tsx"] {
  color: var(--jnm-family-ink);
  background: #f8fbff;
}

main[data-component-file="Contact.tsx"] > section:first-child {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--jnm-family-spectrum);
}

main[data-component-file="Contact.tsx"] > section:first-child::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: 8%;
  bottom: -82px;
  width: 260px;
  height: 260px;
  border: 1px solid rgba(49, 84, 168, .14);
  border-radius: 50%;
  box-shadow: 0 0 0 42px rgba(8, 122, 145, .04), 0 0 0 90px rgba(111, 74, 142, .03);
}

main[data-component-file="Contact.tsx"] > section:first-child h1,
main[data-component-file="Contact.tsx"] h2,
main[data-component-file="Contact.tsx"] h3 {
  color: var(--jnm-family-ink);
  letter-spacing: -.025em;
}

main[data-component-file="Contact.tsx"] > section:first-child p,
main[data-component-file="Contact.tsx"] p,
main[data-component-file="Contact.tsx"] li {
  color: var(--jnm-family-muted);
}

main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] {
  border-color: var(--jnm-family-line);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 16px 34px -32px rgba(8, 28, 52, .55);
}

main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a {
  color: #2a4059;
  background: #f1f5fb;
}

main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[aria-current="page"],
main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a.is-active,
main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[href="/contact"],
main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[class*="from-orange-500"][class*="to-yellow-500"] {
  color: #fff !important;
  background: linear-gradient(105deg, var(--jnm-family-orange), var(--jnm-family-gold)) !important;
  box-shadow: 0 15px 30px -16px rgba(184, 75, 15, .65) !important;
}

main[data-component-file="Contact.tsx"] .jnm-contact-enhanced {
  background:
    radial-gradient(circle at 12% 18%, rgba(0, 169, 199, .08), transparent 25%),
    radial-gradient(circle at 88% 80%, rgba(111, 74, 142, .07), transparent 26%),
    #f8fbff;
}

main[data-component-file="Contact.tsx"] .jnm-intro,
main[data-component-file="Contact.tsx"] .jnm-audience,
main[data-component-file="Contact.tsx"] .jnm-project-note {
  border-color: var(--jnm-family-line);
  border-radius: 18px;
  background: linear-gradient(120deg, #effbfa, #f3f7ff 58%, #faf5ff);
  box-shadow: var(--jnm-family-shadow-small);
}

main[data-component-file="Contact.tsx"] .jnm-pills > *,
main[data-component-file="Contact.tsx"] .jnm-audience span {
  border-color: #cad8e7;
  color: #334b65;
  background: #fff;
}

main[data-component-file="Contact.tsx"] > section:last-child {
  background:
    radial-gradient(circle at 6% 42%, rgba(0, 169, 199, .06), transparent 25%),
    radial-gradient(circle at 94% 16%, rgba(111, 74, 142, .06), transparent 27%),
    #f8fbff;
}

main[data-component-file="Contact.tsx"] > section:last-child > div > .grid > div:last-child {
  border: 1px solid var(--jnm-family-line);
  border-radius: 18px;
  background: linear-gradient(145deg, #fff, #f4f7ff);
  box-shadow: var(--jnm-family-shadow);
}

main[data-component-file="Contact.tsx"] :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border-color: #bacbe0;
  color: var(--jnm-family-ink);
  background: rgba(255, 255, 255, .96);
  box-shadow: inset 0 1px 2px rgba(8, 28, 52, .04);
}

main[data-component-file="Contact.tsx"] :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
  border-color: var(--jnm-family-blue);
  box-shadow: 0 0 0 4px rgba(36, 87, 166, .14), 0 14px 28px -20px rgba(36, 87, 166, .38);
}

main[data-component-file="Contact.tsx"] button[type="submit"] {
  color: #fff;
  background: linear-gradient(105deg, var(--jnm-family-orange), var(--jnm-family-gold));
  box-shadow: 0 16px 34px -17px rgba(184, 75, 15, .72);
}

main[data-component-file="Contact.tsx"] button[type="submit"]:focus-visible,
main[data-component-file="Contact.tsx"] a:focus-visible,
[data-stable-editorial-route="about:/about/junaimei"] a:focus-visible,
main[data-owner^="technical-"] a:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
  box-shadow: 0 0 0 6px var(--jnm-family-cyan);
}

/* --------------------------------------------------------------------------
   Fine-pointer feedback. Existing scripted tilt variables remain authoritative.
   -------------------------------------------------------------------------- */

@media (min-width: 961px) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  [data-stable-editorial-route="about:/about/junaimei"] .jnm-factory,
  [data-stable-editorial-route="about:/about/junaimei"] .jnm-chain article,
  main[data-component-file="Contact.tsx"] .jnm-intro,
  main[data-component-file="Contact.tsx"] .jnm-audience,
  main[data-component-file="Contact.tsx"] > section:last-child > div > .grid > div:last-child {
    transition: transform .45s var(--jnm-family-ease), box-shadow .45s var(--jnm-family-ease), border-color .3s ease;
  }

  [data-stable-editorial-route="about:/about/junaimei"] .jnm-factory:hover,
  [data-stable-editorial-route="about:/about/junaimei"] .jnm-chain article:hover,
  main[data-component-file="Contact.tsx"] .jnm-intro:hover,
  main[data-component-file="Contact.tsx"] .jnm-audience:hover,
  main[data-component-file="Contact.tsx"] > section:last-child > div > .grid > div:last-child:hover {
    border-color: rgba(83, 118, 178, .52);
    box-shadow: var(--jnm-family-shadow-hover);
    transform: translateY(-7px);
  }

  main[data-owner="solution"] > .jnm-lab .jnm-lab-button:not(.jnm-lab-button--quiet):hover,
  main[data-component-file="Contact.tsx"] button[type="submit"]:hover {
    filter: saturate(1.08) brightness(1.04);
    transform: translateY(-4px) scale(1.01);
  }
}

/* --------------------------------------------------------------------------
   Responsive and motion safeguards.
   -------------------------------------------------------------------------- */

@media (max-width: 960px) {
  main[data-owner="solution"] > .jnm-lab .jnm-lab-hero__media {
    clip-path: none;
  }

  main[data-owner="technical-academy"] .academy-hub__content,
  main[data-owner="technical-resin"] .coating-library-content,
  main[data-owner="technical-coating"] .coating-library-content {
    padding-top: 52px;
  }
}

@media (max-width: 680px) {
  main[data-owner="technical-academy"] .academy-hub__tabs {
    justify-content: flex-start !important;
    padding-inline: 18px;
    scrollbar-width: none;
  }

  main[data-owner="technical-academy"] .academy-hub__tabs::-webkit-scrollbar {
    display: none;
  }
}

@media (max-width: 640px) {
  main[data-owner="solution"] > .jnm-lab .jnm-lab-hero::before,
  main[data-owner="technical-academy"] .academy-hub__hero::after,
  main[data-owner="technical-resin"] .coating-library-hero::after,
  main[data-owner="technical-coating"] .coating-library-hero::after,
  [data-stable-editorial-route="about:/about/junaimei"] .stable-about-hero::after,
  main[data-component-file="Contact.tsx"] > section:first-child::after {
    display: none;
  }

  main[data-owner="solution"] > .jnm-lab .jnm-lab-hero__media,
  main[data-owner="solution"] > .jnm-lab .jnm-lab-chapter__media,
  main[data-owner="solution"] > .jnm-lab .jnm-lab-system__figure,
  [data-stable-editorial-route="about:/about/junaimei"] .jnm-lead__copy,
  [data-stable-editorial-route="about:/about/junaimei"] .jnm-lead__visual,
  [data-stable-editorial-route="about:/about/junaimei"] .jnm-factory,
  main[data-component-file="Contact.tsx"] .jnm-intro,
  main[data-component-file="Contact.tsx"] .jnm-audience,
  main[data-component-file="Contact.tsx"] > section:last-child > div > .grid > div:last-child {
    border-radius: 14px;
  }
}

@media (prefers-reduced-motion: reduce), (pointer: coarse) {
  [data-stable-editorial-route="about:/about/junaimei"] .jnm-factory,
  [data-stable-editorial-route="about:/about/junaimei"] .jnm-chain article,
  main[data-component-file="Contact.tsx"] .jnm-intro,
  main[data-component-file="Contact.tsx"] .jnm-audience,
  main[data-component-file="Contact.tsx"] > section:last-child > div > .grid > div:last-child,
  main[data-component-file="Contact.tsx"] button[type="submit"] {
    transition: none !important;
    transform: none !important;
  }
}
/* Homepage closing CTA: quieter light surface, scoped to the Home route only. */
main[data-component-file="Home.tsx"] .jn-actions {
  color: var(--jnm-home-ink, #081c34);
  background:
    radial-gradient(circle at var(--jnm-hero-x, 76%) var(--jnm-hero-y, 34%), rgba(8, 122, 145, .10), transparent 29%),
    radial-gradient(circle at 89% 12%, rgba(111, 74, 142, .10), transparent 34%),
    linear-gradient(118deg, #f8fcff 0%, #eef6ff 46%, #f5f2ff 76%, #fff8f0 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .94), inset 0 -1px 0 #cbdcf1;
}

main[data-component-file="Home.tsx"] .jn-actions h2 {
  color: var(--jnm-home-ink, #081c34) !important;
  text-shadow: none !important;
}
/* 20260831 UI stability: contact tabs, Academy heading, route footer guard. */

/* Keep the footer below the viewport while the SPA swaps external route hosts. */
html[data-jnm-route-transition="true"] #root main[data-component-file="layout.tsx"] {
  min-height: 100vh !important;
  min-height: 100svh !important;
}

/* The four Contact service tabs share one geometry and one active treatment. */
#root main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[href^="/contact"] {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 104px !important;
  min-width: 104px !important;
  height: 44px !important;
  padding: 0 16px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  background: #f1f5fb !important;
  color: #20364f !important;
  box-shadow: none !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  transform: none !important;
  transition: background-color 160ms ease, color 160ms ease,
    border-color 160ms ease, box-shadow 180ms ease !important;
}

#root main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[href^="/contact"][class*="bg-gradient-to-r"],
#root main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[href^="/contact"][aria-current="page"],
#root main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[href^="/contact"].is-active {
  border-color: transparent !important;
  background: linear-gradient(105deg, #b84b0f 0%, #9a6500 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 24px rgba(154, 74, 15, 0.2) !important;
  transform: none !important;
}

#root main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[href^="/contact"]:focus-visible {
  outline: 3px solid #2f72c9 !important;
  outline-offset: 3px !important;
}

/* Match the strong title hierarchy already used by the Downloads page. */
main[data-jnm-external-route-host][data-owner="technical-academy"] .academy-hub__hero h1 {
  font-weight: 800 !important;
}

@media (hover: hover) and (pointer: fine) {
  #root main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[href^="/contact"]:not([class*="bg-gradient-to-r"]):not([aria-current="page"]):not(.is-active):hover {
    border-color: #c9d7e8 !important;
    background: #e7eef8 !important;
    color: #143452 !important;
  }
}

/* Keep the Technical Academy landing title aligned with its editorial pages. */
#root main[data-component-file="News.tsx"]:has(nav[aria-label="技术学院分类"]) > section:first-child h1 {
  font-weight: 800 !important;
}
/* 20260831: keep route transitions and Contact tab surfaces visually stable. */

/* Preserve the existing layout guard and also cover external SPA route hosts. */
html[data-jnm-route-transition="true"] main[data-jnm-external-route-host="true"] {
  min-height: 100vh !important;
  min-height: 100svh !important;
}

/*
 * Contact service tabs render in different route-owned sections. Paint one
 * viewport-wide surface from the shared nav itself so every route keeps the
 * same white band without moving or reparenting route content.
 */
#root main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate;
}

#root main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs]::before {
  position: absolute;
  z-index: -1;
  top: -48px;
  right: 0;
  bottom: -48px;
  left: 0;
  background: #ffffff;
  box-shadow: 0 0 0 100vmax #ffffff;
  clip-path: inset(0 -100vmax);
  content: "";
  pointer-events: none;
}
/* Contact route motion synchronization.
   Keep the stronger depth response while preventing either child panel from
   visually detaching from the page transition. */
@media (min-width: 961px) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  main[data-component-file="Contact.tsx"] .jnm-intro,
  main[data-component-file="Contact.tsx"] .jnm-audience {
    transition: transform .14s cubic-bezier(.4, 0, 1, 1),
      box-shadow .16s cubic-bezier(.4, 0, 1, 1),
      border-color .16s ease;
  }

  main[data-component-file="Contact.tsx"] .jnm-intro:hover,
  main[data-component-file="Contact.tsx"] .jnm-audience:hover {
    transform: translateY(-3px);
    transition-duration: .18s;
    transition-timing-function: cubic-bezier(.16, 1, .3, 1);
  }
}

@media (prefers-reduced-motion: reduce), (pointer: coarse) {
  main[data-component-file="Contact.tsx"] .jnm-intro,
  main[data-component-file="Contact.tsx"] .jnm-audience {
    transform: none !important;
    transition: none !important;
  }
}
.jn-content-page{--ink:#172033;--muted:#5d6678;--line:#dfe4ea;--orange:#e96424;--warm:#f7f3eb;background:#fff;color:var(--ink);min-height:70vh;font-family:inherit}
.jn-content-page *{box-sizing:border-box}.jn-content-page a:focus-visible{outline:3px solid #f28a50;outline-offset:4px}.jn-content-page ::selection{background:#f5c8ad;color:#172033}
.jn-content-shell{width:min(1180px,calc(100% - 40px));margin-inline:auto}.jn-content-hero{padding:92px 0 72px;background:var(--warm);border-top:1px solid #eee7db}.jn-breadcrumb{font-size:.9rem;color:var(--muted);margin-bottom:38px}.jn-breadcrumb a{color:inherit;text-decoration:none}.jn-content-hero h1{font-size:clamp(2.5rem,5vw,5.6rem);line-height:1.02;letter-spacing:-.04em;max-width:980px;margin:0 0 28px}.jn-content-hero p{font-size:clamp(1rem,1.5vw,1.23rem);line-height:1.8;color:var(--muted);max-width:780px;margin:0}.jn-content-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}.jn-content-actions a{min-height:48px;padding:0 18px;display:inline-flex;align-items:center;border:1px solid #172033;text-decoration:none;color:#172033;font-weight:700}.jn-content-actions a:first-child{background:#172033;color:#fff}.jn-content-body{padding:84px 0}.jn-topic-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}.jn-topic{padding:32px 28px 34px 0;border-bottom:1px solid var(--line);color:inherit;text-decoration:none;min-height:220px}.jn-topic:nth-child(even){border-left:1px solid var(--line);padding-left:34px}.jn-topic b{display:block;color:var(--orange);font-variant-numeric:tabular-nums;margin-bottom:36px}.jn-topic h2{font-size:clamp(1.35rem,2vw,2rem);margin:0 0 12px}.jn-topic p{margin:0;color:var(--muted);line-height:1.7}.jn-article-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:72px}.jn-article{font-size:1.06rem;line-height:1.9}.jn-article h2{font-size:clamp(1.65rem,3vw,2.7rem);line-height:1.15;letter-spacing:-.025em;margin:70px 0 20px}.jn-article h2:first-child{margin-top:0}.jn-article h3{font-size:1.25rem;margin:38px 0 12px}.jn-article p{color:#3f4858;margin:0 0 20px}.jn-article ul{padding-left:1.2em;color:#3f4858}.jn-article li{margin:8px 0}.jn-side-nav{position:sticky;top:120px;align-self:start;border-top:1px solid var(--line)}.jn-side-nav a{display:block;padding:16px 4px;border-bottom:1px solid var(--line);color:var(--muted);text-decoration:none;line-height:1.45}.jn-side-nav a:hover{color:var(--orange)}.jn-compare{width:100%;border-collapse:collapse;margin:26px 0;font-size:.95rem}.jn-compare th,.jn-compare td{text-align:left;padding:14px;border-bottom:1px solid var(--line);vertical-align:top}.jn-compare th{background:#f3f5f7}.jn-model-table{border-top:1px solid var(--line)}.jn-model-row{display:grid;grid-template-columns:150px 1fr 1fr;gap:24px;padding:24px 0;border-bottom:1px solid var(--line)}.jn-model-row b{font-size:1.45rem;color:var(--orange)}.jn-disclaimer{padding:22px 24px;background:#f3f5f7;color:var(--muted);font-size:.92rem;line-height:1.7;margin:34px 0}.jn-next{padding:70px 0;background:#172033;color:#fff}.jn-next h2{font-size:clamp(2rem,4vw,3.8rem);margin:0 0 25px;letter-spacing:-.035em}.jn-next a{color:#fff;font-weight:700;text-underline-offset:4px}.jn-product-facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);margin-top:48px}.jn-product-fact{padding:22px 18px 22px 0;border-bottom:1px solid var(--line)}.jn-product-fact+.jn-product-fact{border-left:1px solid var(--line);padding-left:18px}.jn-product-fact small{display:block;color:var(--muted);margin-bottom:8px}.jn-product-fact strong{font-size:1.08rem}.jn-app-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:24px 0}.jn-app{padding:24px;background:#f5f6f4}.jn-app strong{display:block;margin-bottom:8px}.jn-app span{color:var(--muted);line-height:1.6}
@media(max-width:800px){.jn-article-layout{grid-template-columns:1fr}.jn-side-nav{position:static;order:-1}.jn-product-facts{grid-template-columns:repeat(2,1fr)}.jn-product-fact:nth-child(3){border-left:0}.jn-model-row{grid-template-columns:1fr}.jn-content-hero{padding:70px 0 56px}}
@media(max-width:560px){.jn-content-shell{width:min(100% - 28px,1180px)}.jn-topic-grid,.jn-app-list{grid-template-columns:1fr}.jn-topic:nth-child(even){border-left:0;padding-left:0}.jn-content-body{padding:60px 0}.jn-product-facts{grid-template-columns:1fr}.jn-product-fact+.jn-product-fact{border-left:0;padding-left:0}.jn-content-hero h1{font-size:2.55rem}.jn-compare{display:block;overflow-x:auto}}
/*
 * Junaimei sitewide palette and interaction system v8.0.
 * One color rail: #FFE1D1 -> #BCE7FB, sampled into semantic roles.
 * Full gradients are rare; white and near-white surfaces carry the layout.
 * Error red is retained only for semantic validation and alerts.
 * Media, image containers and their readability overlays are not targeted.
 */

:root {
  --jnm-track-0: #ffe1d1;
  --jnm-track-1: #f7e2d6;
  --jnm-track-2: #eee3dc;
  --jnm-track-3: #e6e3e1;
  --jnm-track-4: #dee4e6;
  --jnm-track-5: #d5e5eb;
  --jnm-track-6: #cde6f1;
  --jnm-track-7: #c4e6f6;
  --jnm-track-8: #bce7fb;

  /* 用户指定的角色层次 */
  --jnm-brand: var(--jnm-track-7);
  --jnm-brand-hover: var(--jnm-track-8);
  --jnm-brand-subtle: #eef9fe;
  --jnm-page-background: #f7f9fa;
  --jnm-content-surface: #ffffff;
  --jnm-primary-text: #0b1f33;
  --jnm-secondary-text: #40566f;
  --jnm-border: var(--jnm-track-4);

  --jnm-tone-peach: var(--jnm-track-0);
  --jnm-tone-sky: var(--jnm-track-8);
  --jnm-surface-warm: #fff8f4;
  --jnm-surface-warm-wash: #fffbf9;
  --jnm-surface-neutral: var(--jnm-page-background);
  --jnm-surface-cool: var(--jnm-brand-subtle);
  --jnm-surface-cool-wash: #f7fcff;

  --jnm-gradient-site: linear-gradient(128deg, var(--jnm-track-0) 0%, var(--jnm-track-8) 100%);
  --jnm-gradient-warm: linear-gradient(128deg, var(--jnm-track-0) 0%, var(--jnm-track-3) 100%);
  --jnm-gradient-balanced: linear-gradient(128deg, var(--jnm-track-2) 0%, var(--jnm-track-6) 100%);
  --jnm-gradient-cool: linear-gradient(128deg, var(--jnm-track-4) 0%, var(--jnm-track-8) 100%);
  --jnm-gradient-cta: linear-gradient(128deg, var(--jnm-track-1) 0%, var(--jnm-track-4) 52%, var(--jnm-track-6) 100%);
  --jnm-gradient-warm-soft: linear-gradient(128deg, var(--jnm-surface-warm) 0%, #faf9f8 100%);
  --jnm-gradient-balanced-soft: linear-gradient(128deg, var(--jnm-surface-warm-wash) 0%, var(--jnm-surface-cool-wash) 100%);
  --jnm-gradient-cool-soft: linear-gradient(128deg, #f8fafb 0%, var(--jnm-surface-cool) 100%);
  --jnm-gradient-site-soft: var(--jnm-gradient-balanced-soft);
  --jnm-gradient-site-faint: var(--jnm-gradient-balanced-soft);

  --jnm-ink-strong: var(--jnm-primary-text);
  --jnm-ink-secondary: var(--jnm-secondary-text);
  --jnm-accent-ink: #24566f;
  --jnm-line: var(--jnm-border);
  --jnm-canvas: var(--jnm-page-background);
  --jnm-paper: var(--jnm-content-surface);
  --jnm-focus: #24566f;
  --jnm-shadow: 0 16px 34px -22px rgb(11 31 51 / 34%);
  --jnm-shadow-hover: 0 26px 54px -28px rgb(11 31 51 / 34%);
  --jnm-motion-ease: ease-out;
  --jnm-motion-fast: 160ms;
  --jnm-motion-medium: 180ms;
  --jnm-motion-card: 180ms;
  --jnm-motion-media: 200ms;
  --jnm-card-lift: -4px;
  --jnm-image-scale: 1.02;

  /* Compatibility aliases retain route coverage while carrying distinct roles. */
  --jnm-gradient-brand: var(--jnm-gradient-site);
  --jnm-gradient-brand-soft: var(--jnm-gradient-balanced-soft);
  --jnm-gradient-technical: var(--jnm-gradient-cool);
  --jnm-gradient-technical-soft: var(--jnm-gradient-cool-soft);
  --jnm-gradient-story: var(--jnm-gradient-warm);
  --jnm-gradient-story-soft: var(--jnm-gradient-warm-soft);
  --jnm-info: var(--jnm-accent-ink);
}

html.js-enabled {
  scrollbar-color: var(--jnm-tone-sky) #f1f6f8;
}

html.js-enabled body {
  color: var(--jnm-ink-strong);
  background-color: var(--jnm-page-background);
  caret-color: var(--jnm-accent-ink);
}

html.js-enabled main :where(h1, h2, h3) {
  text-wrap: balance;
}

html.js-enabled main :where(p, li) {
  text-wrap: pretty;
}

html.js-enabled :is(
  .jn-metric-value,
  .jnm-lab-table,
  .jnm-report-meta,
  [data-product-spec],
  [data-product-parameter]
) {
  font-variant-numeric: tabular-nums;
}

html.js-enabled ::selection {
  color: var(--jnm-ink-strong);
  background: var(--jnm-tone-sky);
}

html.js-enabled ::-webkit-scrollbar {
  width: 11px;
}

html.js-enabled ::-webkit-scrollbar-track {
  background: #f1f6f8;
}

html.js-enabled ::-webkit-scrollbar-thumb {
  border: 3px solid #f1f6f8;
  border-radius: 999px;
  background: var(--jnm-brand);
}

html.js-enabled :is(a, button, [tabindex]):focus-visible {
  outline: 3px solid var(--jnm-focus) !important;
  outline-offset: 3px !important;
}

html.js-enabled a {
  text-underline-offset: 0.18em;
}

html.js-enabled footer[data-component-file="Footer.tsx"] {
  border-top: 3px solid transparent;
  border-image: var(--jnm-gradient-site) 1;
  color: #ffffff;
  background-color: #071c33 !important;
  background-image: none !important;
}

html.js-enabled footer[data-component-file="Footer.tsx"] :is(a, button):focus-visible {
  outline-color: var(--jnm-tone-sky) !important;
}

/* Header chrome uses the same sky-derived ink and the same active surface. */
html.js-enabled header[data-component-file="Header.tsx"] :is(
  [class^="text-orange-"], [class*=" text-orange-"],
  [class^="text-yellow-"], [class*=" text-yellow-"],
  [class^="text-green-"], [class*=" text-green-"],
  [class^="text-cyan-"], [class*=" text-cyan-"],
  [class^="text-blue-"], [class*=" text-blue-"],
  [class^="text-indigo-"], [class*=" text-indigo-"],
  [class^="text-violet-"], [class*=" text-violet-"],
  [class^="text-purple-"], [class*=" text-purple-"],
  [class^="text-pink-"], [class*=" text-pink-"]
) {
  color: var(--jnm-accent-ink) !important;
}

html.js-enabled header[data-component-file="Header.tsx"] [class*="bg-clip-text"] {
  color: var(--jnm-accent-ink) !important;
  background-image: none !important;
  -webkit-text-fill-color: currentColor !important;
}

html.js-enabled :is(
  .junaimei-tiered-nav__link.is-active,
  header[data-component-file="Header.tsx"] nav a[class*="bg-gradient-to-r"]
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-brand) !important;
  background-image: none !important;
  box-shadow: none !important;
  animation: none !important;
  text-shadow: none !important;
}

html.js-enabled :is(
  .junaimei-tiered-nav__link:hover,
  .junaimei-tiered-nav__item:focus-within > .junaimei-tiered-nav__link,
  .junaimei-tiered-nav__item.is-open > .junaimei-tiered-nav__link
) {
  color: var(--jnm-accent-ink) !important;
  text-shadow: none !important;
}

html.js-enabled .junaimei-tiered-nav__link::after,
html.js-enabled .junaimei-tiered-nav__sublink::before {
  background: var(--jnm-tone-sky) !important;
}

@media (max-width: 1023.98px) {
  html.js-enabled :is(.junaimei-tiered-nav__panel, .junaimei-tiered-nav__subpanel) {
    border-left-color: var(--jnm-line) !important;
  }
}

/* Heroes select different ranges from the approved rail. */
html.js-enabled main[data-component-file="Home.tsx"] > section:first-child {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-0) !important;
  background-image: var(--jnm-gradient-brand) !important;
}

html.js-enabled :is(
  main[data-jnm-external-route-host][data-owner="solution"] > article.jnm-lab[data-route^="/solution"] > .jnm-lab-hero,
  main[data-jnm-external-route-host][data-owner="solution"] .jnm-lab-hero,
  .jnm-solutions > .solution-hero,
  main[data-component-file="Products.tsx"] > section:first-child,
  .academy-hub__hero,
  .academy-category-hero-unified,
  .coating-library-hero,
  main[data-owner="technical-editorial"][data-stable-editorial-route] > .stable-technical-academy-hero,
  main[data-jnm-external-route-host][data-owner="technical-faq"] .academy-faq-unified__hero
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-4) !important;
  background-image: var(--jnm-gradient-technical) !important;
}

html.js-enabled :is(
  main[data-component-file="Applications.tsx"] > section:first-child,
  main[data-component-file="News.tsx"]:not([data-technical-academy-native-ready]) > section:first-child,
  main[data-component-file="About.tsx"] > section:first-child,
  [data-stable-editorial-host][data-stable-editorial-route^="about:"] .stable-about-hero
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-0) !important;
  background-image: var(--jnm-gradient-story) !important;
}

html.js-enabled main[data-component-file="Contact.tsx"] > section:first-child {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-2) !important;
  background-image: var(--jnm-gradient-balanced) !important;
}

html.js-enabled :is(
  article[data-component-file="ProductDetail.tsx"] > section:first-child,
  section[data-component-file="ProductDetail.tsx"].py-12,
  .coating-detail-hero,
  .jn-content-page:has(.jn-breadcrumb a[href="/products"]) > .jn-content-hero,
  .jn-content-page:has(.jn-breadcrumb a[href="/technical-academy"]) > .jn-content-hero,
  .cms-native-detail[data-cms-page-detail^="/solution/"] > .cms-native-detail__hero,
  .cms-native-detail[data-cms-page-detail^="/products/"] > .cms-native-detail__hero,
  .cms-native-detail[data-cms-page-detail^="/technical-academy/"] > .cms-native-detail__hero,
  main[data-component-file="NewsDetail.tsx"]:has(> section:first-child a[href="/technical-academy"]) > section:first-child
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-cool) !important;
  background-image: none !important;
}

html.js-enabled :is(
  main[data-component-file="ApplicationDetail.tsx"] > section:first-child,
  main[data-component-file="NewsDetail.tsx"] > section:first-child,
  .cms-native-detail:is([data-cms-page-detail^="/applications/"], [data-cms-page-detail^="/project-cases/"]) > .cms-native-detail__hero,
  .cms-native-detail[data-cms-page-detail^="/news/"] > .cms-native-detail__hero
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-warm) !important;
  background-image: none !important;
}

html.js-enabled :is(
  main[data-component-file="Home.tsx"] > section:first-child,
  main[data-component-file="Products.tsx"] > section:first-child,
  article[data-component-file="ProductDetail.tsx"] > section:first-child,
  main[data-component-file="Applications.tsx"] > section:first-child,
  main[data-component-file="ApplicationDetail.tsx"] > section:first-child,
  main[data-component-file="News.tsx"] > section:first-child,
  main[data-component-file="NewsDetail.tsx"] > section:first-child,
  main[data-component-file="About.tsx"] > section:first-child,
  main[data-component-file="Contact.tsx"] > section:first-child,
  .jnm-lab-hero,
  .solution-hero,
  .academy-hub__hero,
  .academy-category-hero-unified,
  .coating-library-hero,
  .coating-detail-hero,
  .stable-technical-academy-hero,
  .academy-faq-unified__hero,
  .stable-about-hero,
  .jn-content-hero,
  .cms-native-detail__hero
) :is(h1, h2, h3) {
  color: var(--jnm-ink-strong) !important;
  text-wrap: balance;
}

html.js-enabled :is(
  main[data-component-file="Home.tsx"] > section:first-child,
  main[data-component-file="Products.tsx"] > section:first-child,
  article[data-component-file="ProductDetail.tsx"] > section:first-child,
  main[data-component-file="Applications.tsx"] > section:first-child,
  main[data-component-file="ApplicationDetail.tsx"] > section:first-child,
  main[data-component-file="News.tsx"] > section:first-child,
  main[data-component-file="NewsDetail.tsx"] > section:first-child,
  main[data-component-file="About.tsx"] > section:first-child,
  main[data-component-file="Contact.tsx"] > section:first-child,
  .jnm-lab-hero,
  .solution-hero,
  .academy-hub__hero,
  .academy-category-hero-unified,
  .coating-library-hero,
  .coating-detail-hero,
  .stable-technical-academy-hero,
  .academy-faq-unified__hero,
  .stable-about-hero,
  .jn-content-hero,
  .cms-native-detail__hero
) p {
  color: var(--jnm-ink-secondary) !important;
}

/* Page background and content surface remain distinct from brand color. */
html.js-enabled :is(
  main[data-owner="solution"] > .jnm-lab[data-route^="/solution"],
  main[data-owner="solution"] > .jnm-lab[data-route^="/solution"] .jnm-lab-content,
  main[data-owner="technical-academy"] .academy-hub,
  main[data-owner="technical-resin"] .coating-library-root,
  main[data-owner="technical-coating"] .coating-library-root,
  [data-stable-editorial-host][data-stable-editorial-route^="about:"],
  main[data-component-file="Contact.tsx"] .jnm-contact-enhanced,
  main[data-component-file="Contact.tsx"] > section:last-child
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html.js-enabled :is(
  .academy-hub__tabs,
  .coating-library-tab-band,
  .stable-guide-index-band,
  .academy-global-switcher,
  .academy-sub-switcher,
  .academy-faq-unified__tabs-band
) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-surface-cool-wash) !important;
  background-image: none !important;
}

html.js-enabled [data-stable-editorial-route^="about:"] .stable-about-tabs-band {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-track-2) !important;
  background-color: var(--jnm-surface-warm-wash) !important;
  background-image: none !important;
}

html.js-enabled :is(
  main[data-component-file="Products.tsx"] > section:last-child,
  article[data-component-file="ProductDetail.tsx"] #product-parameter-note,
  article[data-component-file="ProductDetail.tsx"] > section:last-child,
  .jn-content-page:has(.jn-breadcrumb a[href="/products"]) > .jn-next,
  .jn-content-page:has(.jn-breadcrumb a[href="/technical-academy"]) > .jn-next,
  main[data-component-file="NewsDetail.tsx"]:has(> section:first-child a[href="/technical-academy"]) > section:last-child
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-cool) !important;
  background-image: var(--jnm-gradient-technical-soft) !important;
}

html.js-enabled :is(
  main[data-component-file="Applications.tsx"] > section:last-child,
  main[data-component-file="ApplicationDetail.tsx"] div[data-component-file="ApplicationDetail.tsx"]:has(> h3 + p + button),
  main[data-component-file="NewsDetail.tsx"] > section:last-child,
  main[data-component-file="About.tsx"] > section:last-child,
  .jnm-closing,
  .stable-certifications__closing,
  .stable-production__closing,
  .stable-company-gallery__closing,
  .stable-clients__closing
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-warm) !important;
  background-image: var(--jnm-gradient-story-soft) !important;
}

html.js-enabled :is(
  main[data-component-file="Contact.tsx"] .stable-quote-process__closing,
  main[data-component-file="Contact.tsx"] .stable-support-process__closing,
  main[data-component-file="Contact.tsx"] .business-partnership-content__support
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-neutral) !important;
  background-image: var(--jnm-gradient-balanced-soft) !important;
}

/* Solution landing and all five solution detail CTAs use a light, readable surface. */
html.js-enabled main[data-jnm-external-route-host][data-owner="solution"]
  > article.jnm-lab[data-route^="/solution"] .jnm-lab-cta {
  color: var(--jnm-ink-strong) !important;
  border: 1px solid var(--jnm-track-6) !important;
  background: var(--jnm-gradient-cta) !important;
  box-shadow: 0 18px 46px -34px rgb(11 31 51 / 34%) !important;
}

html.js-enabled main[data-jnm-external-route-host][data-owner="solution"]
  > article.jnm-lab[data-route^="/solution"] .jnm-lab-cta :is(h2, h3) {
  color: var(--jnm-ink-strong) !important;
}

html.js-enabled main[data-jnm-external-route-host][data-owner="solution"]
  > article.jnm-lab[data-route^="/solution"] .jnm-lab-cta p {
  color: var(--jnm-ink-secondary) !important;
}

html.js-enabled main[data-jnm-external-route-host][data-owner="solution"]
  > article.jnm-lab[data-route^="/solution"] .jnm-lab-cta .jnm-lab-button {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-accent-ink) !important;
  background: var(--jnm-brand-hover) !important;
  box-shadow: 0 10px 24px -14px rgb(11 31 51 / 32%) !important;
}

html.js-enabled main[data-jnm-external-route-host][data-owner="solution"]
  > article.jnm-lab[data-route^="/solution"] .jnm-lab-cta .jnm-lab-button:hover {
  background: var(--jnm-brand) !important;
}

html.js-enabled :is(
  main[data-owner="solution"] > .jnm-lab[data-route^="/solution"] .jnm-lab-cta,
  main[data-component-file="Products.tsx"] > section:last-child,
  main[data-component-file="Applications.tsx"] > section:last-child,
  article[data-component-file="ProductDetail.tsx"] > section:last-child,
  main[data-component-file="ApplicationDetail.tsx"] div[data-component-file="ApplicationDetail.tsx"]:has(> h3 + p + button),
  main[data-component-file="NewsDetail.tsx"] > section:last-child,
  main[data-component-file="About.tsx"] > section:last-child,
  .jn-content-page > .jn-next,
  .jnm-closing,
  .stable-certifications__closing,
  .stable-production__closing,
  .stable-company-gallery__closing,
  .stable-clients__closing,
  main[data-component-file="Contact.tsx"] .stable-quote-process__closing,
  main[data-component-file="Contact.tsx"] .stable-support-process__closing,
  main[data-component-file="Contact.tsx"] .business-partnership-content__support
) :is(h2, h3, p) {
  color: var(--jnm-ink-strong) !important;
}

/* Home keeps its factory media layer; only component-owned surfaces change. */
html[data-jnm-home-product-ui].js-enabled :is(
  .jn-loop-intro,
  .jn-evidence
) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled .jn-selector {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-cool) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled .jn-actions {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-warm) !important;
  background-image: var(--jnm-gradient-balanced-soft) !important;
}

html[data-jnm-home-product-ui].js-enabled .jnm-system-strip-v2 {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-neutral) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled .jn-report-meta {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-2) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled :is(.jn-scenarios, .jn-cases) {
  color: var(--jnm-ink-strong);
  background-color: var(--jnm-paper);
  background-image: none;
}

html[data-jnm-home-product-ui].js-enabled :is(
  .jn-audience-link,
  .jn-scenario,
  .jn-model,
  .jn-metric,
  .jn-case
) {
  border: 1px solid var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled :is(
  .jn-audience-link,
  .jn-scenario,
  .jn-model,
  .jn-metric,
  .jn-case
):hover {
  border-color: var(--jnm-brand-hover) !important;
  background-color: var(--jnm-surface-cool-wash) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled .jnm-layer-card-v2 {
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled .jn-scenario {
  --accent: var(--jnm-accent-ink) !important;
}

html[data-jnm-home-product-ui].js-enabled :is(
  .jn-scenario-index,
  .jn-scenario svg,
  .jn-model-code,
  .jn-model .jn-model-action,
  .jn-metric-value,
  .jn-case > span,
  .jn-audience-link:hover
) {
  color: var(--jnm-accent-ink) !important;
}

html[data-jnm-home-product-ui].js-enabled .jn-audience-icon {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-7) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled .jn-audience-link + .jn-audience-link .jn-audience-icon {
  background-color: var(--jnm-track-1) !important;
}

/* Route-safe action controls. Light surfaces always use dark readable text. */
html.js-enabled main :is(a, button)[class*="bg-gradient-to-"]:not(:has(img, picture, video, iframe)):not([class*="from-gray-"]):not([class*="from-black"]) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-brand) !important;
  background-image: none !important;
  box-shadow: 0 10px 24px -20px rgb(11 31 51 / 42%) !important;
}

html.js-enabled main :is(a, button)[class*="bg-gradient-to-"]:not(:has(img, picture, video, iframe)):not([class*="from-gray-"]):not([class*="from-black"]):hover {
  background-color: var(--jnm-brand-hover) !important;
  background-image: none !important;
}

html.js-enabled main :is(
  div[class*="bg-gradient-to-"]:not([class*="absolute"]),
  div[class*="bg-gradient-to-"][class*="rounded-full"],
  span[class*="bg-gradient-to-"]
):not(:has(img, picture, video, iframe)):not([class*="from-gray-"]):not([class*="from-black"]) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-track-4) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.js-enabled main :is(
  div[class*="bg-gradient-to-"]:not([class*="absolute"]),
  div[class*="bg-gradient-to-"][class*="rounded-full"],
  span[class*="bg-gradient-to-"]
):not([class*="from-gray-"]):not([class*="from-black"]) > :is(svg, span) {
  color: var(--jnm-ink-strong) !important;
}

html.js-enabled :is(header, main) [class*="bg-clip-text"] {
  color: var(--jnm-accent-ink) !important;
  background-image: none !important;
  -webkit-text-fill-color: currentColor !important;
}

html.js-enabled :is(
  main[data-component-file="Home.tsx"] > section:first-child a:first-child,
  main[data-component-file="Home.tsx"] .jn-action-links a:first-child,
  main[data-owner="solution"] .jnm-lab-button:not(.jnm-lab-button--quiet),
  .jn-content-actions a:first-child
) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-brand-hover) !important;
  background-image: none !important;
  box-shadow: var(--jnm-shadow) !important;
}

html.js-enabled main[data-component-file="Home.tsx"] > section:first-child a:first-child {
  background-color: var(--jnm-track-0) !important;
  background-image: var(--jnm-gradient-brand) !important;
}

html[data-jnm-home-product-ui].js-enabled main[data-component-file="Home.tsx"] > section:first-child a:last-child,
html[data-jnm-home-product-ui].js-enabled .jn-action-links a:nth-child(n + 2),
html.js-enabled main[data-owner="solution"] .jnm-lab-button--quiet {
  color: var(--jnm-accent-ink) !important;
  border-color: var(--jnm-tone-sky) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 1px var(--jnm-line) !important;
}

html.js-enabled :is(.stable-compact-contact__actions, .jnm-trust .jnm-actions) a:first-child,
html.js-enabled .jnm-trust aside > a {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-brand) !important;
  background-image: none !important;
}

html.js-enabled :is(.stable-compact-contact__actions, .jnm-trust .jnm-actions) a:nth-child(n + 2) {
  color: var(--jnm-accent-ink) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled .jn-action-links a:hover {
  color: #ffffff !important;
  background-color: var(--jnm-accent-ink) !important;
  background-image: none !important;
}

/* Interactive states injected by route runtimes. */
html.js-enabled :is(
  main[data-owner="solution"] .jnm-lab-nav button[aria-current="true"],
  main[data-owner="solution"] .jnm-lab-nav button[aria-pressed="true"],
  main[data-owner="solution"] .jnm-layers-button[aria-pressed="true"],
  .stable-guide-index-nav :is(a, button).is-active
) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-brand-hover) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.js-enabled main[data-owner="solution"] > .jnm-lab[data-route^="/solution"] {
  --lab-page-accent: var(--jnm-accent-ink) !important;
  --lab-page-strong: var(--jnm-accent-ink) !important;
  --lab-blue: var(--jnm-accent-ink) !important;
  --lab-orange: var(--jnm-accent-ink) !important;
  --lab-wash: var(--jnm-tone-sky) !important;
  --lab-warm: var(--jnm-tone-peach) !important;
  --lab-line: var(--jnm-line) !important;
}

html.js-enabled main[data-owner="solution"] > .jnm-lab[data-route^="/solution"] .jnm-lab-content [id] {
  --lab-module-accent: var(--jnm-accent-ink) !important;
  --lab-module-surface: var(--jnm-tone-sky) !important;
}

html.js-enabled main[data-owner="solution"] .jnm-layers-button {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html.js-enabled main[data-owner="solution"] .jnm-lab-table thead {
  color: #ffffff !important;
  background-color: var(--jnm-accent-ink) !important;
  background-image: none !important;
}

html.js-enabled body main[data-jnm-external-route-host][data-owner^="technical-"] :is(
  .academy-hub__tabs,
  .coating-library-tabs,
  .academy-faq-unified__tabs,
  .academy-global-tabs,
  section[data-technical-faq-tabs="true"] nav
) a:is(.is-active, [aria-current="page"]) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-brand-hover) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.js-enabled body main[data-owner="technical-academy"] .academy-hub__card .academy-hub__body,
html.js-enabled body main[data-owner^="technical-"] .coating-library-card-body {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html.js-enabled :is(
  .coating-detail-body > section,
  .coating-detail-note,
  .coating-related,
  .cms-faq-card
) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html.js-enabled :is(
  .academy-hub__read,
  .academy-hub__label,
  .coating-library-read,
  .coating-library-meta span:first-child,
  .coating-detail-label,
  .coating-detail-back,
  .coating-related [role="link"] > span
) {
  color: var(--jnm-accent-ink) !important;
}

html.js-enabled .academy-faq-unified :is([data-technical-faq-toggle], .cms-faq-toggle) > div > span:first-child {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-7) !important;
  background-image: none !important;
}

/* The unified FAQ renderer nests the icon well inside the button label span. */
html.js-enabled body #root
main[data-jnm-external-route-host][data-owner="technical-faq"]
.academy-faq-unified button.cms-faq-toggle
> span:first-child > span:first-child {
  color: var(--jnm-ink-strong) !important;
  background: var(--jnm-track-7) !important;
  box-shadow: inset 0 0 0 1px var(--jnm-track-8) !important;
}

html.js-enabled body [data-stable-editorial-host][data-stable-editorial-route^="about:"] .stable-about-tabs a.is-active,
html.js-enabled .academy-global-tabs a.is-active,
html.js-enabled .academy-faq-unified__tabs a.is-active {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-track-0) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.js-enabled :is(
  [data-stable-editorial-route^="about:"] .jnm-kicker,
  [data-stable-editorial-route^="about:"] .jnm-factory__index,
  [data-stable-editorial-route^="about:"] .jnm-capacity strong
) {
  color: var(--jnm-accent-ink) !important;
}

html.js-enabled [data-stable-editorial-route="about:/about/junaimei"] .jnm-lead__copy {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-surface-warm) !important;
  background-image: none !important;
}

html.js-enabled [data-stable-editorial-route="about:/about/junaimei"] .jnm-factory:nth-child(2) {
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html.js-enabled [data-stable-editorial-route="about:/about/junaimei"] .jnm-lead__visual {
  background-color: #071c33 !important;
  background-image: none !important;
}

html.js-enabled :is(.stable-quote-step, .stable-support-step, .business-partnership-mode) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html.js-enabled :is(.stable-company-profile__product, .stable-certifications__metric) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-track-2) !important;
  background-color: var(--jnm-surface-warm) !important;
  background-image: none !important;
}

html.js-enabled :is(.stable-company-profile__advantage:first-child, .stable-clients__mode) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-track-6) !important;
  background-color: var(--jnm-surface-cool) !important;
  background-image: none !important;
}

html.js-enabled :is(.stable-quote-step__number, .stable-support-step__number) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-6) !important;
  background-image: none !important;
}

html.js-enabled #root main[data-component-file="Contact.tsx"] nav[data-contact-service-tabs] a[href^="/contact"]:is(
  [aria-current="page"],
  .is-active,
  [class*="bg-gradient-to-r"]
) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-brand) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.js-enabled main[data-component-file="Contact.tsx"] button[type="submit"] {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-brand-hover) !important;
  background-image: none !important;
  box-shadow: var(--jnm-shadow) !important;
}

html.js-enabled main[data-component-file="Contact.tsx"] .jnm-intro {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html.js-enabled main[data-component-file="Contact.tsx"] .jnm-audience {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-track-6) !important;
  background-color: var(--jnm-surface-cool) !important;
  background-image: none !important;
}

html.js-enabled main[data-component-file="Contact.tsx"] .jnm-project-note {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-track-2) !important;
  background-color: var(--jnm-surface-warm) !important;
  background-image: none !important;
}

html.js-enabled main[data-component-file="Contact.tsx"] .jnm-pills > * {
  color: var(--jnm-accent-ink) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
}

html.js-enabled main[data-component-file="Contact.tsx"] > section:last-child > div > .grid > div:last-child {
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html.js-enabled main[data-component-file="Contact.tsx"] :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border-color: var(--jnm-line) !important;
}

html.js-enabled main[data-component-file="Contact.tsx"] :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
  border-color: var(--jnm-accent-ink) !important;
  box-shadow: 0 0 0 3px rgb(188 231 251 / 58%) !important;
}

/* Utility fallbacks respect the role hierarchy and avoid saturated page-sized blocks. */
html.js-enabled :is(header, main) :is(
  [class^="text-orange-"], [class*=" text-orange-"],
  [class^="text-yellow-"], [class*=" text-yellow-"],
  [class^="text-green-"], [class*=" text-green-"],
  [class^="text-emerald-"], [class*=" text-emerald-"],
  [class^="text-cyan-"], [class*=" text-cyan-"],
  [class^="text-blue-"], [class*=" text-blue-"],
  [class^="text-indigo-"], [class*=" text-indigo-"],
  [class^="text-violet-"], [class*=" text-violet-"],
  [class^="text-purple-"], [class*=" text-purple-"],
  [class^="text-pink-"], [class*=" text-pink-"]
) {
  color: var(--jnm-accent-ink) !important;
}

html.js-enabled main :is(
  [class^="bg-orange-"], [class*=" bg-orange-"],
  [class^="bg-yellow-"], [class*=" bg-yellow-"],
  [class^="bg-pink-"], [class*=" bg-pink-"]
):not(:has(img, picture, video, iframe)) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-warm) !important;
  background-image: none !important;
}

html.js-enabled main :is(
  [class^="bg-green-"], [class*=" bg-green-"],
  [class^="bg-emerald-"], [class*=" bg-emerald-"]
):not(:has(img, picture, video, iframe)) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-neutral) !important;
  background-image: none !important;
}

html.js-enabled main :is(
  [class^="bg-cyan-"], [class*=" bg-cyan-"],
  [class^="bg-blue-"], [class*=" bg-blue-"],
  [class^="bg-indigo-"], [class*=" bg-indigo-"],
  [class^="bg-violet-"], [class*=" bg-violet-"],
  [class^="bg-purple-"], [class*=" bg-purple-"]
):not(:has(img, picture, video, iframe)) {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-surface-cool) !important;
  background-image: none !important;
}

html.js-enabled :is(header, main) :is(
  [class^="border-orange-"], [class*=" border-orange-"],
  [class^="border-yellow-"], [class*=" border-yellow-"],
  [class^="border-green-"], [class*=" border-green-"],
  [class^="border-emerald-"], [class*=" border-emerald-"],
  [class^="border-cyan-"], [class*=" border-cyan-"],
  [class^="border-blue-"], [class*=" border-blue-"],
  [class^="border-indigo-"], [class*=" border-indigo-"],
  [class^="border-violet-"], [class*=" border-violet-"],
  [class^="border-purple-"], [class*=" border-purple-"],
  [class^="border-pink-"], [class*=" border-pink-"]
) {
  border-color: var(--jnm-line) !important;
}

/* Functional status colors remain semantic exceptions to the decorative rail. */
html.js-enabled main :is([role="status"], [data-status="success"]) {
  color: #166534 !important;
  border-color: #bbf7d0 !important;
  background-color: #f0fdf4 !important;
  background-image: none !important;
}

html.js-enabled main :is([role="status"], [data-status="success"]) :is(
  [class^="text-green-"], [class*=" text-green-"],
  [class^="text-emerald-"], [class*=" text-emerald-"]
) {
  color: #166534 !important;
}

/* Runtime CMS enhancements contain inline rainbow styles; keep their media intact. */
html.js-enabled [data-seo-enhancement]:not([data-seo-enhancement="breadcrumb"]) > :first-child:not(:has(img, picture, video)) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-track-6) !important;
  background-image: none !important;
}

html.js-enabled [data-seo-enhancement]:not([data-seo-enhancement="breadcrumb"]) :is(
  article,
  li,
  th,
  td,
  div
)[style*="gradient"]:not(:has(img, picture, video)) {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html.js-enabled [data-seo-enhancement]:not([data-seo-enhancement="breadcrumb"]) :is(a, button, [role="link"]) {
  color: var(--jnm-accent-ink) !important;
  border-color: var(--jnm-line) !important;
}

html.js-enabled .stable-company-news-card__tag {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-1) !important;
  background-image: none !important;
}

html.js-enabled .stable-company-news-card a {
  color: var(--jnm-accent-ink) !important;
}

/* Final shared accents: support launcher and Home heading marker. */
html.js-enabled body div.w-12.h-12.bg-gradient-to-br.from-blue-500.to-purple-600 {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-brand-hover) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled .jn-loop-heading::after {
  background-image: var(--jnm-gradient-balanced) !important;
}

html[data-jnm-home-product-ui].js-enabled main[data-component-file="Home.tsx"] > section:first-child::before {
  background-image:
    radial-gradient(circle at 68% 30%, rgb(196 230 246 / 44%), transparent 30%),
    linear-gradient(90deg, rgb(255 248 244 / 94%), rgb(238 249 254 / 88%)) !important;
}

html[data-jnm-home-product-ui].js-enabled main[data-component-file="Home.tsx"] > section:first-child h2::after {
  background-image: var(--jnm-gradient-balanced) !important;
}

html[data-jnm-home-product-ui].js-enabled body #root .jn-audience-link {
  border-color: var(--jnm-line) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
}

html[data-jnm-home-product-ui].js-enabled body #root .jn-audience-link::before {
  background-image: radial-gradient(
    circle,
    rgb(188 231 251 / 34%),
    rgb(255 225 209 / 12%) 38%,
    transparent 68%
  ) !important;
}

html[data-jnm-home-product-ui].js-enabled main[data-component-file="Home.tsx"] > section[data-md-id="src/pages/Home.tsx:118:8"] {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-track-2) !important;
  background-image: var(--jnm-gradient-balanced) !important;
}

html[data-jnm-home-product-ui].js-enabled main[data-component-file="Home.tsx"] > section[data-md-id="src/pages/Home.tsx:118:8"] :is(h2, h3, p, span, strong, div) {
  color: var(--jnm-ink-strong) !important;
}

html.js-enabled footer[data-component-file="Footer.tsx"]::before {
  background-image: none !important;
}

/* React About fallback: its former dark CTA now sits on the light source. */
html.js-enabled main[data-component-file="About.tsx"] > section:last-child :is(h2, p) {
  color: var(--jnm-ink-strong) !important;
}

/* Contact closing panels: pair every light surface with explicit readable copy. */
html.js-enabled main[data-component-file="Contact.tsx"]
  .business-partnership-content__support .business-partnership-assurances strong,
html.js-enabled main[data-component-file="Contact.tsx"]
  :is(.stable-quote-process__closing, .stable-support-process__closing) > strong {
  color: var(--jnm-ink-strong) !important;
}

html.js-enabled main[data-component-file="Contact.tsx"]
  .business-partnership-content__support .business-partnership-assurances span,
html.js-enabled main[data-component-file="Contact.tsx"]
  :is(.stable-quote-process__closing, .stable-support-process__closing) > span {
  color: var(--jnm-ink-secondary) !important;
}

html.js-enabled main[data-component-file="Contact.tsx"]
  .business-partnership-content__support .business-partnership-assurances li {
  border-color: var(--jnm-line) !important;
}

/* Editorial sibling-card blocks were explicitly removed from article endings. */
html.js-enabled :is(
  section.seo-enhancement[data-seo-enhancement="related-news"],
  main[data-owner="technical-coating"] section.coating-related,
  main[data-owner="technical-resin"] section.coating-related
) {
  display: none !important;
}

/* Construction records: one readable media-and-copy system for photos, films and tests. */
html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-photos[data-case-story-ready="true"] {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 34px !important;
  margin-top: 36px !important;
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, .92fr);
  align-items: stretch;
  gap: 0;
  min-height: 360px;
  overflow: hidden;
  color: var(--jnm-ink-strong);
  border: 1px solid var(--jnm-line);
  border-radius: 20px;
  background: var(--jnm-paper);
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-film.case-story,
html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story--test {
  width: 100%;
  margin-top: 30px;
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-photos > .case-story:nth-child(even) .case-story__media {
  order: 2;
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story__media,
html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story__media > a {
  display: block;
  min-width: 0;
  height: 100%;
  overflow: hidden;
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story__media img {
  width: 100% !important;
  height: 100% !important;
  min-height: 360px;
  max-height: 520px;
  object-fit: cover !important;
  object-position: center;
  border-radius: 0 !important;
  background: var(--jnm-surface-neutral) !important;
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story__media video {
  display: block;
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
  max-height: 540px !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  background: var(--jnm-ink-strong) !important;
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  padding: clamp(30px, 4vw, 52px);
  background: var(--jnm-gradient-cool-soft);
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-photos > .case-story:nth-child(even) .case-story__copy {
  background: var(--jnm-gradient-warm-soft);
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story__copy h3 {
  margin: 0 0 16px;
  color: var(--jnm-ink-strong);
  font-size: clamp(24px, 2.3vw, 34px);
  line-height: 1.32;
  letter-spacing: normal;
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story__body {
  max-width: 54ch;
  margin: 0;
  color: var(--jnm-ink-secondary);
  font-size: 16px;
  line-height: 1.85;
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story__note {
  max-width: 54ch;
  margin: 24px 0 0;
  padding-top: 18px;
  color: var(--jnm-accent-ink);
  border-top: 1px solid var(--jnm-line);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.75;
}

html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
  .case-records .case-story__note + .case-story__note {
  margin-top: 12px;
  padding-top: 0;
  border-top: 0;
}

/* A visible, high-contrast back-to-top control over both white pages and navy footer. */
html.js-enabled body .jnm-back-top-v2 {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  color: var(--jnm-ink-strong) !important;
  border: 1px solid rgb(255 255 255 / 92%) !important;
  border-radius: 17px !important;
  background-color: var(--jnm-track-8) !important;
  background-image: var(--jnm-gradient-site) !important;
  box-shadow:
    0 0 0 1px rgb(11 31 51 / 22%),
    0 18px 38px -14px rgb(11 31 51 / 56%) !important;
  font-size: 25px !important;
  font-weight: 800 !important;
}

html.js-enabled body .jnm-back-top-v2:hover {
  color: var(--jnm-ink-strong) !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
  box-shadow:
    0 0 0 2px var(--jnm-track-8),
    0 22px 46px -16px rgb(11 31 51 / 58%) !important;
}

html.js-enabled body .jnm-back-top-v2:focus-visible {
  outline: 3px solid var(--jnm-track-8) !important;
  outline-offset: 4px !important;
}

/* Route hold: the footer cannot occupy the viewport while the FAQ renderer is empty. */
html.jnm-academy-route-pending body main[data-component-file="layout.tsx"] {
  min-height: calc(100svh - 80px) !important;
}

html.jnm-academy-route-pending body main[data-jnm-external-route-host][data-owner^="technical-"],
html.jnm-academy-route-pending body main[data-jnm-external-route-host].jnm-react-outlet-suspended {
  display: block !important;
  min-height: calc(100svh - 80px) !important;
}

html.jnm-academy-route-pending body footer[data-component-file="Footer.tsx"] {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Restrained pointer feedback for interactive cards that did not already own motion. */
html.js-enabled body [data-jnm-motion-card="true"] {
  transform-origin: center;
  transition:
    transform var(--jnm-motion-card) var(--jnm-motion-ease),
    opacity var(--jnm-motion-fast) ease !important;
}

html.js-enabled body [data-jnm-motion-card="true"][data-jnm-motion-media="true"] img {
  transition:
    transform var(--jnm-motion-media) var(--jnm-motion-ease),
    opacity var(--jnm-motion-fast) ease !important;
}

html.js-enabled body [data-jnm-motion-action="true"] {
  transition:
    transform var(--jnm-motion-fast) var(--jnm-motion-ease),
    opacity var(--jnm-motion-fast) ease !important;
}

html.js-enabled body [data-jnm-motion-action="true"] :is(svg, [aria-hidden="true"]) {
  transition: transform var(--jnm-motion-fast) var(--jnm-motion-ease) !important;
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html.js-enabled body [data-jnm-motion-card="true"]:is(a, button):is(:hover, :focus-visible),
  html.js-enabled body [data-jnm-motion-card="true"]:has(:is(a, button):is(:hover, :focus-visible)) {
    transform: translateY(var(--jnm-card-lift)) !important;
    border-color: var(--jnm-track-8) !important;
    box-shadow: var(--jnm-shadow-hover) !important;
  }

  html.js-enabled body .jn-model[data-jnm-motion-card="true"]:is(:hover, :focus-visible),
  html.js-enabled body .jn-model[data-jnm-motion-card="true"]:has(:is(a, button):is(:hover, :focus-visible)) {
    transform: translateX(4px) !important;
  }

  html.js-enabled body [data-jnm-motion-card="true"][data-jnm-motion-media="true"]
    :is(a, button):is(:hover, :focus-visible) img,
  html.js-enabled body [data-jnm-motion-card="true"][data-jnm-motion-media="true"]
    :is(:hover, :focus-visible):is(a, button) img,
  html.js-enabled body [data-jnm-motion-card="true"][data-jnm-motion-media="true"]
    :has(:is(a, button):is(:hover, :focus-visible)) img {
    transform: scale(var(--jnm-image-scale)) !important;
  }

  html.js-enabled body [data-jnm-motion-card="true"]:is(a, button):is(:hover, :focus-visible)
    :is(h2, h3, strong),
  html.js-enabled body [data-jnm-motion-card="true"]:has(:is(a, button):is(:hover, :focus-visible))
    :is(h2, h3, strong) {
    color: var(--jnm-accent-ink) !important;
  }

  html.js-enabled body [data-jnm-motion-action="true"]:is(:hover, :focus-visible) {
    transform: translateY(-2px) !important;
    box-shadow: 0 14px 28px -18px rgb(11 31 51 / 48%) !important;
  }

  html.js-enabled body [data-jnm-motion-action="true"]:active {
    transform: translateY(1px) scale(.985) !important;
    transition-duration: 90ms !important;
  }

  html.js-enabled body [data-jnm-motion-action="true"]:is(:hover, :focus-visible)
    :is(svg, [aria-hidden="true"]) {
    transform: translateX(4px) !important;
  }
}

@media (max-width: 860px) {
  html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
    .case-records .case-story {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }

  html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
    .case-records .case-photos > .case-story:nth-child(even) .case-story__media {
    order: initial;
  }

  html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
    .case-records .case-story__media img,
  html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
    .case-records .case-story__media video {
    min-height: 240px !important;
    max-height: 420px !important;
  }

  html.js-enabled main.cms-native-detail[data-cms-page-detail^="/project-cases/"]
    .case-records .case-story__copy {
    padding: 28px 22px;
  }

  html.js-enabled body .jnm-back-top-v2 {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    border-radius: 16px !important;
  }
}

@media (hover: none), (pointer: coarse) {
  html.js-enabled body [data-jnm-motion-card="true"],
  html.js-enabled body [data-jnm-motion-card="true"][data-jnm-motion-media="true"] img,
  html.js-enabled body [data-jnm-motion-action="true"],
  html.js-enabled body [data-jnm-motion-action="true"] :is(svg, [aria-hidden="true"]) {
    transform: none !important;
    filter: none !important;
    will-change: auto !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js-enabled body [data-jnm-motion-card="true"],
  html.js-enabled body [data-jnm-motion-card="true"] *,
  html.js-enabled body [data-jnm-motion-action="true"],
  html.js-enabled body [data-jnm-motion-action="true"] * {
    animation: none !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
    will-change: auto !important;
  }
}

/* Static editorial media keep their geometry; interactive cards use the light motion layer above. */
html.js-enabled :is(
  .jnm-lab-hero__media,
  .jnm-lab-system__figure,
  .jnm-lab-stack,
  .coating-detail-cover,
  .coating-detail-body > section,
  .coating-detail-summary,
  .coating-detail-note,
  .stable-guide-media,
  .stable-editorial-feature > img,
  .stable-editorial-gallery img,
  .stable-contact-scene,
  .stable-quote-step,
  .stable-support-step,
  .stable-partnership-panel__card,
  .stable-compact-contact__item,
  .business-partnership-mode,
  .stable-quote-process__closing,
  .stable-support-process__closing,
  .business-partnership-content__support,
  .stable-certifications__closing,
  .stable-company-gallery__hero,
  .stable-company-gallery__card,
  .stable-company-gallery__closing,
  .stable-clients__hero,
  .stable-clients__scene,
  .stable-clients__closing,
  .stable-clients__mode,
  .stable-company-profile__factory,
  .stable-company-profile__product,
  .stable-company-profile__tech article,
  .stable-company-profile__advantage,
  .stable-company-profile__application,
  .stable-company-profile__capacity,
  .stable-company-profile__fact,
  .stable-production__photo,
  .stable-production__card,
  .stable-production__equipment,
  .stable-production__plant,
  .stable-production__delivery,
  .stable-production__metric,
  .stable-production__closing,
  .stable-certifications__chapter,
  .stable-certification-card,
  .stable-certification-card__preview
) {
  transform: none !important;
  filter: none !important;
  transition: none !important;
  will-change: auto !important;
}

html.js-enabled :is(
  .jnm-lab-hero__media,
  .jnm-lab-system__figure,
  .jnm-lab-stack,
  .coating-detail-cover,
  .stable-guide-media,
  .stable-editorial-feature,
  .stable-editorial-gallery,
  .stable-contact-scene,
  .stable-company-gallery__hero,
  .stable-company-gallery__card,
  .stable-clients__hero,
  .stable-clients__scene,
  .stable-company-profile__factory,
  .stable-production__photo,
  .stable-certifications__chapter,
  .stable-certification-card
) img {
  transform: none !important;
  filter: none !important;
  transition: none !important;
  will-change: auto !important;
}

html.js-enabled :is(
  .coating-detail-body > section h2,
  .stable-company-profile__product h3,
  .stable-company-profile__tech h3,
  .stable-company-profile__advantage h3,
  .stable-company-profile__application h3,
  .stable-company-profile__capacity strong,
  .stable-company-profile__fact strong,
  .stable-production__card h3,
  .stable-production__equipment h3,
  .stable-production__delivery h3,
  .stable-production__plant strong,
  .stable-production__metric strong,
  .stable-certification-card h3
) {
  transform: none !important;
  transition: none !important;
  will-change: auto !important;
}

html.js-enabled .coating-detail-body > section h2::after {
  transform: none !important;
  transition: none !important;
  will-change: auto !important;
}

html.js-enabled :is(
  .stable-company-profile__product,
  .stable-company-profile__tech article,
  .stable-company-profile__advantage,
  .stable-company-profile__application,
  .stable-production__card,
  .stable-production__equipment,
  .stable-production__delivery
)::after {
  opacity: 0 !important;
  transform: none !important;
  transition: none !important;
}

html.js-enabled :is(.academy-hub__body strong, .coating-library-card-title) {
  transform: none !important;
  transition: none !important;
}

html.js-enabled :is(.academy-hub__read svg, .coating-library-read svg) {
  transition: transform var(--jnm-motion-fast) ease-out !important;
}

/* Runtime styles load after the base sheet; these exact roots keep the final controls consistent. */
html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2 {
  color: var(--jnm-ink-strong) !important;
  border-color: rgb(255 255 255 / 92%) !important;
  background: var(--jnm-gradient-site) !important;
  box-shadow:
    0 0 0 1px rgb(11 31 51 / 24%),
    0 18px 38px -14px rgb(11 31 51 / 58%) !important;
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:hover {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-track-8) !important;
  background: var(--jnm-paper) !important;
  box-shadow:
    0 0 0 2px var(--jnm-track-8),
    0 22px 46px -16px rgb(11 31 51 / 60%) !important;
}

/* Project-case listing: keep the existing title and summary inside a visible editorial panel. */
html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-cms-page-card][data-jnm-case-card-layout="true"] {
  display: block !important;
  min-height: 0 !important;
  padding: 42px 0 !important;
  overflow: visible !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]
> a.project-case-list-link {
  display: grid !important;
  grid-template-columns: minmax(0, 1.28fr) minmax(340px, .72fr);
  grid-template-rows: minmax(400px, auto);
  min-height: 400px;
  height: auto !important;
  overflow: hidden !important;
  color: var(--jnm-ink-strong) !important;
  text-decoration: none !important;
  background: var(--jnm-paper) !important;
  border-radius: 24px !important;
  box-shadow: 0 20px 52px -34px rgb(11 31 51 / 42%) !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]
> a.project-case-list-link > img {
  grid-column: 1;
  grid-row: 1;
  width: 100% !important;
  height: 100% !important;
  min-height: 400px !important;
  object-fit: cover !important;
  border-radius: 0 !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]
> a.project-case-list-link > .project-case-list-copy {
  grid-column: 2;
  grid-row: 1;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  min-height: 400px;
  position: static !important;
  padding: clamp(34px, 4vw, 58px) !important;
  color: var(--jnm-ink-strong) !important;
  background: var(--jnm-surface-cool) !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]:nth-of-type(even)
> a.project-case-list-link > img {
  grid-column: 2;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]:nth-of-type(even)
> a.project-case-list-link > .project-case-list-copy {
  grid-column: 1;
  background: var(--jnm-surface-warm) !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]
.project-case-list-copy h3 {
  margin: 0 !important;
  color: var(--jnm-ink-strong) !important;
  font-size: clamp(26px, 2vw, 36px) !important;
  font-weight: 760 !important;
  line-height: 1.24 !important;
  letter-spacing: normal;
  white-space: normal !important;
  text-wrap: balance;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]
.project-case-list-copy p {
  max-width: 34em;
  margin: 18px 0 0 !important;
  color: var(--jnm-ink-secondary) !important;
  font-size: 16px !important;
  line-height: 1.82 !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]
.project-case-read {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 9px;
  margin-top: 28px;
  color: var(--jnm-accent-ink) !important;
  font-size: 15px;
  font-weight: 760;
  line-height: 1.4;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]
.project-case-read > span {
  transition: transform var(--jnm-motion-fast) var(--jnm-motion-ease);
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]
> a.project-case-list-link:focus-visible {
  outline: 3px solid var(--jnm-focus) !important;
  outline-offset: 5px !important;
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"]
  > a.project-case-list-link:hover .project-case-read > span {
    transform: translateX(4px);
  }
}

@media (max-width: 820px) {
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] {
    padding: 24px 0 !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"]
  > a.project-case-list-link {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 280px auto;
    min-height: 0;
    height: auto !important;
    border-radius: 20px !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"]
  > a.project-case-list-link > img,
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"]:nth-of-type(even)
  > a.project-case-list-link > img {
    grid-column: 1;
    grid-row: 1;
    height: 280px !important;
    min-height: 280px !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"]
  > a.project-case-list-link > .project-case-list-copy,
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"]:nth-of-type(even)
  > a.project-case-list-link > .project-case-list-copy {
    grid-column: 1;
    grid-row: 2;
    min-height: 0;
    padding: 30px 24px 34px !important;
  }
}

@media (prefers-contrast: more) {
  html.js-enabled :is(a, button, [tabindex]):focus-visible,
  html[data-jnm-home-product-ui].js-enabled :is(.jn-audience-link, .jn-scenario, .jn-model, .jn-metric, .jn-case) {
    border-color: var(--jnm-ink-strong) !important;
  }
}

/* jnm-compact-content-cards-r1:start */
/* Scoped compact layouts for project cases and the technical academy hub. */

/* Project cases: compact, consistently cropped cards. */
html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"] .project-case-grid {
  display: grid !important;
  max-width: 1180px !important;
  margin-inline: auto !important;
  gap: 20px !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"] {
  display: block !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 212px minmax(0, 1fr) !important;
  height: 100% !important;
  min-height: 348px !important;
  overflow: hidden !important;
  border: 1px solid var(--jnm-line, #d8e5ec) !important;
  border-radius: 16px !important;
  background: var(--jnm-paper, #fff) !important;
  box-shadow: none !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link > img,
html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]:nth-of-type(even)
> a.project-case-list-link > img {
  grid-area: 1 / 1 !important;
  width: 100% !important;
  height: 212px !important;
  min-height: 212px !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 0 !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link > .project-case-list-copy,
html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"]:nth-of-type(even)
> a.project-case-list-link > .project-case-list-copy {
  grid-area: 2 / 1 !important;
  display: flex !important;
  min-height: 0 !important;
  padding: 18px 18px 20px !important;
  justify-content: flex-start !important;
  background: var(--jnm-paper, #fff) !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"] .project-case-list-copy h3 {
  margin: 0 !important;
  font-size: 19px !important;
  font-weight: 760 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.01em !important;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"] .project-case-list-copy p {
  display: -webkit-box !important;
  max-width: none !important;
  margin: 8px 0 0 !important;
  overflow: hidden !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-jnm-case-card-layout="true"] .project-case-read {
  margin-top: auto !important;
  padding-top: 14px;
  font-size: 13px !important;
}

@media (min-width: 1200px) {
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"] .project-case-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"] .project-case-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link {
    grid-template-rows: 194px minmax(0, 1fr) !important;
    min-height: 326px !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link > img,
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"]:nth-of-type(even)
  > a.project-case-list-link > img {
    height: 194px !important;
    min-height: 194px !important;
  }
}

@media (max-width: 767px) {
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"] .project-case-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] {
    padding: 0 !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link {
    grid-template-columns: minmax(0, 42%) minmax(0, 58%) !important;
    grid-template-rows: 184px !important;
    height: 184px !important;
    min-height: 184px !important;
    border-radius: 14px !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link > img,
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"]:nth-of-type(even)
  > a.project-case-list-link > img {
    grid-area: 1 / 1 !important;
    height: 184px !important;
    min-height: 184px !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link > .project-case-list-copy,
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"]:nth-of-type(even)
  > a.project-case-list-link > .project-case-list-copy {
    grid-area: 1 / 2 !important;
    padding: 14px !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] .project-case-list-copy h3 {
    font-size: 16.5px !important;
    line-height: 1.32 !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] .project-case-list-copy p {
    margin-top: 6px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] .project-case-read {
    padding-top: 8px;
    font-size: 12px !important;
  }
}

/* Technical academy: compact two-column media cards with a single scan direction. */
html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__content {
  width: min(1240px, calc(100% - 64px)) !important;
  padding: 52px 0 88px !important;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  column-gap: 24px !important;
  row-gap: 20px !important;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card,
html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card.is-featured {
  min-width: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--jnm-line, #d8e5ec) !important;
  border-radius: 16px !important;
  background: var(--jnm-paper, #fff) !important;
  box-shadow: none !important;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card > a,
html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card:nth-child(4n+3) > a,
html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card:nth-child(4n+4) > a {
  display: grid !important;
  grid-template-columns: 232px minmax(0, 1fr) !important;
  grid-template-rows: 212px !important;
  height: 212px !important;
  min-height: 212px !important;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card .academy-hub__image,
html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card:nth-child(4n+3) .academy-hub__image,
html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card:nth-child(4n+4) .academy-hub__image {
  order: 1 !important;
  grid-area: 1 / 1 !important;
  width: 232px !important;
  height: 212px !important;
  min-height: 212px !important;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card .academy-hub__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card .academy-hub__body,
html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card:nth-child(4n+3) .academy-hub__body,
html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__card:nth-child(4n+4) .academy-hub__body {
  order: 2 !important;
  grid-area: 1 / 2 !important;
  display: flex !important;
  min-width: 0 !important;
  padding: 20px 22px !important;
  background: var(--jnm-paper, #fff) !important;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__label {
  margin-bottom: 6px !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__body strong {
  margin-bottom: 8px !important;
  font-size: 21px !important;
  line-height: 1.3 !important;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__copy {
  display: -webkit-box !important;
  margin-bottom: 8px !important;
  overflow: hidden !important;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

html.js-enabled body #root main[data-owner="technical-academy"]
.academy-hub__read {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 32px;
  margin-top: auto !important;
  font-size: 14px !important;
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card {
    transition: transform 220ms cubic-bezier(.16, 1, .3, 1),
      box-shadow 220ms cubic-bezier(.16, 1, .3, 1) !important;
  }

  html.js-enabled[data-cases-unfiltered="true"] body #root
  main[data-component-file="Applications.tsx"]
  .project-case-card[data-jnm-case-card-layout="true"] > a.project-case-list-link:hover,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 14px 32px rgba(15, 45, 70, .09) !important;
  }
}

@media (min-width: 641px) and (max-width: 1099px) {
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__content {
    width: min(840px, calc(100% - 40px)) !important;
  }

  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 18px !important;
  }

  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card > a,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+3) > a,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+4) > a {
    grid-template-columns: 240px minmax(0, 1fr) !important;
    grid-template-rows: 194px !important;
    height: 194px !important;
    min-height: 194px !important;
  }

  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card .academy-hub__image,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+3) .academy-hub__image,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+4) .academy-hub__image {
    width: 240px !important;
    height: 194px !important;
    min-height: 194px !important;
  }
}

@media (max-width: 640px) {
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__content {
    width: calc(100% - 28px) !important;
    padding: 42px 0 68px !important;
  }

  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
  }

  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card > a,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+3) > a,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+4) > a {
    display: flex !important;
    height: auto !important;
    min-height: 0 !important;
    flex-direction: column !important;
  }

  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card .academy-hub__image,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+3) .academy-hub__image,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+4) .academy-hub__image {
    order: 1 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9;
  }

  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card .academy-hub__body,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+3) .academy-hub__body,
  html.js-enabled body #root main[data-owner="technical-academy"]
  .academy-hub__card:nth-child(4n+4) .academy-hub__body {
    order: 2 !important;
    padding: 18px !important;
  }
}
/* jnm-compact-content-cards-r1:end */

/* jnm-compact-content-cards-r2:start */
html.js-enabled[data-cases-unfiltered="true"] body #root
main[data-component-file="Applications.tsx"]
.project-case-card[data-cms-page-card][data-jnm-case-card-layout="true"] {
  padding: 0 !important;
}
/* jnm-compact-content-cards-r2:end */

/* jnm-back-top-premium-r1:start */
html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2 {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  overflow: visible !important;
  color: #fff !important;
  border: 1px solid rgb(188 231 251 / 58%) !important;
  border-radius: 50% !important;
  background: linear-gradient(145deg, #2b6e90 0%, #174765 44%, #0b1f33 100%) !important;
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 34%),
    0 14px 28px -10px rgb(7 28 51 / 68%) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  isolation: isolate;
  backdrop-filter: none !important;
  transition:
    opacity var(--jnm-motion-fast) ease-out,
    transform var(--jnm-motion-medium) cubic-bezier(.16, 1, .3, 1),
    box-shadow var(--jnm-motion-medium) ease-out !important;
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2 > span {
  position: relative;
  display: block;
  width: 18px;
  height: 20px;
  color: currentColor;
  font-size: 0 !important;
  line-height: 0;
  filter: drop-shadow(0 1px 1px rgb(7 28 51 / 24%));
  transition: transform var(--jnm-motion-fast) cubic-bezier(.16, 1, .3, 1);
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2 > span::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 50%;
  width: 10px;
  height: 10px;
  border-top: 2px solid currentColor;
  border-left: 2px solid currentColor;
  border-radius: 1px;
  transform: translateX(-50%) rotate(45deg);
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2 > span::after {
  content: "";
  position: absolute;
  top: 5px;
  left: 50%;
  width: 2px;
  height: 13px;
  border-radius: 999px;
  background: currentColor;
  transform: translateX(-50%);
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2::after {
  content: attr(data-jnm-tooltip);
  position: absolute;
  top: 50%;
  right: calc(100% + 12px);
  z-index: 2;
  width: max-content;
  max-width: 9em;
  padding: 7px 10px;
  color: #fff;
  border: 1px solid rgb(188 231 251 / 22%);
  border-radius: 9px;
  background: #0b1f33;
  box-shadow: 0 10px 24px -12px rgb(7 28 51 / 72%);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: 0;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transform: translate(7px, -50%);
  transition:
    opacity var(--jnm-motion-fast) ease-out,
    transform var(--jnm-motion-fast) cubic-bezier(.16, 1, .3, 1);
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:hover {
  color: #fff !important;
  border-color: rgb(188 231 251 / 88%) !important;
  background: linear-gradient(145deg, #327b9e 0%, #1b5272 44%, #102b46 100%) !important;
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 42%),
    0 18px 34px -11px rgb(7 28 51 / 76%) !important;
  transform: translateY(-3px) !important;
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:hover > span,
html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:focus-visible > span {
  transform: translateY(-2px);
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:hover::after,
html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:focus-visible::after {
  opacity: 1;
  transform: translate(0, -50%);
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:active {
  transform: translateY(-1px) scale(.96) !important;
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:focus-visible {
  outline: 3px solid var(--jnm-track-8) !important;
  outline-offset: 4px !important;
}

@media (max-width: 860px) {
  html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2 {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
  }

  html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2::after {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2,
  html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2 > span,
  html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2::after {
    transition: none !important;
  }

  html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:hover,
  html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:active,
  html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:hover > span,
  html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:focus-visible > span {
    transform: none !important;
  }
}
/* jnm-back-top-premium-r1:end */
/* jnm-back-top-premium-r2:start */
html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2 > span {
  transform: none !important;
}

html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:hover > span,
html.js-enabled body > button.jnm-back-top-v2.jnm-back-top-v2:focus-visible > span {
  transform: translateY(-2px) !important;
}
/* jnm-back-top-premium-r2:end */
/* jnm-contact-audience-links-r1:start */
html.js-enabled body main[data-component-file="Contact.tsx"] .jnm-pills {
  gap: 12px !important;
}

html.js-enabled body main[data-component-file="Contact.tsx"]
.jnm-pills > a[data-jnm-audience-route] {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 39px 10px 15px !important;
  color: var(--jnm-ink-strong) !important;
  border: 1px solid var(--jnm-line) !important;
  border-radius: 14px !important;
  background-color: var(--jnm-paper) !important;
  background-image: none !important;
  box-shadow: none !important;
  font-size: 15px;
  font-weight: 650;
  line-height: 1.35;
  text-decoration: none !important;
  transform: translateY(0);
  transition:
    color var(--jnm-motion-fast) ease-out,
    border-color var(--jnm-motion-fast) ease-out,
    background-color var(--jnm-motion-fast) ease-out,
    box-shadow var(--jnm-motion-medium) ease-out,
    transform var(--jnm-motion-medium) cubic-bezier(.16, 1, .3, 1);
}

html.js-enabled body main[data-component-file="Contact.tsx"]
.jnm-pills > a[data-jnm-audience-route]::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 15px;
  width: 13px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transform: translateY(-50%);
  transition: transform var(--jnm-motion-fast) cubic-bezier(.16, 1, .3, 1);
}

html.js-enabled body main[data-component-file="Contact.tsx"]
.jnm-pills > a[data-jnm-audience-route]::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 7px;
  height: 7px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  border-radius: 1px;
  transform: translateY(-50%) rotate(45deg);
  transition: transform var(--jnm-motion-fast) cubic-bezier(.16, 1, .3, 1);
}

html.js-enabled body main[data-component-file="Contact.tsx"]
.jnm-pills > a[data-jnm-audience-route="products"] {
  color: var(--jnm-accent-ink) !important;
  border-color: var(--jnm-track-6) !important;
  background-color: var(--jnm-surface-cool-wash) !important;
}

html.js-enabled body main[data-component-file="Contact.tsx"]
.jnm-pills > a[data-jnm-audience-route="solution"] {
  color: var(--jnm-ink-strong) !important;
  border-color: var(--jnm-track-2) !important;
  background-color: var(--jnm-surface-warm-wash) !important;
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html.js-enabled body main[data-component-file="Contact.tsx"]
  .jnm-pills > a[data-jnm-audience-route]:hover {
    box-shadow: 0 12px 24px -17px rgb(11 31 51 / 58%) !important;
    transform: translateY(-2px);
  }

  html.js-enabled body main[data-component-file="Contact.tsx"]
  .jnm-pills > a[data-jnm-audience-route="products"]:hover {
    border-color: var(--jnm-track-8) !important;
    background-color: var(--jnm-track-8) !important;
  }

  html.js-enabled body main[data-component-file="Contact.tsx"]
  .jnm-pills > a[data-jnm-audience-route="solution"]:hover {
    border-color: var(--jnm-track-0) !important;
    background-color: var(--jnm-track-0) !important;
  }

  html.js-enabled body main[data-component-file="Contact.tsx"]
  .jnm-pills > a[data-jnm-audience-route]:hover::before {
    transform: translate(3px, -50%);
  }

  html.js-enabled body main[data-component-file="Contact.tsx"]
  .jnm-pills > a[data-jnm-audience-route]:hover::after {
    transform: translate(3px, -50%) rotate(45deg);
  }
}

html.js-enabled body main[data-component-file="Contact.tsx"]
.jnm-pills > a[data-jnm-audience-route]:focus-visible {
  outline: 3px solid var(--jnm-focus) !important;
  outline-offset: 3px !important;
}

html.js-enabled body main[data-component-file="Contact.tsx"]
.jnm-pills > a[data-jnm-audience-route]:active {
  box-shadow: none !important;
  transform: translateY(0) scale(.98);
}

@media (max-width: 759px) {
  html.js-enabled body main[data-component-file="Contact.tsx"] .jnm-pills {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px !important;
  }

  html.js-enabled body main[data-component-file="Contact.tsx"]
  .jnm-pills > a[data-jnm-audience-route] {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (min-width: 560px) and (max-width: 759px) {
  html.js-enabled body main[data-component-file="Contact.tsx"] .jnm-pills {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js-enabled body main[data-component-file="Contact.tsx"]
  .jnm-pills > a[data-jnm-audience-route],
  html.js-enabled body main[data-component-file="Contact.tsx"]
  .jnm-pills > a[data-jnm-audience-route]::before,
  html.js-enabled body main[data-component-file="Contact.tsx"]
  .jnm-pills > a[data-jnm-audience-route]::after {
    transition: none !important;
  }
}
/* jnm-contact-audience-links-r1:end */

/* jnm-news-detail-header-offset-r1:start */
html.js-enabled #root
main.cms-native-detail[data-cms-page-detail^="/news/"] {
  padding-top: 121px !important;
}
/* jnm-news-detail-header-offset-r1:end */

/* jnm-resin-hero-copy-one-line-r1:start */
@media (min-width: 1024px) {
  html.js-enabled
  main[data-owner="technical-resin"][data-resin-library-view="listing"]
  .resin-library > .coating-library-hero > p {
    max-width: 1120px;
    text-wrap: wrap;
  }
}
/* jnm-resin-hero-copy-one-line-r1:end */
:root {
  --jnm-seo-ink: #10233d;
  --jnm-seo-muted: #51647d;
  --jnm-seo-blue: #155eef;
  --jnm-seo-line: #dce5f1;
  --jnm-seo-soft: #f5f8fc;
  --jnm-seo-gold: #d7a83e;
}

.jnm-home-ssr,
.jnm-home-evidence {
  box-sizing: border-box;
  width: 100%;
  padding: 72px 20px;
  color: var(--jnm-seo-ink);
  background: #fff;
  font-family: Arial, "Microsoft YaHei", sans-serif;
  line-height: 1.8;
}

/* The previous homepage theme intentionally hid every Home.tsx section after
   the hero. Keep this server-rendered evidence section visible. */
html[data-jnm-home-product-ui="20260830-v1"] main[data-component-file="Home.tsx"] > #home-trust-evidence,
main[data-component-file="Home.tsx"] > #home-trust-evidence {
  display: block !important;
}

.jnm-home-ssr *,
.jnm-home-evidence * {
  box-sizing: border-box;
}

.jnm-seo-container {
  width: min(1180px, 100%);
  margin: 0 auto;
}

.jnm-home-ssr h1,
.jnm-home-evidence h2 {
  max-width: 980px;
  margin: 0;
  color: #0a1d38;
  font-size: clamp(30px, 4.2vw, 52px);
  line-height: 1.22;
  letter-spacing: -.02em;
}

.jnm-home-evidence h2 {
  font-size: clamp(28px, 3.5vw, 44px);
}

.jnm-seo-eyebrow {
  margin: 0 0 10px;
  color: var(--jnm-seo-blue);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .12em;
}

.jnm-seo-lead {
  max-width: 900px;
  margin: 18px 0 0;
  color: var(--jnm-seo-muted);
  font-size: clamp(17px, 2vw, 20px);
}

.jnm-seo-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin: 28px 0 0;
}

.jnm-seo-nav a,
.jnm-report-link {
  color: var(--jnm-seo-blue);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.jnm-seo-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 36px;
}

.jnm-seo-summary article,
.jnm-report-fact {
  padding: 20px;
  border: 1px solid var(--jnm-seo-line);
  border-radius: 16px;
  background: var(--jnm-seo-soft);
}

.jnm-seo-summary h2,
.jnm-seo-summary h3,
.jnm-report-fact strong {
  display: block;
  margin: 0 0 8px;
  color: var(--jnm-seo-ink);
  font-size: 20px;
  line-height: 1.4;
}

.jnm-seo-summary p,
.jnm-report-fact span {
  margin: 0;
  color: var(--jnm-seo-muted);
}

.jnm-report-panel {
  margin-top: 54px;
  padding: clamp(24px, 4vw, 46px);
  border-radius: 26px;
  color: #eaf2ff;
  background:
    radial-gradient(circle at 78% 10%, rgba(49, 115, 216, .42), transparent 38%),
    linear-gradient(145deg, #071426 0%, #0b2444 58%, #07172c 100%);
  box-shadow: 0 28px 70px rgba(9, 30, 61, .16);
}

.jnm-report-panel h2 {
  color: #fff;
}

.jnm-report-panel .jnm-seo-eyebrow {
  color: #f0c96a;
}

.jnm-report-panel .jnm-seo-lead {
  color: #c8d8ee;
}

.jnm-report-grid {
  display: grid;
  grid-template-columns: minmax(280px, .78fr) minmax(320px, 1.22fr);
  gap: clamp(28px, 5vw, 62px);
  align-items: center;
  margin-top: 30px;
}

.jnm-report-figure {
  margin: 0;
}

.jnm-report-figure img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid rgba(237, 202, 113, .55);
  border-radius: 14px;
  background: #071426;
  box-shadow: 0 18px 52px rgba(0, 0, 0, .32);
}

.jnm-report-figure figcaption {
  margin-top: 12px;
  color: #b8c9df;
  font-size: 14px;
}

.jnm-report-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.jnm-report-fact {
  border-color: rgba(255, 255, 255, .14);
  background: rgba(255, 255, 255, .07);
}

.jnm-report-fact strong {
  color: #f6d474;
  font-size: clamp(22px, 3vw, 30px);
}

.jnm-report-fact span {
  color: #d8e4f3;
}

.jnm-report-note {
  margin: 18px 0 0;
  color: #c8d8ee;
}

.jnm-report-link {
  display: inline-flex;
  margin-top: 20px;
  color: #f6d474;
  font-weight: 700;
}

.jnm-faq {
  margin-top: 58px;
}

.jnm-faq-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 26px;
}

.jnm-faq details {
  padding: 0 20px;
  border: 1px solid var(--jnm-seo-line);
  border-radius: 14px;
  background: #fff;
}

.jnm-faq summary {
  padding: 18px 30px 18px 0;
  color: var(--jnm-seo-ink);
  font-weight: 700;
  cursor: pointer;
}

.jnm-faq details p {
  margin: 0 0 20px;
  color: var(--jnm-seo-muted);
}

@media (max-width: 820px) {
  .jnm-home-ssr,
  .jnm-home-evidence {
    padding: 52px 16px;
  }

  .jnm-seo-summary,
  .jnm-report-grid,
  .jnm-faq-list {
    grid-template-columns: 1fr;
  }

  .jnm-report-figure {
    max-width: 520px;
    margin-inline: auto;
  }
}

@media (max-width: 480px) {
  .jnm-report-facts {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .jnm-home-ssr *,
  .jnm-home-evidence * {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}
/*
 * Junaimei site-wide pointer response.
 * Keeps the homepage's authored hero/card motion intact and normalizes the
 * remaining routes to one restrained interaction language.
 */

html.js-enabled {
  --jnm-pointer-ease-out: cubic-bezier(.16, 1, .3, 1);
  --jnm-pointer-fast: 150ms;
  --jnm-pointer-standard: 220ms;
  --jnm-pointer-media: 300ms;
  --jnm-pointer-lift: -3px;
  --jnm-pointer-shadow:
    0 18px 38px -24px rgb(11 31 51 / 30%),
    0 8px 18px -14px rgb(36 86 111 / 24%);
}

html.js-enabled :where(
  a[href],
  button:not(:disabled),
  summary,
  [role="button"]:not([aria-disabled="true"])
) {
  cursor: pointer;
}

html.js-enabled :where(
  button:disabled,
  [aria-disabled="true"]
) {
  cursor: not-allowed;
}

/* Normalize interactive cards outside the richer homepage motion system. */
html.js-enabled body main:not([data-component-file="Home.tsx"])
  [data-jnm-motion-card="true"] {
  animation: none !important;
  transform: none !important;
  transition:
    transform var(--jnm-pointer-standard) var(--jnm-pointer-ease-out),
    box-shadow var(--jnm-pointer-standard) var(--jnm-pointer-ease-out),
    border-color var(--jnm-pointer-fast) ease,
    background-color var(--jnm-pointer-fast) ease !important;
  will-change: auto !important;
}

html.js-enabled body main:not([data-component-file="Home.tsx"])
  [data-jnm-motion-card="true"][data-jnm-motion-media="true"] img {
  filter: none !important;
  transform: none !important;
  transition:
    transform var(--jnm-pointer-media) var(--jnm-pointer-ease-out),
    opacity var(--jnm-pointer-fast) ease !important;
  will-change: auto !important;
}

/* Normalize buttons, pills, tabs and navigation actions. */
html.js-enabled body :is(
  header,
  footer,
  main:not([data-component-file="Home.tsx"])
) [data-jnm-motion-action="true"]:not(.jnm-back-top-v2) {
  animation: none !important;
  transform: none !important;
  transition:
    transform var(--jnm-pointer-fast) var(--jnm-pointer-ease-out),
    box-shadow var(--jnm-pointer-fast) ease,
    background-color var(--jnm-pointer-fast) ease,
    border-color var(--jnm-pointer-fast) ease,
    color var(--jnm-pointer-fast) ease,
    opacity var(--jnm-pointer-fast) ease !important;
  will-change: auto !important;
}

html.js-enabled body :is(
  header,
  footer,
  main:not([data-component-file="Home.tsx"])
) [data-jnm-motion-action="true"]:not(.jnm-back-top-v2)
  :is(svg, [aria-hidden="true"]) {
  transition: transform var(--jnm-pointer-fast) var(--jnm-pointer-ease-out) !important;
}

/* Remove legacy oversized hover jumps and perpetual breathing. */
html.js-enabled body #root main:not([data-component-file="Home.tsx"])
  :is(article, a, div)[class*="hover:shadow"],
html.js-enabled body #root main:not([data-component-file="Home.tsx"])
  :is(.about-breathe-card, .quality-report-card) {
  animation: none !important;
  transform: none !important;
  transition:
    transform var(--jnm-pointer-standard) var(--jnm-pointer-ease-out),
    box-shadow var(--jnm-pointer-standard) var(--jnm-pointer-ease-out),
    border-color var(--jnm-pointer-fast) ease !important;
  will-change: auto !important;
}

html.js-enabled body #root main:not([data-component-file="Home.tsx"])
  :is(.about-breathe-card, .quality-report-card)::after {
  opacity: 0 !important;
}

html.js-enabled body #root main:not([data-component-file="Home.tsx"])
  :is(.about-breathe-card, .quality-report-card) img {
  filter: none !important;
  transform: none !important;
  transition: transform var(--jnm-pointer-media) var(--jnm-pointer-ease-out) !important;
}

/* The active navigation state should be calm, not an infinite pulse. */
html.js-enabled body .junaimei-tiered-nav__link.is-active {
  animation: none !important;
}

html.js-enabled body .junaimei-tiered-nav__panel,
html.js-enabled body .junaimei-tiered-nav__subpanel,
html.js-enabled body .junaimei-tiered-nav__panel > .junaimei-tiered-nav__subitem {
  filter: none !important;
}

/* Form controls acknowledge pointer targeting without moving their geometry. */
html.js-enabled body :is(input, textarea, select):not(:disabled) {
  transition:
    border-color var(--jnm-pointer-fast) ease,
    box-shadow var(--jnm-pointer-fast) ease,
    background-color var(--jnm-pointer-fast) ease !important;
}

html.js-enabled body :is(
  .academy-global-tabs a,
  .academy-hub__tabs a,
  .coating-library-tabs a,
  .academy-faq-unified__tabs a,
  nav[data-contact-service-tabs] a,
  .stable-guide-index-nav a,
  .stable-guide-index-nav button,
  .stable-about-tabs a,
  .jnm-pills > a[data-jnm-audience-route]
) {
  animation: none !important;
  transform: none !important;
  transition:
    transform var(--jnm-pointer-fast) var(--jnm-pointer-ease-out),
    box-shadow var(--jnm-pointer-fast) ease,
    background-color var(--jnm-pointer-fast) ease,
    border-color var(--jnm-pointer-fast) ease,
    color var(--jnm-pointer-fast) ease !important;
}

html.js-enabled body :is(
  [data-technical-faq-toggle],
  .cms-faq-toggle,
  [aria-expanded][aria-controls]
) {
  transition:
    background-color var(--jnm-pointer-fast) ease,
    border-color var(--jnm-pointer-fast) ease,
    color var(--jnm-pointer-fast) ease !important;
}

@media (min-width: 1024px) and (hover: hover) and (pointer: fine)
  and (prefers-reduced-motion: no-preference) {
  html.js-enabled body .junaimei-tiered-nav__panel {
    animation: none !important;
    transform: translateY(8px) scale(.985) !important;
    transition:
      opacity 180ms ease,
      transform 200ms var(--jnm-pointer-ease-out),
      visibility 180ms ease !important;
  }

  html.js-enabled body .junaimei-tiered-nav__subpanel {
    animation: none !important;
    transform: translateX(8px) scale(.985) !important;
    transition:
      opacity 180ms ease,
      transform 200ms var(--jnm-pointer-ease-out),
      visibility 180ms ease !important;
  }

  html.js-enabled body .junaimei-tiered-nav__panel > .junaimei-tiered-nav__subitem {
    animation: none !important;
    opacity: 1 !important;
  }

  html.js-enabled body .junaimei-tiered-nav__item:is(:hover, :focus-within, .is-open)
    > .junaimei-tiered-nav__panel,
  html.js-enabled body .junaimei-tiered-nav__subitem:is(:hover, :focus-within, .is-open)
    > .junaimei-tiered-nav__subpanel {
    animation: none !important;
    transform: none !important;
  }
}

@media (hover: hover) and (pointer: fine)
  and (prefers-reduced-motion: no-preference) {
  html.js-enabled body main:not([data-component-file="Home.tsx"])
    [data-jnm-motion-card="true"]:is(a, button):hover,
  html.js-enabled body main:not([data-component-file="Home.tsx"])
    [data-jnm-motion-card="true"]:has(a[href]:hover, button:hover) {
    position: relative;
    z-index: 1;
    border-color: #b9d5e2 !important;
    box-shadow: var(--jnm-pointer-shadow) !important;
    transform: translate3d(0, var(--jnm-pointer-lift), 0) !important;
  }

  html.js-enabled body main:not([data-component-file="Home.tsx"])
    [data-jnm-motion-card="true"]:is(a, button):active,
  html.js-enabled body main:not([data-component-file="Home.tsx"])
    [data-jnm-motion-card="true"]:has(a[href]:active, button:active) {
    transform: translate3d(0, -1px, 0) scale(.992) !important;
    transition-duration: 80ms !important;
  }

  html.js-enabled body main:not([data-component-file="Home.tsx"])
    [data-jnm-motion-card="true"][data-jnm-motion-media="true"]:is(a, button):hover img,
  html.js-enabled body main:not([data-component-file="Home.tsx"])
    [data-jnm-motion-card="true"][data-jnm-motion-media="true"]:has(a[href]:hover, button:hover) img {
    filter: none !important;
    transform: scale(1.035) !important;
  }

  html.js-enabled body :is(
    header,
    footer,
    main:not([data-component-file="Home.tsx"])
  ) [data-jnm-motion-action="true"]:not(.jnm-back-top-v2):hover {
    transform: translateY(-2px) !important;
  }

  html.js-enabled body :is(
    header,
    footer,
    main:not([data-component-file="Home.tsx"])
  ) [data-jnm-motion-action="true"]:not(.jnm-back-top-v2):active {
    transform: translateY(0) scale(.985) !important;
    transition-duration: 80ms !important;
  }

  html.js-enabled body :is(
    header,
    footer,
    main:not([data-component-file="Home.tsx"])
  ) [data-jnm-motion-action="true"]:not(.jnm-back-top-v2):hover
    :is(svg, [aria-hidden="true"]) {
    transform: translateX(3px) !important;
  }

  html.js-enabled body .junaimei-tiered-nav__link:hover {
    transform: translateY(-1px) !important;
  }

  html.js-enabled body .junaimei-tiered-nav__sublink:hover {
    transform: translateX(3px) !important;
  }

  html.js-enabled body .junaimei-tiered-nav__item:is(:hover, :focus-within, .is-open)
    > .junaimei-tiered-nav__link .junaimei-tiered-nav__chevron {
    transform: rotate(180deg) !important;
  }

  html.js-enabled body main:not([data-component-file="Home.tsx"])
    .cms-native-detail__back:hover,
  html.js-enabled body main:not([data-component-file="Home.tsx"])
    .coating-detail-back:hover {
    box-shadow: none !important;
    transform: translateX(-3px) !important;
  }

  html.js-enabled body footer[data-component-file="Footer.tsx"] a:hover {
    transform: translateX(2px) !important;
  }

  html.js-enabled body :is(input, textarea, select):not(:disabled):hover {
    border-color: #94b9ca !important;
  }

  html.js-enabled body :is(
    .academy-global-tabs a,
    .academy-hub__tabs a,
    .coating-library-tabs a,
    .academy-faq-unified__tabs a,
    nav[data-contact-service-tabs] a,
    .stable-guide-index-nav a,
    .stable-guide-index-nav button,
    .stable-about-tabs a,
    .jnm-pills > a[data-jnm-audience-route]
  ):hover {
    transform: translateY(-2px) !important;
  }

  html.js-enabled body :is(
    .academy-global-tabs a,
    .academy-hub__tabs a,
    .coating-library-tabs a,
    .academy-faq-unified__tabs a,
    nav[data-contact-service-tabs] a,
    .stable-guide-index-nav a,
    .stable-guide-index-nav button,
    .stable-about-tabs a,
    .jnm-pills > a[data-jnm-audience-route]
  ):active {
    transform: translateY(0) scale(.985) !important;
    transition-duration: 80ms !important;
  }

  html.js-enabled body #root main:not([data-component-file="Home.tsx"])
    :is(article, a, div)[class*="hover:shadow"]:is(a, button):hover,
  html.js-enabled body #root main:not([data-component-file="Home.tsx"])
    :is(article, div)[class*="hover:shadow"]:has(a[href]:hover, button:hover),
  html.js-enabled body #root main:not([data-component-file="Home.tsx"])
    :is(.about-breathe-card, .quality-report-card):has(a[href]:hover, button:hover) {
    animation: none !important;
    transform: translate3d(0, var(--jnm-pointer-lift), 0) !important;
    box-shadow: var(--jnm-pointer-shadow) !important;
  }

  html.js-enabled body #root main:not([data-component-file="Home.tsx"])
    :is(.about-breathe-card, .quality-report-card):has(a[href]:hover, button:hover) img {
    filter: none !important;
    transform: scale(1.035) !important;
  }
}

/* Keyboard focus remains spatially stable; pointer-only motion never replaces it. */
html.js-enabled body main:not([data-component-file="Home.tsx"])
  [data-jnm-motion-card="true"]:is(a, button):focus-visible,
html.js-enabled body main:not([data-component-file="Home.tsx"])
  [data-jnm-motion-card="true"]:has(:focus-visible),
html.js-enabled body :is(
  header,
  footer,
  main:not([data-component-file="Home.tsx"])
) [data-jnm-motion-action="true"]:not(.jnm-back-top-v2):focus-visible {
  transform: none !important;
}

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
  html.js-enabled body main:not([data-component-file="Home.tsx"])
    [data-jnm-motion-card="true"],
  html.js-enabled body main:not([data-component-file="Home.tsx"])
    [data-jnm-motion-card="true"] *,
  html.js-enabled body :is(
    header,
    footer,
    main:not([data-component-file="Home.tsx"])
  ) [data-jnm-motion-action="true"]:not(.jnm-back-top-v2),
  html.js-enabled body :is(
    header,
    footer,
    main:not([data-component-file="Home.tsx"])
  ) [data-jnm-motion-action="true"]:not(.jnm-back-top-v2) *,
  html.js-enabled body #root main:not([data-component-file="Home.tsx"])
    :is(article, a, div)[class*="hover:shadow"],
  html.js-enabled body #root main:not([data-component-file="Home.tsx"])
    :is(.about-breathe-card, .quality-report-card),
  html.js-enabled body #root main:not([data-component-file="Home.tsx"])
    :is(.about-breathe-card, .quality-report-card) img,
  html.js-enabled body .junaimei-tiered-nav__link.is-active,
  html.js-enabled body .junaimei-tiered-nav__panel,
  html.js-enabled body .junaimei-tiered-nav__subpanel,
  html.js-enabled body .junaimei-tiered-nav__panel > .junaimei-tiered-nav__subitem {
    animation: none !important;
    filter: none !important;
    transform: none !important;
    transition-duration: .01ms !important;
    will-change: auto !important;
  }

  html.js-enabled body :is(
    .academy-global-tabs a,
    .academy-hub__tabs a,
    .coating-library-tabs a,
    .academy-faq-unified__tabs a,
    nav[data-contact-service-tabs] a,
    .stable-guide-index-nav a,
    .stable-guide-index-nav button,
    .stable-about-tabs a,
    .jnm-pills > a[data-jnm-audience-route]
  ) {
    animation: none !important;
    transform: none !important;
    transition-duration: .01ms !important;
  }

  html:focus-within {
    scroll-behavior: auto !important;
  }
}

@media (forced-colors: active) {
  html.js-enabled :is(a, button, summary, [role="button"]):focus-visible {
    outline: 2px solid CanvasText !important;
    outline-offset: 3px !important;
  }

  html.js-enabled body main:not([data-component-file="Home.tsx"])
    [data-jnm-motion-card="true"] {
    box-shadow: none !important;
  }
}
/* language-switch-stability-v4
 * Keep Google Translate's implementation UI from moving the public page.
 * The site's own language picker remains the only visible language control.
 */
body {
  top: 0 !important;
}

body > .skiptranslate,
iframe.goog-te-banner-frame.skiptranslate,
iframe.VIpgJd-ZVi9od-ORHb-OEVmcd.skiptranslate {
  display: none !important;
  height: 0 !important;
  visibility: hidden !important;
}

#goog-gt-tt,
.goog-te-balloon-frame,
.VIpgJd-yAWNEb-L7lbkb {
  display: none !important;
  visibility: hidden !important;
}

.goog-text-highlight {
  background: transparent !important;
  box-shadow: none !important;
}

/*
 * Anchor the desktop hero copy at the same top position as the original
 * Chinese layout. Translation can then change line count without recentering
 * the whole block up or down. The fluid inset mirrors the former centered
 * Chinese position from 1150px through 1600px and remains capped beyond it.
 */
@media (min-width: 1121px) {
  html main[data-component-file="Home.tsx"]
    > section[data-component-file="Home.tsx"]:first-child > div {
    justify-content: flex-start !important;
    padding-top: clamp(5.84375rem, calc(14.3125rem - 8.45vw), 8.21875rem) !important;
    transition-property: opacity, transform !important;
  }

  /*
   * English copy is substantially longer than the Chinese source. Keep a
   * desktop size ceiling so every line and both calls to action remain inside
   * the fixed 640px hero canvas.
   */
  html[lang|="en"] main[data-component-file="Home.tsx"]
    > section[data-component-file="Home.tsx"]:first-child h1 {
    font-size: clamp(2.625rem, 2.8vw, 3rem) !important;
    line-height: 1.06 !important;
    margin-bottom: 0.5rem !important;
  }

  html[lang|="en"] main[data-component-file="Home.tsx"]
    > section[data-component-file="Home.tsx"]:first-child h2 {
    font-size: clamp(1.5rem, 1.8vw, 1.8125rem) !important;
    line-height: 1.18 !important;
    margin-bottom: 1rem !important;
  }

  html[lang|="en"] main[data-component-file="Home.tsx"]
    > section[data-component-file="Home.tsx"]:first-child p {
    margin-bottom: 1.375rem !important;
  }
}

/*
 * Translated contact labels must remain inside the desktop utility bar.
 * The Chinese source has a deliberate -100px visual pull which is too wide
 * once Google Translate expands the three labels.
 */
@media (min-width: 1024px) {
  html[lang]:not([lang^="zh"]) header[data-component-file="Header.tsx"]
    .flex.items-center.gap-6.text-xs {
    gap: 1rem !important;
    margin-right: 0 !important;
  }
}

/*
 * Between tablet and wide desktop sizes, translated navigation labels are
 * longer than the fixed 1280px header container. Compact only this range;
 * Chinese and wide screens retain the original navigation typography.
 */
@media (min-width: 1181px) {
  html[lang]:not([lang^="zh"]) .junaimei-tiered-nav {
    gap: clamp(4px, calc(-10.8px + 1.083vw), 10px) !important;
  }

  html[lang]:not([lang^="zh"]) .junaimei-tiered-nav__link {
    gap: clamp(4px, calc(-10.8px + 1.083vw), 10px) !important;
    padding: 10px clamp(6px, calc(-16.2px + 1.625vw), 15px) !important;
    font-size: clamp(13px, calc(5.6px + 0.542vw), 16px) !important;
  }

  html[lang]:not([lang^="zh"]) .junaimei-tiered-nav__chevron {
    font-size: 10px !important;
  }
}

/*
 * The fourth material-system label is much longer after translation. Give
 * every card the same compact media column and permit balanced wrapping so
 * the label cannot create document-wide horizontal scrolling.
 */
@media (min-width: 1121px) {
  html[lang]:not([lang^="zh"]) main[data-component-file="Home.tsx"]
    .jnm-layer-card-v2 {
    grid-template-columns:
      clamp(34px, calc(14.3px + 1.44vw), 42px)
      clamp(88px, calc(19px + 5.05vw), 116px)
      minmax(0, 1fr) !important;
    gap: clamp(8px, calc(-1.86px + 0.722vw), 12px) !important;
    padding: 8px clamp(12px, calc(-7.7px + 1.44vw), 20px) !important;
  }

  html[lang]:not([lang^="zh"]) main[data-component-file="Home.tsx"]
    .jnm-layer-card-v2 img {
    width: clamp(88px, calc(19px + 5.05vw), 116px) !important;
    height: clamp(64px, calc(19.6px + 3.25vw), 82px) !important;
    max-width: 100% !important;
  }

  html[lang]:not([lang^="zh"]) main[data-component-file="Home.tsx"]
    .jnm-layer-card-v2 strong {
    font-size: clamp(0.875rem, calc(-2px + 1.17vw), 1.28rem) !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    text-wrap: balance;
  }
}
/*
 * Junaimei layout-stability and narrow-screen usability patch.
 * Tail override only: no DOM replacement, hiding, or re-parenting.
 */

/* On a cold homepage load the React shell briefly mounts before the long
   homepage body. Keep its footer below the fold during that one-frame gap.
   The :has() gate deliberately avoids changing short inner pages. */
@supports selector(:has(*)) {
  #root > div.min-h-screen:has(
    > main > main[data-component-file="Home.tsx"]
  ) > main[data-component-file="layout.tsx"] {
    min-height: 100vh;
    min-height: 100svh;
  }
}

/* The homepage proof loop is mounted before its 122px system strip. Reserve
   exactly that desktop slot until the runtime prepends the real strip. */
@supports selector(.jn-proof-loop:has(> .jnm-system-strip-v2)) {
  @media (min-width: 1121px) {
    main[data-component-file="Home.tsx"] .jn-proof-loop:not(:has(> .jnm-system-strip-v2)) {
      box-sizing: border-box;
      padding-top: 122px;
    }
  }
}

/* Contact tabs already have an accessible label before the CMS adds its data
   attribute. Match both states so active-class hydration cannot change size. */
#root main[data-component-file="Contact.tsx"]
  :is(nav[data-contact-service-tabs], nav[aria-label="联系服务"])
  a[href^="/contact"] {
  box-sizing: border-box !important;
  display: inline-flex !important;
  flex: 0 0 104px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 104px !important;
  min-width: 104px !important;
  max-width: 104px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 16px !important;
  line-height: 1 !important;
  transform: none !important;
}

@media (max-width: 600px) {
  /* Five solution anchors become two calm rows plus a full-width final action. */
  main[data-owner="solution"] > .jnm-lab .jnm-lab-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: stretch !important;
    gap: 8px !important;
    overflow-x: visible !important;
    scroll-snap-type: none !important;
  }

  main[data-owner="solution"] > .jnm-lab .jnm-lab-nav > button {
    box-sizing: border-box !important;
    flex: 1 1 calc(50% - 4px) !important;
    min-width: 0 !important;
    min-height: 44px !important;
    white-space: normal !important;
  }

  /* The two-column inspection table fits the content column and wraps long
     values instead of requiring a hidden horizontal swipe. */
  main[data-owner="solution"] > .jnm-lab .jnm-lab-table-wrap {
    max-width: 100% !important;
    overflow-x: visible !important;
  }

  main[data-owner="solution"] > .jnm-lab .jnm-lab-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed !important;
  }

  main[data-owner="solution"] > .jnm-lab .jnm-lab-table :is(th, td) {
    box-sizing: border-box;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
  }

  main[data-owner="solution"] > .jnm-lab .jnm-lab-table :is(th, td):first-child {
    width: 42%;
  }

  /* Show all six Academy destinations as two compact rows without cropping. */
  main[data-owner^="technical-"] :is(
    .academy-hub__tabs,
    .coating-library-tabs,
    .academy-global-tabs,
    .academy-faq-unified__tabs,
    section[data-technical-faq-tabs="true"] nav
  ) {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(44px, auto);
    align-items: stretch !important;
    justify-content: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    gap: 8px !important;
    overflow-x: visible !important;
    scroll-snap-type: none !important;
  }

  main[data-owner^="technical-"] .academy-hub__tabs {
    min-height: 120px !important;
    padding: 12px 16px !important;
  }

  main[data-owner^="technical-"] :is(
    .coating-library-tab-band,
    .academy-global-switcher,
    .academy-faq-unified__tabs-band,
    section[data-technical-faq-tabs="true"]
  ) {
    box-sizing: border-box !important;
    height: auto !important;
    min-height: 124px !important;
    padding-block: 13px !important;
  }

  main[data-owner^="technical-"] :is(
    .academy-hub__tabs,
    .coating-library-tabs,
    .academy-global-tabs,
    .academy-faq-unified__tabs,
    section[data-technical-faq-tabs="true"] nav
  ) > a {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding-inline: 12px !important;
    white-space: normal !important;
    text-align: center;
  }
}

@media (prefers-reduced-motion: reduce), (pointer: coarse) {
  main[data-owner="solution"] .jnm-lab-nav,
  main[data-owner^="technical-"] :is(
    .academy-hub__tabs,
    .coating-library-tabs,
    .academy-global-tabs,
    .academy-faq-unified__tabs
  ) {
    scroll-behavior: auto !important;
  }
}