/* Graphite V2: a shared reading grid, bounded public covers, distinct motion roles. */
@font-face{font-family:Space Grotesk;src:url('assets/space-grotesk-500.woff') format('woff');font-weight:500;font-style:normal;font-display:swap}
.graphite-reference{--space:clamp(20px,5vw,80px);--v2-display:clamp(40px,5vw,72px);--v2-section:clamp(32px,3.34vw,48px);--v2-benefit:clamp(28px,2.37vw,34px);--ease:cubic-bezier(.22,1,.36,1);--paper:#f2f3f0;--muted:#b8c2c6;--ink:#111619}
.graphite-reference.brand-jri{--accent:#5a91ff;--accent-light:#a3c2ff}
.graphite-reference.brand-jap{--accent:#74b899;--accent-light:#a8d7be}
.graphite-reference{overflow-anchor:none}
.graphite-reference h1,.graphite-reference h2,.graphite-reference h3{font-family:Space Grotesk,Plex,Arial,sans-serif;font-weight:500;letter-spacing:-.02em;text-wrap:balance}
.jri-page h1,.jri-page h2,.jri-page h3{font-family:Space Grotesk,Plex,Arial,sans-serif;font-weight:500;letter-spacing:-.02em;text-wrap:balance}
.brand-jap{--signal:var(--accent-light)}
.brand-jap .nav-links a:hover:not(.inquiry),.brand-jap .approach li>span{color:var(--accent-light)}
.brand-jap .nav-links a[aria-current=location]:not(.inquiry)::after{background:var(--accent-light)}
.brand-jap .nav a:focus-visible,.brand-jap .nav button:focus-visible,.brand-jap .depth-controls button:focus-visible{outline-color:var(--accent-light)}
.brand-jri.graphite-reference .hero h1,.brand-jap.graphite-reference .jap-opening-hero h1{font-size:var(--v2-display);line-height:1.05;font-weight:500;letter-spacing:-.025em;max-width:14ch}
.graphite-reference .hero .intro{font-size:17px;line-height:1.6;max-width:48ch}
.graphite-reference .hero .copy{max-width:760px}
.graphite-reference .hero h1 span{white-space:normal}
.graphite-reference .section-heading h2,.graphite-reference .contact h2{font-size:var(--v2-section);line-height:1.1;font-weight:500;max-width:19ch}
.graphite-reference .section-heading>p{font-size:17px;line-height:1.6;max-width:48ch;color:var(--muted)}
.graphite-reference .capability-section,.graphite-reference .depth-story{padding:80px max(var(--space),calc((100% - 1280px)/2));background:#111619}
.graphite-reference .depth-story{background:#1c2327;padding-top:64px}
.graphite-reference .capability-orientation{padding:20px max(var(--space),calc((100% - 1280px)/2));gap:24px}
.capability-orientation p{font-size:17px;line-height:1.4}
.capability-orientation>span{font-size:13px}
.graphite-reference .capability-section .section-heading{gap:32px;margin-bottom:40px;align-items:end}
.capability-section .section-label{margin-bottom:24px}
.capability-explorer{grid-template-columns:220px minmax(0,1fr);gap:48px}
.capability-choices{border-top:0;gap:4px}
.capability-choices button{min-height:52px;padding:12px 0;border:0;font-size:17px;line-height:1.4;align-items:center;position:relative}
.capability-choices button::after{content:'';position:absolute;bottom:3px;left:0;right:0;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 180ms var(--ease)}
.capability-choices button[aria-pressed=true]{border:0;padding-bottom:12px;color:var(--paper)}
.capability-choices button[aria-pressed=true]::after{transform:scaleX(1)}
.capability-indicator{width:5px;height:5px;flex:0 0 5px;background:var(--accent);visibility:hidden}
.capability-panel,.capability-panel.has-portrait-cover{grid-template-columns:minmax(0,min(var(--capability-cover-width,360px),48%)) minmax(0,1fr);grid-template-rows:auto 1fr;grid-template-areas:'media intro' 'media copy';gap:20px 32px}
.capability-panel.has-portrait-cover{grid-template-columns:minmax(0,min(var(--capability-cover-width,270px),38%)) minmax(0,1fr)}
.capability-media{width:100%;max-width:var(--capability-cover-width,360px)}
.capability-image{width:100%;position:relative;background:transparent}
.capability-image img{width:100%;height:auto;max-width:100%;display:block;object-fit:contain;transition:opacity 180ms ease}
.capability-image[data-media-state=loading] img{opacity:0}
.capability-image[data-media-state=loading]::after{content:'Loading preview…';position:absolute;inset:16px auto auto 0;color:var(--muted);font:400 13px/1.5 Plex,Arial,sans-serif}
.capability-image[data-media-state=error] img{display:none}
.capability-image[data-media-state=error]{min-height:0;aspect-ratio:auto!important}
.capability-image-fallback{margin:0;border-left:2px solid var(--accent);color:var(--muted)}
.capability-image-fallback[hidden]{display:none}
.capability-media figcaption{font-size:13px;line-height:1.5;padding-top:12px;color:var(--muted)}
.capability-family{font-size:13px;line-height:1.5;margin-bottom:8px;color:var(--accent-light)}
.capability-section .capability-intro h3{font-size:var(--v2-benefit);line-height:1.18;font-weight:500;max-width:19ch;margin:0}
.capability-summary{font-size:17px;line-height:1.6;margin:0 0 20px;max-width:55ch}
.capability-scope{font-size:13px;line-height:1.5;color:var(--muted);margin:0 0 20px;max-width:48ch}
.capability-actions{align-items:flex-start;flex-direction:column;gap:4px}
.capability-actions a{font-size:17px;line-height:1.4;min-height:44px}
.capability-work{font-size:16px!important;text-decoration-thickness:1px}
.graphite-reference .depth-step h3{font-size:var(--v2-benefit);font-weight:500;line-height:1.18}
.graphite-reference .depth-step>p:not(.step-index):not(.step-detail){font-size:17px;line-height:1.6}
.graphite-reference .depth-controls button{font-size:16px;min-height:44px}
.graphite-reference .depth-figure{background:#111619}
.graphite-reference .process-path{transition:none}
.graphite-reference .depth-step:last-child{padding-bottom:48px}
@media(max-width:1100px){
 .capability-explorer{grid-template-columns:180px minmax(0,1fr);gap:32px}
 .capability-panel,.capability-panel.has-portrait-cover{grid-template-columns:1fr;grid-template-areas:'intro' 'media' 'copy';gap:16px}
 .capability-media{width:min(100%,var(--capability-cover-width,360px))}
 .capability-panel.has-portrait-cover .capability-media{width:min(72%,var(--capability-cover-width,270px))}
 .graphite-reference .capability-section,.graphite-reference .depth-story{padding-block:64px}
}
@media(max-width:760px){
 .graphite-reference{--space:20px}
 .brand-jri.graphite-reference .hero h1,.brand-jap.graphite-reference .jap-opening-hero h1{font-size:40px;line-height:1.1;max-width:15ch}
 .graphite-reference .hero .intro{font-size:16px;line-height:1.6}
 .graphite-reference .hero-body,.brand-jap.graphite-reference .jap-opening-hero .hero-body{padding-left:20px;padding-right:20px}
 .graphite-reference .capability-orientation{padding:16px 20px;display:block}
 .capability-orientation p{font-size:16px}.capability-orientation>span{font-size:13px;margin-top:4px}
 .graphite-reference .capability-section,.graphite-reference .depth-story{padding:48px 20px}
 .capability-section .section-label{margin-bottom:20px;font-size:13px}
 .graphite-reference .capability-section .section-heading{display:block;margin-bottom:24px}
 .graphite-reference .section-heading h2{font-size:32px;line-height:1.12;margin-bottom:16px}
 .graphite-reference .section-heading>p{font-size:16px}
 .capability-explorer{display:block}
 .capability-choices{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;margin-bottom:24px}
 .capability-choices button{font-size:16px;min-height:48px;padding:10px 0;gap:8px}
 .capability-choices button[aria-pressed=true]{padding-bottom:10px}
 .capability-section .capability-intro h3{font-size:28px;line-height:1.18;max-width:22ch}
 .capability-panel,.capability-panel.has-portrait-cover{gap:16px;grid-template-areas:'intro' 'media' 'copy'}
 .capability-summary{font-size:16px;line-height:1.6;margin-bottom:16px}
 .capability-actions a{font-size:16px}
 .graphite-reference .depth-step>p:not(.step-index):not(.step-detail){font-size:16px}
 .graphite-reference .depth-controls button{font-size:13px}
 .graphite-reference .depth-step h3{font-size:28px}
}
@media(max-height:500px) and (min-width:761px){
 .capability-choices button{min-height:48px;padding-block:10px}
 .capability-choices button[aria-pressed=true]{padding-bottom:10px}
 .graphite-reference .hero h1{font-size:48px}
}
@media(prefers-reduced-motion:reduce){.capability-choices button::after,.capability-image img{transition:none}}

.scene-flow .depth-step{scroll-margin-top:120px}.scene-flow .depth-steps{display:block}.scene-flow .depth-sticky{position:relative;top:0}.scene-flow .depth-steps .depth-step{min-height:0;padding:24px 0}.scene-flow .scene-planes{max-height:260px}
