/* Expressive motion: transforms only; content remains visible without JavaScript. */
.miyatech-motion{position:fixed;right:18px;bottom:18px;z-index:45;padding:11px 16px;border:1px solid #7f4c3755;border-radius:30px;background:#F7F3EF;color:#29201C;box-shadow:0 7px 25px #29201c18;font:600 12px Arial,sans-serif;cursor:pointer}
.miyatech-motion:focus-visible{outline:3px solid #7F4C37;outline-offset:4px}.miyatech-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;background:#7F4C37;transform:scaleX(0);transform-origin:left;pointer-events:none}
html.js-motion .reveal-target{animation:none}.hero-visual{translate:var(--pointer-x,0px) var(--pointer-y,0px);transition:translate .35s ease-out}
html.motion-active .hero h1 .display-serif::after{transform:scaleX(1)}
html.motion-active .motion-card{transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .35s ease,box-shadow .35s ease}
html.motion-active .motion-card:hover{box-shadow:0 18px 40px #29201c1a}
html.motion-active .motion-card:focus-within{box-shadow:0 0 0 2px #D2A88D}
html.motion-active .tile-digital{animation:brand-digital-float 7s ease-in-out infinite}
html.motion-active .tile-hardware{animation:brand-hardware-float 8s ease-in-out infinite}
html.motion-active .orbit-two{animation:brand-orbit 42s linear infinite}
html.motion-active .visual-label{animation:brand-label 5s ease-in-out infinite alternate}
html.motion-active .code-line{transform-origin:left;animation:brand-code 4s ease-in-out infinite}
html.motion-active .code-line.short{animation-delay:.6s}
html.motion-active .screen-grid i{animation:brand-screen 4s ease-in-out infinite alternate}
html.motion-active .screen-grid i:nth-child(2n){animation-delay:1s}
html.motion-active .hero-note .dot{animation:brand-dot 3s ease-in-out infinite}
@keyframes brand-digital-float{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-12px) rotate(-5deg)}}
@keyframes brand-hardware-float{0%,100%{transform:translateY(0) rotate(7deg)}50%{transform:translateY(10px) rotate(5deg)}}
@keyframes brand-orbit{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes brand-label{from{opacity:.65;translate:0 0}to{opacity:1;translate:0 -7px}}
@keyframes brand-code{0%,100%{scale:1 1;opacity:.4}50%{scale:.72 1;opacity:.8}}
@keyframes brand-screen{from{opacity:.45}to{opacity:1}}
@keyframes brand-dot{0%,100%{scale:1;opacity:.6}50%{scale:1.4;opacity:1}}
html.motion-active .text-link span,html.motion-active .button span,html.motion-active .btn span{transition:transform .25s}
html.motion-active .text-link:hover span,html.motion-active .button:hover span,html.motion-active .btn:hover span{transform:translateX(5px)}
html.motion-disabled .window,html.motion-disabled .orbit,html.motion-disabled .visual-tile,html.motion-disabled .visual-label,html.motion-disabled .code-line,html.motion-disabled .screen-grid i,html.motion-disabled .hero-note .dot{animation:none!important}
html.motion-disabled .motion-card,html.motion-disabled .hero-visual{transform:none!important;translate:none!important;transition:none!important}
@media(hover:none),(pointer:coarse){html.motion-active .motion-card{transform:none!important}.hero-visual{translate:none!important}}
@media(max-width:600px){.miyatech-motion{position:static;display:block;margin:18px auto;width:max-content}.miyatech-progress{height:2px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.hero-visual{translate:none!important}.motion-card{transform:none!important}}

html.motion-disabled *,html.motion-disabled *::before,html.motion-disabled *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}

.hero-motion-paused *, .hero-motion-paused *::before, .hero-motion-paused *::after{animation-play-state:paused!important}
@media(prefers-reduced-motion:no-preference) and (hover:hover) and (pointer:fine){
html.motion-active .window--primary{animation:brand-primary-window 7s ease-in-out infinite}
html.motion-active .window--secondary{animation:brand-secondary-window 8s ease-in-out infinite}
html.motion-active .mock-float-tag{animation:brand-label 5s ease-in-out infinite alternate}
}
@keyframes brand-primary-window{0%,100%{transform:translateY(0) rotate(2deg)}50%{transform:translateY(-14px) rotate(1deg)}}
@keyframes brand-secondary-window{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(11px) rotate(-4deg)}}

/* Depth pass: layered contact shadows, raised surfaces and perspective. */
.mock-stage,.hero-visual{perspective:1400px;transform-style:preserve-3d;isolation:isolate}
.window,.visual-tile{box-shadow:0 3px 0 #29201c18,0 12px 22px -8px #29201c50,0 36px 75px -20px #29201c55,inset 0 1px 0 #ffffff99;backface-visibility:hidden}
.window--secondary,.tile-hardware{box-shadow:0 3px 0 #7f4c3733,0 16px 25px -10px #29201c66,0 42px 85px -25px #29201c66,inset 0 1px 0 #ffffffcc}
.mock-float-tag{box-shadow:0 2px 0 #d2a88d55,0 12px 28px -8px #29201c44,0 30px 55px -20px #29201c33}
.division,.service-card,.needs-grid>a,.contact-form{box-shadow:0 1px 0 #ffffffaa inset,0 3px 0 #7f4c3710,0 12px 24px -12px #29201c22,0 28px 55px -26px #29201c22}
.platform-card{box-shadow:inset 0 1px 0 #ffffff14,0 3px 0 #00000022,0 18px 34px -15px #00000044}
.work-art,.mini-browser,.monitor{box-shadow:0 3px 0 #29201c22,0 16px 25px -10px #29201c44,0 38px 60px -30px #29201c55}
.button,.btn--dark{box-shadow:0 3px 0 #563221,0 10px 18px -9px #29201c66,0 20px 35px -18px #7f4c3766}
.cta-panel{box-shadow:0 4px 0 #56322133,0 24px 45px -20px #29201c55}
.founder-photo{box-shadow:0 3px 0 #7f4c3722,0 22px 45px -20px #29201c55}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 html.motion-active .mock-stage,html.motion-active .hero-visual{translate:var(--pointer-x,0px) var(--pointer-y,0px);transform:perspective(1400px) rotateX(var(--hero-tilt-x,0deg)) rotateY(var(--hero-tilt-y,0deg));transition:transform .45s ease-out,translate .45s ease-out}
 html.motion-active .window--primary,html.motion-active .tile-digital{translate:0 0 30px}
 html.motion-active .window--secondary,html.motion-active .tile-hardware{translate:0 0 80px}
 html.motion-active .mock-float-tag{translate:0 0 110px}
 html.motion-active .motion-card{transform-style:preserve-3d;transform:perspective(1100px) translateY(var(--card-lift,0px)) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .35s ease,box-shadow .35s ease}
 html.motion-active .motion-card:hover{--card-lift:-7px;box-shadow:0 4px 0 #7f4c371c,0 15px 28px -10px #29201c40,0 38px 65px -24px #29201c44}
 html.motion-active .platform-card:hover{box-shadow:0 4px 0 #00000033,0 22px 45px -12px #00000066}
 html.motion-active .motion-card h3,html.motion-active .motion-card .service-icon,html.motion-active .motion-card .text-link{transform:translateZ(18px)}
 html.motion-active .button:hover,html.motion-active .btn--dark:hover{transform:translateY(-4px);box-shadow:0 5px 0 #563221,0 16px 25px -10px #29201c55,0 28px 42px -20px #7f4c3766}
 html.motion-active .button:active,html.motion-active .btn--dark:active{transform:translateY(1px);box-shadow:0 1px 0 #563221,0 5px 12px -7px #29201c55}
}
@media(max-width:600px){.window,.visual-tile{box-shadow:0 2px 0 #29201c18,0 12px 22px -12px #29201c44,0 26px 45px -24px #29201c55}.division,.service-card,.needs-grid>a{box-shadow:0 2px 0 #7f4c3710,0 14px 28px -18px #29201c33}}
html.motion-disabled .window,html.motion-disabled .visual-tile,html.motion-disabled .mock-float-tag{translate:none!important}
@media(prefers-reduced-motion:reduce){.window,.visual-tile,.mock-float-tag{translate:none!important}.motion-card h3,.motion-card .service-icon,.motion-card .text-link{transform:none!important}}
