/* Photo mosaic, illuminated seams and slowly rotating optical geometry. */
.first-view{overflow:hidden}
/* 下端まで不透明にし、次のセクションへ継ぎ目なくつなぐ。 */
.first-view:after{left:-1px;bottom:-1px;width:calc(100% + 2px);opacity:1;background:linear-gradient(180deg,transparent 0%,#101015 92%);background-size:auto}
.first-view:before{inset:-1px;background:linear-gradient(180deg,rgba(6,6,10,.12),rgba(6,6,10,.06) 48%,rgba(6,6,10,.66)),radial-gradient(ellipse at 50% 45%,rgba(6,6,10,.64),rgba(6,6,10,.28) 42%,transparent 76%)}
.first-view>.hero-light{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;contain:paint}
.hero-light:before{content:"";position:absolute;inset:-8%;background:radial-gradient(ellipse at 10% 35%,#8bdcff33,transparent 42%),radial-gradient(ellipse at 90% 45%,#ed9ec533,transparent 42%);opacity:.65}
.hero-light-map{position:absolute;inset:0;width:100%;height:100%;color:#c2e7fa;opacity:.9}
.hero-light-grid{opacity:.09}
.hero-light-trace{fill:rgba(165,222,250,.035);stroke:currentColor;stroke-width:1.7;opacity:.22;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 3px #bde6ff66)}
.hero-light-trace:nth-child(3n){color:#f2abc7}
.hero-light-stream{fill:none;stroke:#cbeeff;stroke-width:1.25;stroke-dasharray:100 1450;stroke-linecap:round;opacity:.55;vector-effect:non-scaling-stroke}
.hero-light-orbit{position:absolute;width:440px;height:440px;left:-100px;top:10%;color:#c0e6fa;opacity:.34}
.hero-light-orbit--right{left:auto;right:-100px;top:22%;width:540px;height:540px;color:#f3bdd4;opacity:.3}
.hero-light-orbit svg{display:block;width:100%;height:100%;overflow:visible}
.first-view .hero-geometry{display:none}
.first-view__copy{text-shadow:0 2px 18px #08080bcc,0 0 50px #08080b88}
.first-view__copy .hero-word-accent{text-shadow:none;filter:drop-shadow(0 2px 5px #08080bd9)}
.refined-hero-label,.refined-hero-lead,.refined-achievement,.hero-quick-link{text-shadow:0 2px 8px #050509,0 0 18px #050509}
@keyframes mosaic-seam-light{0%,100%{opacity:.12;stroke-dashoffset:240}35%,55%{opacity:.85;stroke-dashoffset:0}80%{opacity:.2;stroke-dashoffset:-160}}
@keyframes mosaic-light-flow{from{stroke-dashoffset:1550}to{stroke-dashoffset:0}}
@keyframes optical-turn{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes mosaic-ambient-drift{from{transform:translate(-3%,-2%);opacity:.4}to{transform:translate(3%,2%);opacity:.85}}
@media(prefers-reduced-motion:no-preference){
 .hero-light:before{animation:mosaic-ambient-drift 18s ease-in-out infinite alternate}
 .hero-light-trace{stroke-dasharray:240 60;animation:mosaic-seam-light 14s ease-in-out var(--phase,0s) infinite}
 .hero-light-stream{animation:mosaic-light-flow 20s linear infinite}
 .hero-light-orbit svg{animation:optical-turn 80s linear infinite}
 .hero-light-orbit--right svg{animation-duration:110s;animation-direction:reverse}
 .hero-motion-paused .hero-light *,.hero-motion-paused .hero-light:before{animation-play-state:paused!important}
}
@media(max-width:768px){
 .first-view:before{background:linear-gradient(180deg,rgba(6,6,10,.16),rgba(6,6,10,.22) 52%,rgba(6,6,10,.7)),radial-gradient(ellipse at 50% 44%,rgba(6,6,10,.52),transparent 82%)}
 .hero-light-map{opacity:.65}
 .hero-light-grid{opacity:.07}
 .hero-light-orbit{width:260px;height:260px;left:-175px;top:6%;opacity:.28}
 .hero-light-orbit--right{width:300px;height:300px;left:auto;right:-220px;top:38%}
}
@media(prefers-reduced-motion:reduce){.hero-light-trace{opacity:.2}.hero-light-stream{opacity:.2}}
