/* Interactive process schematic. Local-only enhancement of the existing homepage. */
.hub-motion-v2 { --hub-accent: #d0f178; --hub-layer: #a9da66; }
.hub-motion-v2 .home-hero-backdrop { opacity: .2; }
.hub-motion-v2 .home-hero-inner { padding-top: 122px; gap: 30px 48px; }
.hub-motion-v2 .hub-instrument { --hub-tilt-x: 0deg; --hub-tilt-y: 0deg; }
.hub-motion-v2 .hub-instrument-head { padding-bottom: 12px; }
.hub-motion-v2 .hub-instrument-title { font-size: 12px; }
.hub-motion-v2 .hub-motion-toggle { min-height: 40px; font-size: 12px; }
.hub-motion-v2 .hub-wafer-stage { aspect-ratio: 1.32; }
.hub-motion-v2 .hub-wafer-parallax {
  transform: perspective(1100px) rotateX(var(--hub-tilt-x, 0deg)) rotateY(var(--hub-tilt-y, 0deg)) translate3d(var(--hub-x, 0px),var(--hub-y, 0px),0);
  transition: transform .45s cubic-bezier(.2,.7,.2,1);
}
.hub-motion-v2 .hub-wafer-surface { inset: 14% 11%; transform: perspective(800px) rotateX(48deg) rotateZ(-28deg); border-color: var(--hub-layer); transition: transform 1.2s cubic-bezier(.2,.7,.2,1), border-color .7s; }
.hub-motion-v2 .hub-wafer-grid { background: linear-gradient(105deg, transparent 20%, rgba(208,241,120,.15) 48%, transparent 64%),repeating-linear-gradient(0deg,transparent 0 29px,rgba(177,200,159,.32) 29px 30px),repeating-linear-gradient(90deg,transparent 0 29px,rgba(177,200,159,.32) 29px 30px),linear-gradient(140deg,#142321,#425438 53%,#132722); }
.hub-wafer-pattern { position: absolute; inset: 0; background: repeating-linear-gradient(90deg,transparent 0 12px,rgba(221,255,162,.4) 12px 18px,transparent 18px 30px); mask-image: repeating-linear-gradient(0deg,transparent 0 11px,#000 11px 18px,transparent 18px 30px); opacity: .55; transition: opacity .8s; }
.hub-wafer-layer { position: absolute; inset: 14% 11%; border-radius: 50%; border: 1px solid var(--hub-layer); pointer-events: none; transition: transform 1.2s cubic-bezier(.2,.7,.2,1),opacity .8s,border-color .7s; }
.hub-layer-base { transform: translateY(19px) perspective(800px) rotateX(48deg) rotateZ(-28deg); background: linear-gradient(130deg,#1d3031,#374c45 45%,#101d1b); box-shadow: -2px 5px 0 #23352d,-3px 9px 0 #14211c; opacity:.8; }
.hub-layer-film { transform: translateY(-9px) perspective(800px) rotateX(48deg) rotateZ(-28deg); background: linear-gradient(110deg,transparent,rgba(159,242,223,.14),transparent); opacity:0; }
.hub-motion-v2 .hub-wafer-scan { animation-duration: 4.8s; }
.hub-motion-v2 .hub-center-mark { display: none; }
.hub-motion-v2 .hub-orbit-outer { inset: 4% 8%; border-style: solid; border-color: rgba(187,218,164,.18); }
.hub-motion-v2 .hub-orbit-inner { inset: 13% 16%; }
.hub-motion-v2 .hub-coordinate-top { top: 4%; font-size:10px; }
.hub-motion-v2 .hub-coordinate-bottom { bottom:2%; font-size:10px; }
.hub-motion-v2 .hub-process-node { font-size:10px; opacity:.45; transition:opacity .7s; }
.hub-motion-v2 .hub-node-one { top: 16%; }
.hub-motion-v2 .hub-node-four { bottom: 23%; }
.hub-motion-v2 .hub-process-node i { animation:none; background:var(--hub-layer); }
.hub-motion-v2[data-process="pattern"] .hub-node-one,
.hub-motion-v2[data-process="etch"] .hub-node-two,
.hub-motion-v2[data-process="deposit"] .hub-node-three,
.hub-motion-v2[data-process="inspect"] .hub-node-four { opacity:1; color:var(--hub-layer); }
.hub-metrology-target { position:absolute; top:40%; left:40%; width:20%; aspect-ratio:1; border:1px solid #b0e9e8; border-radius:50%; opacity:0; transform:scale(.8); transition:opacity .7s; animation:hub-target 6s ease-in-out infinite; animation-play-state:paused; }
.hub-metrology-target::before, .hub-metrology-target::after { content:""; position:absolute; background:#b0e9e8; }
.hub-metrology-target::before { top:50%; left:-18%; width:136%; height:1px; }
.hub-metrology-target::after { left:50%; top:-18%; height:136%; width:1px; }
.hub-process-controls { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-top:15px; }
.hub-process-controls button { display:flex; gap:9px; justify-content:center; align-items:center; min-height:48px; padding:8px 5px; border:1px solid #334039; border-radius:4px; background:rgba(14,24,20,.68); color:#b8c2bd; font:inherit; font-size:14px; cursor:pointer; transition:border-color .2s,background .2s,color .2s; }
.hub-process-controls button:hover { border-color:#91a67f; color:#f3f9ed; }
.hub-process-controls button[aria-pressed="true"] { background:#d0f178; border-color:#d0f178; color:#192113; }
.hub-process-controls button:focus-visible { outline:2px solid #e8ffd1; outline-offset:3px; }
.hub-process-number { font:11px/1 ui-monospace,SFMono-Regular,Menlo,monospace; opacity:.7; }
.hub-process-caption { min-height:24px; margin:12px 0 14px; font-size:13px; line-height:1.7; color:#ccd8cb; }
.hub-motion-v2 .hub-instrument-foot { flex-wrap:wrap; font-size:11px; padding-top:12px; gap:7px; }
.hub-motion-v2 .hub-instrument-index { display:inline; font-size:10px; }
.hub-motion-v2[data-process="etch"] { --hub-layer:#e4c38c; }
.hub-motion-v2[data-process="etch"] .hub-wafer-surface { transform:translateY(-13px) perspective(800px) rotateX(48deg) rotateZ(-22deg); }
.hub-motion-v2[data-process="etch"] .hub-wafer-pattern { opacity:1; background:repeating-linear-gradient(90deg,transparent 0 10px,#0a1616 10px 19px,#ccac76 19px 21px,transparent 21px 30px); }
.hub-motion-v2[data-process="etch"] .hub-layer-base { transform:translateY(28px) perspective(800px) rotateX(48deg) rotateZ(-22deg); }
.hub-motion-v2[data-process="etch"] .hub-wafer-scan { border-color:#f5deb1; background:linear-gradient(0deg,rgba(244,192,106,.25),transparent 95%); }
.hub-motion-v2[data-process="deposit"] { --hub-layer:#8fdddf; }
.hub-motion-v2[data-process="deposit"] .hub-wafer-surface { transform:translateY(-33px) perspective(800px) rotateX(48deg) rotateZ(-28deg); }
.hub-motion-v2[data-process="deposit"] .hub-layer-film { opacity:.8; transform:translateY(2px) perspective(800px) rotateX(48deg) rotateZ(-28deg); }
.hub-motion-v2[data-process="deposit"] .hub-layer-base { transform:translateY(36px) perspective(800px) rotateX(48deg) rotateZ(-28deg); }
.hub-motion-v2[data-process="deposit"] .hub-wafer-pattern { opacity:.13; }
.hub-motion-v2[data-process="deposit"] .hub-wafer-scan { border-color:#b6fdff; background:linear-gradient(0deg,rgba(90,222,218,.3),transparent 95%); }
.hub-motion-v2[data-process="inspect"] { --hub-layer:#9fd8e4; }
.hub-motion-v2[data-process="inspect"] .hub-metrology-target { opacity:1; }
.hub-motion-v2[data-process="inspect"] .hub-wafer-focus { opacity:0; }
.hub-motion-v2[data-process="inspect"] .hub-wafer-scan { opacity:0; visibility:hidden; }
.hub-motion-v2[data-process="inspect"][data-motion="running"] .hub-metrology-target { animation-play-state:running; }
@keyframes hub-target { 0%,100% { transform:translate(-35%,-15%) scale(.8); } 35% { transform:translate(35%,-40%) scale(1); } 70% { transform:translate(20%,35%) scale(.85); } }
@media(min-width:701px) and (prefers-reduced-motion:no-preference) {
  .hub-motion-v2 .home-hero-copy { animation:hub-copy-in .9s both; }
  .hub-motion-v2 .hub-instrument { animation:hub-copy-in 1.1s .12s both; }
  @keyframes hub-copy-in { from { opacity:0; transform:translateY(15px); } to { opacity:1; transform:translateY(0); } }
}
@media(max-width:980px) {
  .hub-motion-v2 .home-hero-inner { gap:30px 24px; padding-top:116px; }
  .hub-process-controls button { gap:5px; font-size:13px; }
  .hub-process-number { display:none; }
  .hub-motion-v2 .hub-process-node { font-size:8px; }
  .hub-motion-v2 .hub-coordinate-top,.hub-motion-v2 .hub-coordinate-bottom { font-size:8px; }
  .hub-motion-v2 .hub-instrument-index { width:100%; margin-left:12px; }
}
@media(max-width:700px) {
  .hub-motion-v2 .home-hero-inner { padding-top:108px; gap:26px; }
  .hub-motion-v2 .hub-instrument { max-width:500px; }
  .hub-motion-v2 .hub-wafer-stage { aspect-ratio:1.25; }
  .hub-motion-v2 .hub-motion-toggle { min-height:44px; }
  .hub-process-controls button { font-size:14px; }
  .hub-motion-v2 .hub-instrument-foot { font-size:11px; }
  .hub-process-caption { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) {
  .hub-motion-v2 .hub-wafer-parallax { transform:none; }
  .hub-motion-v2 .hub-metrology-target { transform:scale(.8); }
}
