/* Approved studio layout; all content rules are scoped to the new UI. */
body.ng-studio .ng-studio-ui .motion-toggle {  display:inline-flex; align-items:center; gap:7px; min-height:24px;  }
body.ng-studio .ng-studio-ui .motion-toggle svg {  width:10px; height:10px; fill:currentColor;  }
body.ng-studio .ng-studio-ui .motion-toggle[hidden] {  display:none;  }
html.ng-studio-document:not(.motion-enabled) {  scroll-behavior:auto;  }
body.ng-studio .ng-studio-ui .reading-progress {  position:fixed; z-index:50; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,var(--green),#65f7d4 75%,var(--pink)); transform:scaleX(0); transform-origin:left; pointer-events:none; box-shadow:0 0 12px #a3ff7160;  }
body.ng-studio .ng-studio-ui .hero {  isolation:isolate;  }
body.ng-studio .ng-studio-ui .cyber-scene {  position:absolute; z-index:-1; inset:0 -30px 0; overflow:hidden; pointer-events:none; contain:paint;  }
body.ng-studio .ng-studio-ui .cyber-scene::before {  content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 78% 45%,#27735c20,transparent 54%);  }
body.ng-studio .ng-studio-ui .cyber-grid {  position:absolute; width:110%; height:520px; right:-20%; bottom:-245px; transform:perspective(540px) rotateX(61deg) rotateZ(-12deg); transform-origin:50% 0; mask-image:linear-gradient(transparent,#000 25%,#000 70%,transparent);  }
body.ng-studio .ng-studio-ui .cyber-grid>div {  position:absolute; inset:-100px 0; background-image:linear-gradient(#83ffc526 1px,transparent 1px),linear-gradient(90deg,#83ffc526 1px,transparent 1px); background-size:60px 60px;  }
body.ng-studio .ng-studio-ui .cyber-orbit {  position:absolute; width:720px; height:620px; right:-35px; top:-26px; opacity:.55;  }
body.ng-studio .ng-studio-ui .cyber-orbit svg {  width:100%; height:100%; overflow:visible;  }
body.ng-studio .ng-studio-ui .cyber-orbit .wire {  fill:none; stroke:#88efbb; stroke-width:.65; opacity:.25;  }
body.ng-studio .ng-studio-ui .cyber-orbit .ring {  fill:none; stroke:#87ffc2; stroke-width:.8; opacity:.3;  }
body.ng-studio .ng-studio-ui .cyber-orbit .signal {  fill:none; stroke:#abff79; stroke-width:1.6; stroke-dasharray:24 1050; stroke-linecap:round; opacity:.8;  }
body.ng-studio .ng-studio-ui .cyber-orbit .signal.pink {  stroke:#ff76a7; stroke-dasharray:16 920;  }
body.ng-studio .ng-studio-ui .cyber-orbit .node {  fill:#a3ff9d; opacity:.65;  }
body.ng-studio .ng-studio-ui .cyber-orbit .orbit-body {  transform-origin:360px 300px;  }
body.ng-studio .ng-studio-ui .cyber-cross {  position:absolute; width:17px; height:17px; border:1px solid #81fdb245;  }
body.ng-studio .ng-studio-ui .cyber-cross::before,
body.ng-studio .ng-studio-ui .cyber-cross::after {  content:''; position:absolute; background:#b7ffcb80;  }
body.ng-studio .ng-studio-ui .cyber-cross::before {  width:25px; height:1px; top:7px; left:-5px;  }
body.ng-studio .ng-studio-ui .cyber-cross::after {  height:25px; width:1px; left:7px; top:-5px;  }
body.ng-studio .ng-studio-ui .cyber-cross.one {  left:50%; top:22%;  }
body.ng-studio .ng-studio-ui .cyber-cross.two {  right:6%; bottom:10%; transform:scale(.6);  }
body.ng-studio .ng-studio-ui .hero-copy,
body.ng-studio .ng-studio-ui .hero-visual {  position:relative;  }
body.ng-studio .ng-studio-ui .hero-visual {  perspective:1100px;  }
body.ng-studio .ng-studio-ui .hero-main {  --rx:0deg; --ry:0deg; --lift:0px; transform:rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--lift)); transition:transform .55s cubic-bezier(.2,.7,.3,1),box-shadow .55s;  }
body.ng-studio .ng-studio-ui .hero-main>img {  transition:filter .55s;  }
body.ng-studio .ng-studio-ui .hero-scan {  position:absolute; z-index:4; inset:0; overflow:hidden; pointer-events:none;  }
body.ng-studio .ng-studio-ui .hero-scan::before {  content:''; position:absolute; left:0; right:0; top:-30%; height:30%; background:linear-gradient(transparent,#c2ffd210 90%,#beffc590); opacity:0;  }
body.ng-studio .ng-studio-ui .hero-scan::after {  content:''; position:absolute; inset:0; border:1px solid #b2ffc329;  }
body.ng-studio .ng-studio-ui .hero-small {  --drift:0px; transform:translateY(var(--drift)) rotate(5deg);  }
body.ng-studio .ng-studio-ui .hero-small:hover {  transform:translateY(var(--drift)) rotate(0);  }
body.ng-studio .ng-studio-ui .hero h1 em {  position:relative; display:inline-block;  }
body.ng-studio .ng-studio-ui .hero h1 em::after {  content:''; position:absolute; left:0; right:0; bottom:.05em; height:1px; background:var(--green); transform:scaleX(0); transform-origin:left; opacity:.6;  }
body.ng-studio .ng-studio-ui .hero-actions .button {  position:relative; overflow:hidden;  }
body.ng-studio .ng-studio-ui .hero-actions .button::before {  content:''; position:absolute; inset:-50% auto -50% -35%; width:18%; background:#fff5; transform:skewX(-20deg); pointer-events:none; opacity:0;  }
body.ng-studio .ng-studio-ui .work-image {  isolation:isolate; transition:box-shadow .3s,transform .35s;  }
body.ng-studio .ng-studio-ui .work-image::after {  content:''; position:absolute; z-index:2; inset:9px; border:1px solid #a3ff7180; clip-path:polygon(0 0,20% 0,20% 1px,1px 1px,1px 20%,0 20%,0 0,100% 0,100% 20%,calc(100% - 1px) 20%,calc(100% - 1px) 1px,80% 1px,80% 0,100% 0,100% 100%,80% 100%,80% calc(100% - 1px),calc(100% - 1px) calc(100% - 1px),calc(100% - 1px) 80%,100% 80%,100% 100%,0 100%,0 80%,1px 80%,1px calc(100% - 1px),20% calc(100% - 1px),20% 100%,0 100%); opacity:0; transform:scale(1.04); transition:opacity .3s,transform .35s; pointer-events:none;  }
body.ng-studio .ng-studio-ui .header nav>a:not(.nav-contact) {  position:relative;  }
body.ng-studio .ng-studio-ui .header nav>a:not(.nav-contact)::after {  content:''; position:absolute; left:0; right:0; bottom:2px; height:2px; background:var(--green); transform:scaleX(0); transform-origin:left; transition:transform .3s;  }
body.ng-studio .ng-studio-ui .header nav>a.is-current::after {  transform:scaleX(1);  }
body.ng-studio .ng-studio-ui .header nav>a.is-current {  color:var(--green);  }
body.ng-studio .ng-studio-ui .section-heading .studio-heading {  position:relative;  }
body.ng-studio .ng-studio-ui .service-list>article {  transition:background .3s;  }
body.ng-studio .ng-studio-ui .section-heading .studio-heading::after {  content:''; display:block; width:48px; height:2px; background:var(--green); margin-top:19px; box-shadow:0 0 12px #a3ff7140; transform-origin:left;  }
body.ng-studio.motion-on .ng-studio-ui .section-heading .studio-heading::after {  animation:studio-line-boot .7s ease-out both;  }
body.ng-studio.motion-on .ng-studio-ui .hero h1 em::after {  animation:studio-word-scan 1.4s .35s ease-out both;  }
body.ng-studio.motion-on .ng-studio-ui .hero-copy {  animation:studio-boot-copy .85s cubic-bezier(.2,.7,.3,1) both;  }
body.ng-studio.motion-on .ng-studio-ui .hero-visual {  animation:studio-boot-visual 1.1s cubic-bezier(.2,.7,.3,1) both;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .cyber-grid>div {  animation:studio-grid-flow 12s linear infinite;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .cyber-orbit .orbit-body {  animation:studio-orbit-turn 72s linear infinite;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .cyber-orbit .signal {  animation:studio-signal-flow 11s linear infinite;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .cyber-orbit .signal.pink {  animation-duration:14s; animation-direction:reverse;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .hero-scan::before {  animation:studio-hero-scan 8s 1s ease-in-out infinite;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .hero-small {  animation:studio-card-float 6s ease-in-out infinite;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .hero-small:hover {  animation-play-state:paused; box-shadow:0 18px 45px #0007,0 0 0 1px #a3ff7140;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .floating-mark {  animation:studio-mark-turn 28s linear infinite;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .cyber-cross.one {  animation:studio-cross-float 9s ease-in-out infinite;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .hero-actions .button::before {  animation:studio-button-light 9s 3s ease-in-out infinite;  }
body.ng-studio.motion-on .ng-studio-ui .button span,
body.ng-studio.motion-on .ng-studio-ui .text-link span,
body.ng-studio.motion-on .ng-studio-ui .round-arrow {  transition:transform .25s;  }
body.ng-studio.motion-on .ng-studio-ui .button:hover span,
body.ng-studio.motion-on .ng-studio-ui .text-link:hover span {  transform:translate(3px,-3px);  }
body.ng-studio.motion-on .ng-studio-ui .work-image:hover .round-arrow {  transform:rotate(-12deg);  }
body.ng-studio.motion-on .ng-studio-ui .button:active {  transform:translateY(1px) scale(.985);  }
body.ng-studio.motion-on .ng-studio-ui .work-image:active {  transform:scale(.985);  }
body.ng-studio.motion-on .ng-studio-ui .industry [role=tabpanel] {  transition:opacity .2s;  }
body.ng-studio.motion-paused .ng-studio-ui *,
body.ng-studio.motion-paused .ng-studio-ui *::before,
body.ng-studio.motion-paused .ng-studio-ui *::after {  animation-play-state:paused!important;  }
body.ng-studio:not(.motion-on) .ng-studio-ui .hero-main {  transform:none;  }
body.ng-studio:not(.motion-on) .ng-studio-ui .hero-small {  animation:none;  }
body.ng-studio:not(.motion-on) .ng-studio-ui *,
body.ng-studio:not(.motion-on) .ng-studio-ui *::before,
body.ng-studio:not(.motion-on) .ng-studio-ui *::after {  scroll-behavior:auto; transition:none!important; animation:none!important;  }
@media(hover:hover) and (pointer:fine) {
body.ng-studio.motion-on .ng-studio-ui .hero-visual:hover .hero-main {  box-shadow:0 18px 65px #0006,0 0 36px #79ffc718;  }
body.ng-studio.motion-on .ng-studio-ui .hero-visual:hover .hero-main>img {  filter:saturate(1.08);  }
body.ng-studio.motion-on .ng-studio-ui .work-image:hover {  box-shadow:0 0 0 1px #a3ff7180,0 15px 35px #0004; transform:translateY(-4px);  }
body.ng-studio.motion-on .ng-studio-ui .work-image:hover::after,
body.ng-studio.motion-on .ng-studio-ui .work-image:focus-visible::after {  opacity:1; transform:scale(1);  }
body.ng-studio.motion-on .ng-studio-ui .service-list>article:hover {  background:#9bff7105;  }
}
@keyframes studio-boot-copy {  from { transform:translateY(18px); } to { transform:translateY(0); }  }
@keyframes studio-boot-visual {  from { transform:translateY(26px) scale(.965); } to { transform:translateY(0) scale(1); }  }
@keyframes studio-grid-flow {  to { transform:translateY(60px); }  }
@keyframes studio-orbit-turn {  to { transform:rotate(360deg); }  }
@keyframes studio-signal-flow {  to { stroke-dashoffset:-1074; }  }
@keyframes studio-hero-scan {  0%,12% { opacity:0; transform:translateY(0); } 16% { opacity:.75; } 42% { opacity:0; transform:translateY(440%); } 100% { opacity:0; transform:translateY(440%); }  }
@keyframes studio-card-float {  0%,100% { transform:translateY(0) rotate(5deg); } 50% { transform:translateY(-12px) rotate(3deg); }  }
@keyframes studio-mark-turn {  from { transform:rotate(-14deg); } to { transform:rotate(346deg); }  }
@keyframes studio-cross-float {  0%,100% { transform:translateY(0); } 50% { transform:translateY(-16px); }  }
@keyframes studio-button-light {  0%,65% { opacity:0; transform:translateX(0) skewX(-20deg); } 68% { opacity:.5; } 82%,100% { opacity:0; transform:translateX(950%) skewX(-20deg); }  }
@keyframes studio-word-scan {  0% { transform:scaleX(0); } 55% { transform:scaleX(1); opacity:.7; } 100% { transform:scaleX(1); opacity:0; }  }
@keyframes studio-line-boot {  from { transform:scaleX(0); } to { transform:scaleX(1); }  }
@keyframes studio-dialog-boot {  from { opacity:.5; transform:translateY(12px) scale(.98); } to { opacity:1; transform:none; }  }
@media(max-width:800px) {
body.ng-studio .ng-studio-ui .cyber-scene {  inset:0;  }
body.ng-studio .ng-studio-ui .cyber-orbit {  top:auto; bottom:80px; right:-75px; width:650px; height:580px;  }
body.ng-studio .ng-studio-ui .cyber-grid {  bottom:-240px; right:-25%; width:150%; opacity:.65;  }
body.ng-studio .ng-studio-ui .cyber-cross.one {  top:55%; left:15%;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .cyber-grid>div,
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .cyber-orbit .orbit-body,
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .cyber-orbit .signal,
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .floating-mark,
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .cyber-cross.one {  animation:none;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .hero-scan::before {  animation-iteration-count:1; animation-duration:5s;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .hero-small {  animation-duration:8s;  }
body.ng-studio.motion-on.hero-in-view .ng-studio-ui .hero-actions .button::before {  animation-iteration-count:1;  }
body.ng-studio .ng-studio-ui .section-heading .studio-heading::after {  margin-top:14px; width:35px;  }
}
@media(max-width:390px) {
}
/* SPでは旧テンプレートの出現効果も止める。回転・画面幅変更の途中でも本文を隠さない。 */
@media(max-width:800px), (hover:none), (pointer:coarse) {
body.ng-studio .rv { opacity:1!important; transform:none!important; transition:none!important; }
}
@media(prefers-reduced-motion:reduce) {
html.ng-studio-document {  scroll-behavior:auto;  }
body.ng-studio.motion-on .ng-studio-ui *,
body.ng-studio.motion-on .ng-studio-ui *::before,
body.ng-studio.motion-on .ng-studio-ui *::after {  animation:none!important; transition:none!important;  }
}