/* C72: the full-bleed stage keeps the approved ribbon, sticky travel and c40
   return controller. Its first viewport entry is a separate scroll-linked
   optical reveal, not the generic one-time copy reveal. */
@media (min-width: 961px) {
  #process-story.rv { opacity: 1; transform: none; transition: none; }
  #process-story .process-story__layout { column-gap: clamp(34px,4vw,64px); padding-bottom: var(--process-tail, 0px); }
  #process-story .process-story__layout::before { display: none; }
  #process-story .process-story__visual { grid-column: 1 / -1; grid-row: 1; height: calc(100% + var(--process-tail, 0px)); }
  #process-story .process-story__steps { grid-column: 2; grid-row: 1; z-index: 3; position: relative; }
  #process-story .process-story__layout[data-process-entry-ready="true"] :is(.process-stage,.process-story__steps) {
    opacity: var(--process-entry, 1);
  }
  #process-story .process-stage {
    width: var(--process-viewport, 100%); margin-left: calc((100% - var(--process-viewport, 100%)) / 2);
    top: var(--top-h); height: calc(100svh - var(--top-h)); min-height: 580px;
    border-radius: 0; box-shadow: none; color: #e6e8e7;
    background: radial-gradient(ellipse at 44% 43%, #282c2d 0%, #202426 24%, #171a1b 48%, #111314 74%, #0d0f10 100%);
  }
  html[data-home-return="true"] #process-story .process-stage { position: relative; top: auto; }
  #process-story .process-stage::before {
    z-index: 1; opacity: .34; background: radial-gradient(ellipse at 49% 100%, #b9c4c00b, transparent 58%), linear-gradient(90deg, #080a0b50, transparent 24%, transparent 60%, #080a0b90);
  }
  #process-story .process-stage::after {
    content: ''; position: absolute; z-index: 1; inset: 0; opacity: .56; mix-blend-mode: soft-light; filter: grayscale(1) contrast(2.8); pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
  }
  #process-story .process-board, #process-story .process-stage__chrome, #process-story .process-stage__caption { display: none; }
  #process-story .process-story__step button { color: #e4e7e6; border-color: #c6cecc32; }
  #process-story .process-story__number, #process-story .process-story__result { color: #9aa4a3; }
  #process-story .process-story__copy i, #process-story .process-story__detail { color: #b5bfbd; }
  #process-story .process-story__detail { border-color: #c6cecc32; }
  #process-story .process-story__step button[aria-current="true"] { text-shadow: 0 1px 15px #0b0d0e; }
  .process-scene { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
  .process-scene__canvas { position: absolute; inset: 10% 30% 16% 17%; }
  .process-scene__canvas canvas { display: block; width: 100%; height: 100%; }
  .process-scene__annotations { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
  .process-scene__annotations polyline { fill: none; stroke: #a9b2b0; stroke-opacity: .6; stroke-width: .75; vector-effect: non-scaling-stroke; }
  .process-scene__annotations circle { fill: #c3cbc9; stroke: #303536; stroke-width: 1; }
  .process-scene__annotations text { font: 10px var(--mono); letter-spacing: .025em; fill: #dce2df; stroke: none; }
  .process-scene__annotations .process-scene__callout-number { fill: #949e9b; }
  .process-scene__canvas:not([data-ready="true"]) .process-scene__annotations { visibility: hidden; }
  .process-scene__heading { position: absolute; top: 7%; left: clamp(44px, 4vw, 96px); width: 26%; }
  .process-scene__kicker { margin: 0 0 23px; font: 10px/1.5 var(--mono); letter-spacing: .19em; color: #adb6b3; }
  .process-scene__heading h4 { margin: 0; font-size: clamp(28px, 2.8vw, 56px); line-height: 1.05; font-weight: 500; letter-spacing: .025em; text-transform: uppercase; }
  .process-scene__spec { margin-top: 32px; max-width: 240px; font: 9px/1.6 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
  .process-scene__spec p { display: flex; justify-content: space-between; gap: 15px; padding: 8px 0; margin: 0; border-bottom: 1px solid #c6cecc28; }
  .process-scene__spec span { color: #8c9693; }
  .process-scene__spec b { font-weight: 400; color: #cbd2cf; }
  .process-scene__card { position: absolute; left: clamp(44px, 4vw, 96px); bottom: 55px; width: 255px; display: grid; grid-template-columns: 53px 1fr; gap: 14px; align-items: center; padding: 13px; background: #c8d2ce06; border: 1px solid #d2dcd726; border-radius: 11px; backdrop-filter: blur(14px); }
  .process-scene__card svg { width: 53px; height: 53px; stroke: #aeb9b4; stroke-width: .65; fill: none; }
  .process-scene__card strong { display: block; font: 10px/1.4 var(--mono); letter-spacing: .07em; }
  .process-scene__card p { margin: 5px 0 0; color: #a1ada7; font: 9px/1.6 var(--mono); }
  .process-scene__nav { position: absolute; left: 47%; transform: translateX(-50%); bottom: 55px; display: flex; align-items: center; padding: 5px; border: 1px solid #d2dcd730; border-radius: 999px; background: #11161765; box-shadow: inset 0 1px #dce2df0a; backdrop-filter: blur(20px); pointer-events: auto; }
  .process-scene__nav button { position: relative; border: 0; border-radius: 999px; background: transparent; color: #bbc5bf; padding: 12px 15px; font: 10px/1.2 var(--mono); letter-spacing: .03em; white-space: nowrap; cursor: pointer; transition: background-color 280ms, color 280ms; }
  .process-scene__nav button[aria-pressed="true"] { background: #e1e7e2; color: #242a26; }
  .process-scene__nav button:hover:not([aria-pressed="true"]) { background: #e1e7e217; color: #f0f3f0; }
  .process-scene__nav button:focus-visible { outline: 2px solid #eff3f0; outline-offset: 5px; }
  .process-scene__nav button[aria-pressed="true"]::before { content: ''; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: currentColor; margin: 0 8px 2px 0; }
  .process-scene__index { position: absolute; right: clamp(44px, 4vw, 96px); bottom: 72px; font: 10px/1 var(--mono); letter-spacing: .17em; }
  .process-scene__fallback { position: absolute; left: 50%; top: 55%; transform: translate(-50%,-50%); width: 62%; height: 60%; color: #b5c1ba; opacity: .7; }
  .process-scene__canvas[data-ready="true"] .process-scene__fallback { display: none; }
  @media (max-width: 1350px) {
    .process-scene__heading { width: 25%; }
    .process-scene__spec { max-width: 190px; font-size: 8px; }
    .process-scene__card { bottom: 105px; width: 225px; }
    .process-scene__nav { left: 43%; }
    .process-scene__nav button { padding: 11px 12px; font-size: 9px; }
  }
  @media (max-height: 780px) {
    .process-scene__heading { top: 5%; }
    .process-scene__spec { margin-top: 20px; }
    .process-scene__card { bottom: 80px; }
    .process-scene__nav { bottom: 30px; }
    .process-scene__index { bottom: 46px; }
  }
}
/* Existing narrow-screen presentation is preserved, not redesigned in this pass. */
@media (max-width: 960px) { .process-scene { display: none; } }
@media (prefers-reduced-motion: reduce) { .process-scene__nav button { transition: none; } }
@media (prefers-reduced-motion: reduce) {
  #process-story .process-story__layout[data-process-entry-ready="true"] :is(.process-stage,.process-story__steps) { opacity: 1; }
}
html[data-motion="reduced"] .process-scene__nav button { transition: none; }
html[data-motion="reduced"] #process-story .process-story__layout[data-process-entry-ready="true"] :is(.process-stage,.process-story__steps) { opacity: 1; }
