/* 3D studio details: decoration only, no layout or content changes. */
body:before{
  opacity:.38;
  background-image:linear-gradient(rgba(85,72,54,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(85,72,54,.035) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(90deg,#000,transparent 32%,transparent 68%,#000);
}
@media(min-width:1101px){
}
.hero-visual:after{
  content:"";position:absolute;z-index:-1;inset:-28px;border-radius:48px;
  border:1px solid rgba(242,118,34,.15);
  box-shadow:0 0 0 10px rgba(242,118,34,.025),0 0 0 20px rgba(242,118,34,.02);
  pointer-events:none;
}
.trust-strip{background-image:repeating-linear-gradient(0deg,transparent 0 5px,rgba(242,118,34,.035) 5px 6px)}
.possibility-grid article,.model-path-grid article,.organizer-feature-grid article{
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
@media(hover:hover) and (pointer:fine){
  .possibility-grid article:hover,.model-path-grid article:hover,.organizer-feature-grid article:hover,.product:hover{
    transform:translateY(-4px);border-color:rgba(242,118,34,.3);
    box-shadow:0 16px 36px rgba(68,43,24,.09),0 3px 0 rgba(242,118,34,.12);
  }
  .btn.primary:hover,.order-mini:hover{box-shadow:0 10px 28px rgba(242,118,34,.32)}
}
/* The reveal follows the build direction, without a colored scan line. */
.process-panel.active .process-panel-media img{animation:studioBuildReveal .7s cubic-bezier(.2,.7,.2,1) both}
@keyframes studioBuildReveal{
  from{clip-path:inset(100% 0 0 0);opacity:.5}
  to{clip-path:inset(0);opacity:1}
}
@media(max-width:1100px){
}
.display-card .object-demo{display:none}
.studio-model{position:absolute;inset:5% 5% 25%;width:90%;height:70%;z-index:3;cursor:grab;touch-action:none;outline-offset:-5px;border-radius:20px}
.studio-model.dragging{cursor:grabbing}
/* Desktop model preview does not require WebGL in the visitor's browser. */
img.studio-model{display:block;object-fit:contain;user-select:none;-webkit-user-drag:none}
.studio-model.studio-model-fallback{background:url('assets/auto/holder.jpg') center / contain no-repeat}
.studio-model:focus-visible{outline:2px solid var(--orange)}
.studio-model-hint{position:absolute;z-index:3;left:18px;right:18px;bottom:54px;text-align:center;font-size:11px;color:#69635d;pointer-events:none}
.studio-model-controls{position:absolute;z-index:4;left:14px;right:14px;bottom:77px;display:flex;gap:6px;align-items:center;justify-content:center}
.studio-model-controls button{border:1px solid rgba(64,54,43,.16);border-radius:999px;background:rgba(255,255,255,.6);padding:7px 10px;font-size:11px;cursor:pointer;min-height:34px;color:var(--ink)}
.studio-model-controls button[aria-pressed="true"]{border-color:var(--orange);box-shadow:0 0 0 2px rgba(242,118,34,.13)}
.studio-model-controls button[data-model-tone]{width:30px;height:30px;min-height:30px;padding:0;background:var(--tone);flex-shrink:0}
.studio-model-controls button[data-model-tone="graphite"]{--tone:#697073}
.studio-model-controls button[data-model-tone="ivory"]{--tone:#e4d3b7}
.studio-model-controls button[data-model-tone="orange"]{--tone:#c3532a}
.studio-model-controls button:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
@media(min-width:1101px){
}
@media(max-width:1100px) and (min-width:761px){
}
@media(max-width:760px){
 .studio-model-hint{bottom:57px;font-size:10px}
}
@media(max-width:760px){
  /* Mobile homepage: remove the animated organizer, keep desktop unchanged. */
  .hero-visual{display:none}
  body:before{background-size:32px 32px;opacity:.24}
}
@media(prefers-reduced-motion:reduce){
  .process-panel.active .process-panel-media img{animation:none}
  .possibility-grid article,.model-path-grid article,.organizer-feature-grid article{transition:none}
  .possibility-grid article:hover,.model-path-grid article:hover,.organizer-feature-grid article:hover,.product:hover{transform:none}
}