
:root{--bg:#fffdf9;--bg2:#ffffff;--bg-bottom:#ffffff;--text:#111;--accent:#FAA11B;--accent-soft:#f9e2cf;--grad-x:78%;--grad-y:28%;--glow-opacity:.28;--noise-opacity:.19}
*{box-sizing:border-box}body{margin:0;font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;color:var(--text);background:var(--bg)}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
.mv{position:relative;min-height:min(100svh,980px);overflow:hidden;background:linear-gradient(180deg,#ffffff 0%,#fffdf9 38%,#fffaf3 68%,var(--bg-bottom) 100%)}
.mv-bg{position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,#ffffff 0%,#fffefa 34%,#fffaf4 66%,var(--bg-bottom) 100%);isolation:isolate}
.mv-bg::before,.mv-bg::after{content:"";position:absolute;inset:-8%;pointer-events:none}
.mv-bg::before{
  background:
    radial-gradient(116vw 76vw at var(--grad-x) var(--grad-y),rgba(250,161,27,var(--glow-opacity)) 0%,rgba(250,161,27,.075) 46%,rgba(250,161,27,.022) 69%,rgba(250,161,27,0) 92%),
    radial-gradient(76vw 46vw at calc(var(--grad-x) - 12%) calc(var(--grad-y) + 6%),rgba(252,206,128,.15) 0%,rgba(252,206,128,.07) 54%,rgba(252,206,128,0) 88%);
  filter:blur(46px) saturate(98%);
  opacity:.74;
}
.mv-bg::after{
  opacity:var(--noise-opacity);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.9'/%3E%3C/svg%3E");
  background-size:180px 180px;
  mix-blend-mode:multiply;
  filter:sepia(1) saturate(2.15) hue-rotate(-12deg) brightness(1.06) contrast(1.08);
}

.mv-bg .bg-bottom-fade{display:none}
.mv-bg::marker{content:none}
.mv-bg::selection{background:transparent}
.mv::after{content:"";position:absolute;left:0;right:0;bottom:0;height:28%;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 48%,rgba(255,255,255,.92) 100%);}
.site-header,.mv-copy,.mv-rule,.clouds,.city-stage,.scroll-sign{position:relative;z-index:2}
.site-header{position:absolute;inset:36px 40px auto 42px;display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.brand{width:88px;flex:0 0 88px}.brand img{width:100%;height:auto}
.global-nav{display:flex;flex-direction:column;align-items:flex-end;gap:12px;font-size:13px;line-height:1.25;text-align:right}
.global-nav .contact{width:150px;min-width:150px;height:36px;padding:0 20px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#F9E2CF;margin-bottom:20px;transition:background-color .35s ease,color .35s ease,transform .35s ease}.global-nav .contact:hover{background:#FAA11B;color:#fff;transform:translateY(-1px)}
.global-nav a:not(.contact){min-width:86px}.global-nav a:not(.contact):hover{color:var(--accent)}
.mv-copy{position:absolute;left:9vw;top:29.3vh;width:min(54vw,720px);z-index:4}
.mv-copy h1{margin:0;white-space:nowrap;font-size:clamp(30px,3.05vw,40px);line-height:1.18;font-weight:700;letter-spacing:.01em}
.mv-copy .line{display:inline;opacity:0;transform:translateY(12px);animation:fadeUp .9s cubic-bezier(.2,.8,.2,1) forwards}
.mv-copy .line--2{animation-delay:.12s}
.mv-copy p{margin:20px 0 0;font-size:clamp(12px,1.05vw,14px);line-height:1.7;opacity:0;transform:translateY(12px);animation:fadeUp .9s cubic-bezier(.2,.8,.2,1) .26s forwards}
@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}
.mv-rule{display:none}
.clouds{position:absolute;inset:0;z-index:1;pointer-events:none}.cloud{position:absolute;opacity:.96;filter:drop-shadow(0 6px 10px rgba(236,206,175,.22));will-change:transform}
.cloud--1{width:clamp(260px,21vw,360px);left:23%;top:16%;animation:cloud1 20s ease-in-out infinite alternate}.cloud--2{width:clamp(280px,23vw,390px);left:73%;top:14%;animation:cloud2 24s ease-in-out infinite alternate}.cloud--3{width:clamp(185px,15vw,255px);left:51%;top:27%;animation:cloud3 18s ease-in-out infinite alternate}.cloud--4{width:clamp(170px,14vw,230px);left:34%;top:38%;opacity:.84;animation:cloud4 21s ease-in-out infinite alternate}.cloud--5{width:clamp(175px,14.5vw,240px);left:79%;top:40%;opacity:.86;animation:cloud5 23s ease-in-out infinite alternate}
@keyframes cloud1{from{transform:translateX(-48px)}to{transform:translateX(118px)}}@keyframes cloud2{from{transform:translateX(44px)}to{transform:translateX(-122px)}}@keyframes cloud3{from{transform:translateX(-46px)}to{transform:translateX(78px)}}@keyframes cloud4{from{transform:translateX(-34px)}to{transform:translateX(62px)}}@keyframes cloud5{from{transform:translateX(34px)}to{transform:translateX(-70px)}}
.city-stage{position:absolute;left:0;right:0;bottom:0;width:100%;aspect-ratio:1672/941;max-height:min(74vh,650px);z-index:2}.city-image{position:absolute;left:0;bottom:0;width:100%;height:auto;pointer-events:none;user-select:none}
.bird{position:absolute;width:2.6%;min-width:24px;max-width:38px;opacity:.96;will-change:transform}.bird--1{left:86.6%;top:21.6%;animation:birdMove1 17s ease-in-out infinite}.bird--2{left:90.1%;top:19.8%;animation:birdMove2 14s ease-in-out infinite}@keyframes birdMove1{0%{transform:translate(0,0) rotate(-3deg)}50%{transform:translate(34px,-10px) rotate(2deg)}100%{transform:translate(8px,4px) rotate(-2deg)}}@keyframes birdMove2{0%{transform:translate(0,0) rotate(2deg)}50%{transform:translate(-22px,12px) rotate(-3deg)}100%{transform:translate(18px,-6px) rotate(1deg)}}
.walker{position:absolute;z-index:5;pointer-events:none;will-change:transform,opacity}.walker__sprite{width:100%;height:100%;background-repeat:no-repeat;background-size:400% 100%;animation:spriteFrames .88s linear infinite,personBob .44s ease-in-out infinite alternate}.walker__sprite--left{background-image:url('../assets/walker-left-suit.png')}.walker__sprite--center{background-image:url('../assets/walker-center.png')}.walker__sprite--right{background-image:url('../assets/walker-right.png')}
@keyframes spriteFrames{0%,24.99%{background-position-x:0%}25%,49.99%{background-position-x:33.333%}50%,74.99%{background-position-x:66.667%}75%,100%{background-position-x:100%}}
@keyframes personBob{from{transform:translateY(0)}to{transform:translateY(-1.5px)}}
.walker--left{left:15.22%;bottom:8.0%;width:3.89%;aspect-ratio:383/582;animation:walkLeft 18s linear infinite}
.walker--center{left:44.25%;bottom:14.35%;width:2.09%;aspect-ratio:311/453;animation:walkCenter 15s linear -4s infinite}
.walker--right{left:78.60%;bottom:6.15%;width:4.88%;aspect-ratio:459/647;animation:walkRight 22s linear -8s infinite}
@keyframes walkLeft{0%{transform:translateX(0);opacity:0}4%{opacity:1}88%{opacity:1}96%,100%{transform:translateX(10.5vw);opacity:0}}
@keyframes walkCenter{0%{transform:translateX(0);opacity:0}5%{opacity:.94}88%{opacity:.94}96%,100%{transform:translateX(6vw);opacity:0}}
@keyframes walkRight{0%{transform:translateX(0);opacity:0}4%{opacity:1}88%{opacity:1}96%,100%{transform:translateX(-20vw);opacity:0}}
.scroll-sign{position:absolute;left:26px;bottom:100px;display:inline-flex;flex-direction:column;align-items:center;gap:16px;z-index:6}.scroll-sign span{writing-mode:vertical-rl;text-orientation:mixed;font-size:12px;letter-spacing:.2em}.scroll-sign i{position:relative;width:1px;height:82px;background:rgba(17,17,17,.24);overflow:hidden}.scroll-sign i::after{content:"";position:absolute;left:0;top:-30%;width:100%;height:30%;background:rgba(17,17,17,.9);animation:scrollLine 2s ease-in-out infinite}@keyframes scrollLine{from{top:-30%}to{top:100%}}
.section{min-height:45vh;display:grid;place-items:center;padding:90px 24px;background:#fff}.section--alt{background:#f5f1ea}.section-inner{width:min(1080px,100%)}.eyebrow{margin:0 0 10px;color:var(--accent);letter-spacing:.12em;font-size:14px}.section h2{margin:0;font-size:clamp(28px,3.6vw,46px)}
@media(max-width:900px){
.mv{min-height:830px}.site-header{inset:20px 18px auto 18px}.brand{width:82px;flex-basis:82px}.global-nav{gap:9px;font-size:12px}.global-nav .contact{width:126px;min-width:126px;height:34px;margin-bottom:12px}
.mv-copy{left:24px;right:24px;width:auto;top:146px}.mv-copy h1{white-space:normal;font-size:clamp(30px,6vw,44px)}.mv-copy .line{display:block}.mv-copy p{margin-top:18px;font-size:13px;max-width:90%}.mv-rule{display:none}
.city-stage{width:128%;margin-left:-14%;max-height:none}.cloud--1{left:8%;top:16%}.cloud--2{left:68%;top:14%}.cloud--3{left:41%;top:27%}.cloud--4{left:28%;top:38%}.cloud--5{left:73%;top:40%}.scroll-sign{left:14px;bottom:58px}}
@media(max-width:560px){.mv{min-height:720px}.global-nav{gap:8px;font-size:11px}.global-nav .contact{min-width:110px;height:34px;padding:0 18px}.mv-copy{top:138px}.mv-copy h1{font-size:clamp(30px,9vw,42px);white-space:normal}.mv-rule{display:none}.city-stage{width:168%;margin-left:-34%;bottom:-2%}.cloud--1{width:220px}.cloud--2{width:235px}.cloud--3{width:150px}.cloud--4{width:140px}.cloud--5{width:145px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.mv-copy .line,.mv-copy p,.cloud,.bird,.walker,.walker__sprite,.scroll-sign i::after{animation:none!important}.walker{opacity:1}.walker--left{transform:none}.walker--center{transform:none}.walker--right{transform:none}}
