/* Moving Atoms homepage: the "Scan to Model" card (factory scan vs model). Pairs with home.js. */
.ma-factory{background:#0b0b0d;touch-action:pan-y;cursor:ew-resize;isolation:isolate}
.ma-factory img{display:block;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.ma-factory .ma-fx-model{width:100%;height:auto}
.ma-fx-scan{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;
  clip-path:inset(0 calc(100% - var(--ma-split,100%)) 0 0)}
/* keeps the card's text readable over the bright model */
.ma-factory::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(0deg,rgba(8,8,8,.78) 0%,rgba(8,8,8,.42) 26%,rgba(8,8,8,0) 52%),linear-gradient(180deg,rgba(8,8,8,.35) 0%,rgba(8,8,8,0) 22%)}
.ma-fx-drag{user-select:none;-webkit-user-select:none}
.ma-fx-bar{position:absolute;top:0;bottom:0;left:var(--ma-split,100%);z-index:3;width:0;outline:none}
.ma-fx-line{position:absolute;top:0;bottom:0;left:-.5px;width:1px;background:rgba(255,255,255,.7);pointer-events:none;
  box-shadow:0 0 12px rgba(0,0,0,.35)}
.ma-fx-knob{position:absolute;left:-24px;top:42%;display:grid;place-items:center;width:48px;height:48px;margin-top:-24px;border-radius:50%;
  background:rgba(12,12,14,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.34);color:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.4);transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s}
.ma-fx-knob svg{width:18px;height:18px}
.ma-factory:hover .ma-fx-knob,.ma-fx-drag .ma-fx-knob{transform:scale(1.07);border-color:rgba(255,255,255,.6)}
.ma-fx-bar:focus-visible .ma-fx-knob{border-color:#b98cff;box-shadow:0 0 0 3px rgba(144,49,240,.55),0 8px 24px rgba(0,0,0,.4)}
.ma-fx-tag{position:absolute;top:42%;transform:translateY(-50%);padding:.42rem .7rem;border-radius:999px;white-space:nowrap;pointer-events:none;
  font-family:MA Mono,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.88);
  background:rgba(8,8,8,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.16);transition:opacity .3s}
.ma-fx-l{right:38px}
.ma-fx-r{left:38px}
/* the text overlay passes drags through to the image, except on its links */
.ma-factory-overlay{pointer-events:none;z-index:4}
.ma-factory-overlay a,.ma-factory-overlay button{pointer-events:auto}
@media (max-width:1279px){
  .ma-factory .ma-fx-model{height:100%;object-fit:cover}
  .ma-fx-knob,.ma-fx-tag{top:30%}
}
@media (prefers-reduced-motion:reduce){.ma-fx-knob,.ma-fx-tag{transition:none}}
