/* Graphite continuity: same industrial reading grid through work and inquiry. */
@font-face{font-family:Space Grotesk;src:url('assets/space-grotesk-500.woff') format('woff');font-weight:500;font-display:swap}
.jri-site .continuity-marquee{overflow:hidden;contain:paint}
.jri-site .continuity-marquee .customer-track{display:flex;width:max-content;animation:none;gap:0;will-change:transform}
.jri-site .continuity-marquee .customer-group{display:flex;flex:none;align-items:center;justify-content:space-around;gap:48px;width:max-content;min-width:calc(100vw - 2 * var(--space,64px));padding:0 48px 0 0;margin:0;list-style:none}
.jri-site .continuity-marquee .customer-item{flex:0 0 144px;width:144px;min-width:144px;height:88px;display:flex;align-items:center;justify-content:center}
.jri-site .continuity-marquee .customer-item img{width:100%;height:64px;object-fit:contain}
.jri-site .portfolio-viewport[data-motion=automatic]{scroll-snap-type:none;scroll-behavior:auto}
.jri-site .portfolio-header h2,.jri-site .featured-story h3,.jri-site .contact h2,.jri-site .contact form h3,.jri-page h1,.jri-page h2,.jri-page h3,.jiro-gateway h1,.jiro-gateway h2{font-family:Space Grotesk,Plex,Arial,sans-serif;font-weight:500;letter-spacing:-.025em;text-wrap:balance}
.jri-site .portfolio-header h2{font-size:clamp(32px,3.34vw,48px);line-height:1.12}
.jri-site .featured-story h3{font-size:clamp(28px,2.4vw,34px);line-height:1.18}
.jri-site .featured-work{column-gap:clamp(24px,4vw,64px)}
.jri-site .portfolio-intro,.jri-site .featured-story>p:not(.service-kicker){font-size:17px;line-height:1.6;max-width:48ch}
.jri-page{--accent:#5a91ff;--accent-light:#a3c2ff;--space:clamp(20px,5vw,80px)}
.jri-page.brand-jap{--accent:#74b899;--accent-light:#a8d7be}
.jri-page .wrap{width:calc(100% - 2 * var(--space));max-width:1280px;margin-inline:auto;padding-inline:0}
.jri-page .page-heading,.jri-page .story-heading{padding-block:40px 32px}
.jri-page .page-heading h1,.jri-page .story-heading h1,.jri-page .access-intro h1{font-size:clamp(36px,4.4vw,60px);line-height:1.1;max-width:19ch}
.jri-page .lead{font-size:18px;line-height:1.6;max-width:60ch}
.jri-page .jri-story-entry{gap:clamp(24px,4vw,64px);padding-block:28px;align-items:start}
.jri-page .jri-story-image{height:auto;aspect-ratio:auto;background:transparent;display:block}
.jri-page .jri-story-image img{display:block;height:auto;aspect-ratio:revert-layer;max-height:340px;object-fit:contain;object-position:left top;width:100%}
.jri-page .jri-story-copy h2{font-size:clamp(28px,2.7vw,38px);line-height:1.16}
.jri-page .jri-story-copy>p{font-size:17px;line-height:1.6}
.jri-page .jri-story-filters a,.jri-page .jri-category-filter select,.jri-page .jri-category-filter button{min-height:44px;font-size:16px}
.jri-page .jri-category-filter{flex-wrap:wrap;gap:12px 20px}
.jri-page .access-composition{gap:clamp(24px,5vw,80px);align-items:start;margin-top:16px;padding-block:16px 48px;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
.jri-page .access-intro h1{font-size:clamp(34px,3.4vw,48px);line-height:1.12}
.jri-page .access-thumbnail{margin-top:24px}
.jri-page .access-thumbnail img{width:100%;max-height:380px;object-fit:contain;object-position:left}
.jri-page .jri-stories .page-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:12px 40px;padding-block:24px}
.jri-page .jri-stories .page-heading .eyebrow{grid-column:1/-1;margin:0}
.jri-page .jri-stories .page-heading h1{font-size:clamp(36px,3.4vw,48px);margin:0}
.jri-page .jri-stories .page-heading .lead{align-self:end;margin:0}
.jri-page .jri-story-filters{padding-block:12px;gap:8px 24px}
.jri-page .jri-category-filter{margin-block:12px}
.jri-page .jri-list-meta{margin-block:8px;padding-block:4px}
.jri-page .jri-list-meta p{margin:0}
.jri-page .portfolio-access-form{padding:clamp(24px,3vw,40px);border-top:2px solid var(--accent)}
.jri-page .portfolio-access-form h2{font-size:clamp(28px,2.6vw,36px);line-height:1.15}
.jri-page .portfolio-access-form label,.jri-page .portfolio-access-form input,.jri-page .portfolio-access-form button{font-size:16px}
.jri-page .portfolio-access-form .access-permission{align-items:start;line-height:1.5}
.jri-page .portfolio-access-form .access-permission input{flex:0 0 auto;margin-top:4px}
.jri-page .story-detail .gallery-section{padding-top:40px}
.jri-page .story-detail .section-head h2{font-size:clamp(28px,3vw,42px)}
.graphite-reference .contact-grid{max-width:1440px;margin-inline:auto;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}
.graphite-reference .contact-scene{padding:48px clamp(24px,4vw,64px);min-height:0}
.graphite-reference .contact .section-label{margin-bottom:28px}
.graphite-reference .contact h2{font-size:clamp(32px,3.34vw,48px);line-height:1.12}
.graphite-reference .contact-email{margin-top:24px}
.graphite-reference .contact-note{padding-top:36px}
.graphite-reference .contact form{padding:40px clamp(24px,3vw,48px);align-self:stretch}
.graphite-reference .contact form h3{font-size:28px;line-height:1.18}
.graphite-reference .contact label,.graphite-reference .contact input,.graphite-reference .contact select,.graphite-reference .contact textarea{font-size:16px;line-height:1.5}
.graphite-reference .contact input:focus-visible,.graphite-reference .contact select:focus-visible,.graphite-reference .contact textarea:focus-visible,.portfolio-access-form input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.jiro-gateway .intro{padding-block:40px 32px}
.jiro-gateway .intro h1{font-size:clamp(36px,4.2vw,64px);line-height:1.1}
.jiro-gateway .choices{gap:0;background:#1c2327}
.jiro-gateway .company{min-height:500px;padding:28px 32px 32px}
.jiro-gateway .company-top{min-height:164px}
.jiro-gateway .company h2{font-size:clamp(28px,2.7vw,40px);line-height:1.15}
.jiro-gateway .company-image>img{transition:transform 420ms cubic-bezier(.22,1,.36,1)}
.jiro-gateway .company:hover .company-image>img{transform:scale(1.025)}
.jiro-gateway .scope{max-width:38ch;min-height:75px}
@media(max-width:760px){
 .jri-site .continuity-marquee .customer-group{gap:32px;padding-right:32px;min-width:0}
 .jri-site .continuity-marquee .customer-item{width:120px;min-width:120px;flex-basis:120px;height:72px}
 .jri-site .continuity-marquee .customer-item img{height:56px}
 .jri-site .portfolio-intro,.jri-site .featured-story>p:not(.service-kicker){font-size:16px}
 .jri-page .page-heading,.jri-page .story-heading{padding-block:24px}
 .jri-page .lead,.jri-page .jri-story-copy>p{font-size:16px}
 .jri-page .jri-story-entry{gap:20px;padding-block:28px}
 .jri-page .access-composition{grid-template-columns:1fr;padding-block:12px 40px;gap:28px;margin-top:12px}
 .jri-page .jri-stories .page-heading{display:block;padding-block:20px}
 .jri-page .jri-stories .page-heading h1{font-size:34px;margin:10px 0 12px}
 .jri-page .jri-stories .page-heading .lead{font-size:16px}
 .jri-page .jri-story-filters{gap:4px 16px;padding-block:8px}
 .jri-page .jri-category-filter{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px}
 .jri-page .jri-category-filter label{grid-column:1/-1}
 .jri-page .jri-category-filter select{width:100%;min-width:0;padding:10px 8px}
 .jri-page .jri-category-filter button{padding:10px 14px}
 .jri-page .access-thumbnail{max-width:320px;margin:20px 0 0}
 .jri-page .access-thumbnail img{width:100%;max-height:260px}
 .jri-page .portfolio-access-form{padding:24px 20px}
 .graphite-reference .contact-grid{grid-template-columns:1fr}
 .graphite-reference .contact-scene{padding:36px 20px 28px;min-height:0}
 .graphite-reference .contact .section-label{margin-bottom:20px}
 .graphite-reference .contact-note{padding-top:24px}
 .graphite-reference .contact form{padding:28px 20px}
 .graphite-reference .contact .form-row{grid-template-columns:1fr}
 .jiro-gateway .intro{padding-block:24px}
 .jiro-gateway .intro h1{font-size:34px}
 .jiro-gateway .company{min-height:360px;padding:20px}
 .jiro-gateway .company-top{min-height:100px}
 .jiro-gateway .company h2{font-size:29px}
 .jiro-gateway .scope{font-size:16px;min-height:0;margin-bottom:20px}
}
@media(prefers-reduced-motion:reduce){
 .jri-site .continuity-marquee .customer-track{width:100%;transform:none!important;will-change:auto}
 .jri-site .continuity-marquee .customer-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;min-width:0;gap:16px;padding:0}
 .jri-site .continuity-marquee .customer-item{width:100%;min-width:0}
 .jri-site .continuity-marquee [data-decorative-duplicate]{display:none}
 .jiro-gateway .company-image>img{transition:none;animation:none;transform:none!important}
}

/* C2: a visible scroll score, with stable reading and input surfaces. */
.continuity-journey .section-label{position:relative}
.continuity-journey>.section-label::after,.continuity-journey .capability-stage::after{content:'';display:block;position:absolute;left:0;bottom:-12px;width:100%;height:2px;background:var(--accent);transform:scaleX(var(--journey-progress,1));transform-origin:left;pointer-events:none}
.continuity-journey .capability-stage{position:relative;padding-bottom:24px}
.continuity-journey .capability-image{translate:0 var(--journey-travel,0px)}
.continuity-journey .capability-media{padding-block:28px 8px}
.continuity-journey .capability-media figcaption{position:relative;margin-top:20px}
.continuity-journey .scene-planes{transform:perspective(1000px) translateY(calc(var(--journey-travel,0px) * -.45)) rotateY(var(--journey-depth,0deg));transform-origin:50% 60%}
.continuity-journey .process-path{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--journey-progress,1));transition:none}
.continuity-journey .featured-preview{translate:0 calc(var(--journey-travel,0px) * -.35)}
.continuity-journey.about .about-grid>h2{translate:0 calc(var(--journey-travel,0px) * .3)}
.continuity-journey .contact-photo,.continuity-journey .jap-contact-photo{transform:translateY(calc(var(--journey-travel,0px) * .35)) scale(1.025)}
.graphite-reference .contact{padding:48px var(--space);background:#111619}
.graphite-reference .contact-grid{max-width:1320px;width:100%;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,600px);gap:40px;align-items:start}
.graphite-reference .contact-scene{padding:32px 28px;min-height:0;height:auto}
.graphite-reference .contact form{width:100%;max-width:600px;height:auto;min-height:0;padding:32px 36px;align-self:start}
.graphite-reference .contact #inquiry-form{padding:32px 36px;margin:0;align-self:start;min-height:0}
.graphite-reference .contact #inquiry-form button[type=submit]{width:fit-content;max-width:100%;min-width:232px;gap:24px}
.graphite-reference .contact form h3{margin:0 0 12px;font-size:28px}
.graphite-reference .contact .form-instructions{font-size:16px;line-height:1.5;margin:0 0 20px}
.graphite-reference .contact .form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0}
.graphite-reference .contact .field{margin:0 0 16px;min-width:0}
.graphite-reference .contact .field label{display:block;margin:0 0 6px;font-size:16px;line-height:1.4}
.graphite-reference .contact .field input,.graphite-reference .contact .field select{height:46px;min-height:44px;width:100%;padding:10px 12px;font-size:16px}
.graphite-reference .contact .field textarea{height:112px;min-height:100px;padding:10px 12px;width:100%;font-size:16px;resize:vertical}
.graphite-reference .contact .field-error:empty,.graphite-reference .contact #form-status:empty{display:none}
.graphite-reference .contact .form-hint{font-size:13px;line-height:1.5;margin:8px 0 16px}
.graphite-reference .contact button[type=submit]{min-height:46px;width:auto;padding:12px 20px;margin-top:4px}
.graphite-reference .contact-note{padding-top:20px;margin-top:0;display:flex;gap:16px;align-items:baseline}
.graphite-reference .contact-note p{margin:0;font-size:13px;line-height:1.5}
.graphite-reference .contact-email{margin-top:20px;font-size:24px}
.graphite-reference .jri-location{margin-top:24px;padding-top:20px;gap:8px;font-size:14px;line-height:1.5}
.contact-map{width:100%;margin:20px 0 0;border:1px solid #394248;background:#1c2327;position:relative}
.contact-map iframe{display:block;width:100%;height:220px;border:0;color-scheme:normal}
.contact-map figcaption{padding:8px 12px;font:400 12px/1.5 Plex,Arial,sans-serif;color:#b8c2c6}
.graphite-reference .contact-grid>.contact-scene>.contact-image-caption{margin-top:16px;font-size:11px}
@media(max-width:1000px) and (min-width:761px){.graphite-reference .contact-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:24px}.graphite-reference .contact form{padding:28px 24px}.graphite-reference .contact-scene{padding:28px 20px}}
@media(max-width:760px){
 .graphite-reference .contact{padding:32px 20px}
 .graphite-reference .contact-grid{grid-template-columns:1fr;gap:24px}
 .graphite-reference .contact-scene{padding:24px 0}
 .graphite-reference .contact form{padding:28px 20px;max-width:600px}
 .graphite-reference .contact #inquiry-form{padding:28px 20px}
 .graphite-reference .contact .form-row{grid-template-columns:1fr;gap:0}
 .contact-map iframe{height:200px}
 .graphite-reference .contact h2{font-size:32px}
 .continuity-journey .capability-media{padding-top:24px}
}
@media(prefers-reduced-motion:reduce){.continuity-journey .capability-image,.continuity-journey .featured-preview,.continuity-journey.about .about-grid>h2{translate:none}.continuity-journey .scene-planes,.continuity-journey .contact-photo,.continuity-journey .jap-contact-photo{transform:none}}

/* Keep the plain JAP contact label on its existing company accent. */
.graphite-reference.brand-jap .contact-note>span{color:var(--accent-light)}
