.jri-site{--error:#ffb5a5;--space:clamp(24px,5vw,88px)}
.jri-site .hero-poster{position:absolute;inset:0;z-index:-4;width:100%;height:100%;object-fit:cover}
.jri-site .review-controls{gap:24px}.jri-site .review-controls a{min-height:44px;display:flex;align-items:center}
.jri-site .contact-email{display:inline-block;font-size:clamp(20px,2.4vw,30px);margin-top:32px;border-bottom:1px solid #839eae;padding-bottom:8px}
.jri-site .portfolio-card{display:flex;color:var(--paper);text-decoration:none}
.jri-site .portfolio-empty{padding:42px var(--space);border-block:1px solid #788991}.jri-site .portfolio-empty h3{font-size:28px;font-weight:500}.jri-site .portfolio-empty p{max-width:55ch;margin-block:18px;line-height:1.6}
.jri-site .project-no-image{display:flex;align-items:center;justify-content:center;height:100%;padding:24px;background:#18242d;color:#c4d3dc;font-size:20px}
.jri-site .dialog-narrative{margin-block:26px}.jri-site .dialog-narrative h3{font-size:21px;margin-bottom:10px;font-weight:500}.jri-site .dialog-narrative p{font-size:16px;line-height:1.65;max-width:70ch;white-space:pre-line}
.jri-site .project-page-link{display:block;margin-top:20px;color:#315ca3;text-decoration:underline;text-underline-offset:5px;min-height:44px}
.jri-site .image-inspect{display:block;position:relative}.jri-site .image-action{display:block;background:#18242d;color:#f2f3f0;padding:12px 16px;font-size:13px;min-height:44px}.jri-site .image-inspect.is-inspecting{overflow:auto;max-height:70svh}.jri-site .image-inspect.is-inspecting img{width:auto;max-width:none;height:auto;max-height:none}
.jri-site .dialog-media img:not([src]){display:none}.jri-site .media-error{padding:20px;border:1px solid #66747b;font-size:15px;line-height:1.6}
.jri-site .form-hint{font-size:13px;line-height:1.55;color:#bdcbd2;margin-block:8px 22px}.jri-site .form-hint a{text-decoration:underline;text-underline-offset:4px}
.jri-site .field-error{color:var(--error);font-size:13px;line-height:1.5}.jri-site [aria-invalid=true]{border-color:var(--error)}
.jri-site #form-status{font-size:16px;line-height:1.6;margin-bottom:20px}.jri-site #form-status:empty{display:none}.jri-site .form-context{font-size:13px;line-height:1.5;margin-bottom:20px;color:#d8e4ec;overflow-wrap:anywhere}
.jri-site .honey{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.jri-site button:disabled{cursor:default;opacity:.6}.jri-site .new-inquiry{padding:14px 0;background:none;text-align:left;text-decoration:underline;min-height:44px}.jri-site .new-inquiry[hidden]{display:none}
.jri-site .dialog-content,.jri-site .contact-grid>*,.jri-site .form-row>*{min-width:0}.jri-site .field input,.jri-site .field textarea,.jri-site .field select{max-width:100%;font-size:16px}.jri-site .dialog-content h2{overflow-wrap:anywhere}
.jri-site [hidden]{display:none!important}.jri-site .portfolio-controls.is-unnecessary{display:none}.jri-site .portfolio-card img{pointer-events:none}
.jri-site .footer{flex-wrap:wrap}.jri-site .footer a{min-height:44px;display:flex;align-items:center}.jri-site .service-detail ul{line-height:1.7}
.jri-site .paper :focus-visible,.jri-site .customers :focus-visible,.jri-site .portfolio :focus-visible,.jri-site .portfolio:focus-visible,.jri-site .portfolio-dialog :focus-visible,.jri-site .review :focus-visible{outline-color:#204b93}
@media(max-width:760px){.jri-site .review-title span{display:none}.jri-site .review-controls{gap:12px}.jri-site .review{padding-inline:24px}.jri-site .nav-links.open{max-height:calc(100svh - 110px);overflow:auto}.jri-site .nav-links a{min-height:44px}.jri-site .portfolio-dialog{max-height:90svh}}
@media(max-width:380px){.jri-site .portfolio-controls .portfolio-pause{min-width:84px}.jri-site .portfolio-controls button{padding-inline:7px}.jri-site .portfolio-control-row{gap:6px}.jri-site .portfolio-track li{width:calc(100vw - 64px)}.jri-site .monitor-panel{padding:16px 12px;gap:12px}.jri-site .review-controls a{font-size:10px}}
@media(max-width:600px){.jri-site .chart-axis{font-size:22px}.jri-site .chart-time-mid{display:none}}

/* Graphite Motion: one scale for editorial copy, controls and engineering labels. */
.jri-site {
  --ink: #111619;
  --surface: #1c2327;
  --blue: #5a91ff;
  --signal: #a3c2ff;
  --label: .75rem;
  --small: .875rem;
  --body-size: clamp(1.0625rem, .95rem + .25vw, 1.1875rem);
  --title-size: clamp(2.25rem, 1.3rem + 3vw, 3.75rem);
  --section-space: clamp(64px, 6.3vw, 104px);
  --motion-fast: 180ms;
  --motion-enter: 320ms;
  --ease: cubic-bezier(.22,.68,0,1);
  --space: clamp(20px, 4.5vw, 80px);
}
.jri-site .logo img { height: auto; }
.jri-site .logo { mix-blend-mode: normal; }
.jri-site .logo svg { display: block; width: 100%; height: 100%; }
.jri-site .review { min-height: 44px; padding-block: 0; }
.jri-site .review-title,.jri-site .review-controls a,.jri-site .motion-toggle { font-size: var(--label); }
.jri-site .motion-toggle { min-height: 44px; border: 0; text-decoration: underline; text-underline-offset: 5px; }
.jri-site .nav { background: #111619ed; }
.jri-site .nav.scrolled { background: var(--ink); }
.jri-site .nav-links { font-size: .9375rem; }
.jri-site .brand-label { font-size: .6875rem; }
.jri-site .hero { height: 100svh; min-height: 680px; }
.jri-site .hero-body { min-height: 0; padding-top: calc(var(--nav-height) + 40px); padding-bottom: 114px; }
.jri-site .copy { width: 61%; max-width: 830px; }
.jri-site .hero h1 { font-size: clamp(3rem, 4.9vw, 5.25rem); line-height: 1.06; letter-spacing: -.045em; }
.jri-site .hero .eyebrow { font-size: var(--label); margin-bottom: 24px; }
.jri-site .hero .intro { font-size: var(--body-size); line-height: 1.6; max-width: 48ch; margin-top: 24px; }
.jri-site .cta-pair { margin-top: 28px; gap: 24px; }
.jri-site .button,.jri-site .text-link,.jri-site .underlined { font-size: 1rem; }
.jri-site .hero-caption,.jri-site .scroll-cue,.jri-site .playback { font-size: var(--label); }
.jri-site .arrow { transition: transform var(--motion-fast) var(--ease); }
.jri-site .button:hover .arrow,.jri-site .text-link:hover .arrow { transform: translateX(4px); }
.jri-site .hero .scrim { --left: .94; --middle: .72; --right: .24; }
/* The source clip includes a production slate along its lower edge. Keep that
   out of the customer view; the neutral data label remains in real page text. */
.jri-site .hero .bg,.jri-site .hero .hero-poster { clip-path: inset(0 0 6% 0); }
.jri-site h2,.jri-site .portfolio-header h2,.jri-site .contact h2 { font-size: var(--title-size); line-height: 1.1; letter-spacing: -.035em; font-weight: 500; }
.jri-site .section-label,.jri-site .step-index,.jri-site .step-detail,.jri-site .approach-label { font-size: var(--label); letter-spacing: .08em; }
.jri-site .section-heading,.jri-site .overview-grid,.jri-site .about-grid,.jri-site .contact-grid { gap: clamp(28px, 5vw, 80px); }
.jri-site .section-heading>p,.jri-site .portfolio-intro { font-size: var(--body-size); max-width: 40ch; }
.jri-site .section-heading { margin-top: 32px; margin-bottom: 40px; }
.jri-site .overview-grid,.jri-site .about-grid,.jri-site .contact-grid { margin-top: 32px; }
.jri-site .overview-copy,.jri-site .about-intro { max-width: 49ch; }
.jri-site .overview { padding-bottom: 24px; }
.jri-site .capability-line { margin-top: 40px; }
.jri-site .capability-line a { font-size: clamp(1rem, 1.2vw, 1.1875rem); }
.jri-site .plant { padding-top: 48px; }
.jri-site .customers { padding-block: 28px 20px; }
.jri-site .customers-heading h2 { font-size: clamp(1.125rem, 1.5vw, 1.375rem); }
.jri-site .customer-caption { display: none; }
.jri-site .customer-marquee { margin-top: 16px; }
.jri-site .customer-item { height: 72px; }
.jri-site .customer-item img { height: 60px; }
.jri-site .motion-button { font-size: var(--label); }
.jri-site .customer-marquee:focus-within .customer-track { animation-play-state: paused; }

/* Keep type immediately visible. Only the plant heading rises slightly once;
   other sections identify their arrival with a short signal rule. */
.jri-site .reveal-title { overflow: visible; }
.jri-site .section-label { position: relative; padding-bottom: 15px; border-bottom: 1px solid #77879080; }
.jri-site .section-label::after { content: ''; position: absolute; bottom: -1px; left: 0; width: 48px; height: 2px; background: #315ca3; transform-origin: left; }
.jri-site .solutions .section-label::after,.jri-site .portfolio .section-label::after,.jri-site .contact .section-label::after { background: var(--blue); }
.jri-site .section-label.arrived::after { animation: signal-enter var(--motion-enter) var(--ease) both; }
.jri-site .plant .reveal-title.arrived { animation: plant-title-enter var(--motion-enter) var(--ease) both; }
@keyframes signal-enter { from { transform: scaleX(.2); } to { transform: scaleX(1); } }
@keyframes plant-title-enter { from { transform: translateY(10px); } to { transform: translateY(0); } }

/* The image remains a landscape; readings sit below it, never across machines. */
.jri-site .plant-story { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); }
.jri-site .plant-visual { top: calc(var(--nav-height) + 16px); }
.jri-site .plant-visual-v02 .visual-topline { font-size: var(--label); padding: 12px 18px; letter-spacing: .04em; }
.jri-site .data-motion-toggle { display: block; font-size: var(--label); min-height: 44px; }
.jri-site .plant-picture { min-height: 0; height: clamp(250px, 31vw, 360px); max-height: none; aspect-ratio: auto; }
.jri-site .plant-photo-v02 { object-position: center; }
.jri-site .monitor-panel { position: relative; inset: auto; width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; padding: 14px 20px; background: #18232c; }
.jri-site .monitor-panel-heading { grid-column: 1 / -1; font-size: var(--label); padding-bottom: 8px; }
.jri-site .monitor-panel-heading strong { font-size: var(--small); }
.jri-site .monitor-chart { min-width: 0; padding-top: 0; display: grid; grid-template-columns: 1fr; }
.jri-site .chart-label { display: flex; font-size: var(--small); }
.jri-site .chart-label strong { font-size: 1.75rem; margin: 0; }
.jri-site .chart-label small { font-size: var(--small); }
.jri-site .monitor-chart svg { height: 110px; margin-top: 4px; }
.jri-site .chart-axis { font-size: 13px; }
.jri-site .monitor-panel-note { grid-column: 1 / -1; font-size: var(--label); margin-top: 0; }
.jri-site .plant-visual-v02 figcaption { font-size: var(--label); padding: 12px 18px; }
.jri-site .machine-tag>span { font-size: .6875rem; }
.jri-site .machine-tag i { font-size: var(--label); }
.jri-site .integration-strip { left: 18px; right: 18px; bottom: 14px; justify-content: space-between; font-size: var(--label); }
.jri-site .machine-tag-three { left: 62%; top: 12%; }
.jri-site .story-step { min-height: 290px; border-left-width: 2px; padding-left: 24px; }
.jri-site .story-step.is-active { padding-left: 24px; border-left-width: 2px; }
.jri-site .story-step::before { content: ''; position: absolute; left: -5px; top: 51px; width: 8px; height: 8px; background: #83949c; transition: background var(--motion-fast) var(--ease); }
.jri-site .story-step.is-active::before { background: #315ca3; }
.jri-site .story-step h3 { font-size: clamp(1.75rem, 2.1vw, 2.25rem); }
.jri-site .story-step>p:not(.step-index):not(.step-detail) { font-size: var(--body-size); }
.jri-site .story-step .step-detail { font-size: var(--label); }
.jri-site .service-name { transition: color var(--motion-fast) var(--ease), transform var(--motion-fast) var(--ease); transform-origin: left center; }
.jri-site .service summary:hover .service-name,.jri-site .service summary:focus-visible .service-name { transform: translateX(5px); }
.jri-site .service[open] { border-top-color: var(--blue); }
.jri-site .service-descriptor,.jri-site .service-detail ul { font-size: 1rem; }
.jri-site .service-detail { font-size: var(--body-size); }
.jri-site .service[open] .service-detail { animation: plant-title-enter 220ms var(--ease); }
.jri-site .portfolio .section-label::after { left: var(--space); }
.jri-site .portfolio-header { margin-top: 32px; gap: 40px; }
.jri-site .portfolio-viewport { scrollbar-width: thin; }
.jri-site .portfolio-track li { width: clamp(300px, 28vw, 420px); }
.jri-site .portfolio-card { flex-direction: column; border-top: 2px solid #5f707b; transition: border-color var(--motion-fast) var(--ease); }
.jri-site .portfolio-card:hover,.jri-site .portfolio-card:focus-visible { border-top-color: var(--blue); }
.jri-site .project-card-body { display: flex; flex-direction: column; flex: 1; padding: 24px; }
.jri-site .project-card-title { font-size: clamp(1.5rem, 2vw, 1.875rem); min-height: 0; line-height: 1.15; }
.jri-site .project-card-category,.jri-site .project-card-bottom,.jri-site .portfolio-count,.jri-site .portfolio-controls button,.jri-site .portfolio-bottom { font-size: var(--label); }
.jri-site .project-card-summary { font-size: 1rem; min-height: 0; margin-bottom: 24px; }
.jri-site .project-card-bottom { margin-top: auto; padding-top: 16px; }
.jri-site .portfolio-card-image { aspect-ratio: 16 / 10; flex-shrink: 0; }
.jri-site .approach h3 { font-size: 1.375rem; }
.jri-site .approach li p { font-size: 1rem; }
.jri-site .approach li { position: relative; }
.jri-site .approach li::before { content: ''; position: absolute; left: 0; top: -1px; width: 24px; height: 2px; background: #315ca3; transform: scaleX(0); transform-origin: left; transition: transform var(--motion-enter) var(--ease); }
.jri-site .approach li.arrived::before { transform: scaleX(1); }
.jri-site .contact { background: #192126; }
.jri-site .field input,.jri-site .field textarea,.jri-site .field select { background: #202c33; }
.jri-site .field label { font-size: 1rem; }
.jri-site .footer .motion-toggle { color: var(--paper); font-size: var(--small); }
.jri-site .form-preview,.jri-site .form-hint,.jri-site .contact-note p { font-size: var(--small); }
.jri-site .portfolio :focus-visible { outline-color: var(--signal); }
.jri-site .portfolio-dialog :focus-visible { outline-color: #204b93; }
.jri-site .dialog-summary,.jri-site .dialog-narrative p { font-size: 1.0625rem; }
.jri-site .dialog-scope ul { font-size: 1rem; }

@media(max-width:1100px) {
  .jri-site .plant-story { grid-template-columns: 1fr; }
  .jri-site .plant-visual { position: relative; top: auto; max-width: none; }
  .jri-site .plant-picture { height: auto; aspect-ratio: 1.8; }
  .jri-site .story-steps { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); }
  .jri-site .story-step,.jri-site .story-step.is-active { min-height: 0; border-left: 0; border-top-width: 2px; padding: 24px 0 12px; }
  .jri-site .story-step::before { display: none; }
  .jri-site .nav-links { gap: 16px; font-size: .875rem; }
  .jri-site .monitor-chart svg { height: 130px; }
}
@media(max-height:760px) and (min-width:1101px) {
  .jri-site .plant-visual { position: relative; top: auto; }
}
@media(max-width:760px) {
  .jri-site .nav-links { font-size: 1rem; }
  .jri-site .copy { width: 100%; }
  .jri-site .section-label span:last-child { font-size: var(--label); }
  .jri-site .story-steps { grid-template-columns: 1fr; }
  .jri-site .story-step>p:not(.step-index):not(.step-detail) { max-width: 55ch; margin-top: 14px; }
  .jri-site .section-label { align-items: flex-start; }
}
@media(max-width:600px) {
  .jri-site { --title-size: clamp(2rem, 8.5vw, 2.75rem); --body-size: 1.0625rem; --nav-height: 66px; }
  .jri-site .review { display: flex; padding: 0 var(--space); gap: 12px; min-height: 44px; }
  .jri-site .review-title { margin: 0; }
  .jri-site .review-controls { gap: 16px; }
  .jri-site .review-controls a,.jri-site .motion-toggle { font-size: var(--label); }
  .jri-site .nav { height: 66px; padding-inline: var(--space); }
  .jri-site .nav-links { top: 66px; }
  .jri-site .hero { min-height: 0; height: auto; max-height: none; padding-top: 66px; overflow: hidden; display: flex; flex-direction: column; }
  .jri-site .hero-body { order: 1; height: auto; min-height: 0; padding: 28px var(--space) 20px; }
  .jri-site .hero .copy { max-width: none; }
  .jri-site .hero .eyebrow { font-size: .6875rem; letter-spacing: .06em; margin-bottom: 16px; }
  .jri-site .hero h1 { font-size: clamp(2rem, 8.5vw, 3.15rem); line-height: 1.08; letter-spacing: -.045em; }
  .jri-site .hero .intro { margin-top: 18px; font-size: 1rem; line-height: 1.5; max-width: 42ch; }
  .jri-site .hero .cta-pair { margin-top: 20px; gap: 10px 22px; }
  .jri-site .hero .button,.jri-site .hero .text-link { font-size: .9375rem; min-height: 46px; }
  .jri-site .hero .button { gap: 24px; padding: 12px 16px; }
  .jri-site .hero .text-link { gap: 12px; }
  .jri-site .hero .bg { position: relative; order: 2; inset: auto; z-index: 0; width: 100%; height: auto; aspect-ratio: 16/9; object-fit: contain; background: var(--ink); }
  .jri-site .hero .hero-poster { position: relative; order: 2; inset: auto; z-index: 0; height: auto; aspect-ratio: 16/9; object-fit: contain; display: none; }
  .jri-site .hero.video-failed .hero-poster { display: block; }
  .jri-site .hero .scrim { display: none; }
  .jri-site .hero-footer { position: relative; order: 3; inset: auto; padding: 12px var(--space) 18px; display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; }
  .jri-site .scroll-cue { width: auto; min-height: 44px; font-size: .6875rem; }
  .jri-site .playback { font-size: var(--label); }
  .jri-site .hero-caption { grid-column: 1 / -1; font-size: var(--label); }
  .jri-site .customers { padding: 24px var(--space); }
  .jri-site .customers-heading { align-items: center; }
  .jri-site .customers-heading h2 { font-size: 1.125rem; max-width: 18ch; }
  .jri-site .section-label span:last-child { display: none; }
  .jri-site .section-heading { margin-top: 24px; margin-bottom: 28px; }
  .jri-site .section-heading>p,.jri-site .portfolio-intro { font-size: var(--body-size); }
  .jri-site .plant-visual-v02 .visual-topline { font-size: .6875rem; padding: 10px 12px; gap: 12px; }
  .jri-site .data-motion-toggle { font-size: .6875rem; padding: 8px; }
  .jri-site .plant-picture { aspect-ratio: 4/3; }
  .jri-site .integration-strip { font-size: .6875rem; padding: 10px; gap: 5px; left: 10px; right: 10px; bottom: 10px; flex-wrap: wrap; }
  .jri-site .monitor-panel { padding: 16px 12px; gap: 12px; }
  .jri-site .chart-label { display: block; font-size: .8125rem; }
  .jri-site .chart-label strong { font-size: 1.75rem; margin-top: 6px; }
  .jri-site .monitor-chart svg { height: auto; }
  .jri-site .chart-axis { font-size: 22px; }
  .jri-site .monitor-panel-note { font-size: var(--label); }
  .jri-site .plant-visual-v02 figcaption { padding: 12px; font-size: var(--label); flex-wrap: wrap; }
  .jri-site .plant-visual-v02 figcaption span:last-child { max-width: none; text-align: left; }
  .jri-site .service-name { font-size: clamp(1.375rem, 6vw, 1.75rem); }
  .jri-site .service-descriptor { font-size: .9375rem; }
  .jri-site .service-detail { padding-left: 34px; font-size: 1rem; }
  .jri-site .service-detail ul,.jri-site .service-detail .underlined { font-size: .9375rem; }
  .jri-site .portfolio-track li { width: calc(100vw - 68px); }
  .jri-site .project-card-body { padding: 20px; }
  .jri-site .project-card-title { font-size: 1.5rem; }
  .jri-site .portfolio-count { max-width: none; font-size: .6875rem; }
  .jri-site .portfolio-controls button { font-size: .6875rem; }
  .jri-site .portfolio-control-row { align-items: center; gap: 8px; }
  .jri-site .portfolio-controls .portfolio-pause { min-width: 0; padding: 8px; }
  .jri-site .about-grid,.jri-site .contact-grid { gap: 36px; }
}
@media(prefers-reduced-motion:reduce) {
  .jri-site .section-label::after,.jri-site .approach li::before { transform: none; }
}
.motion-reduced .jri-site .section-label::after,.motion-reduced .jri-site .approach li::before { transform: none; }
