:root{--navy:#1c2840;--blue:#3767a8;--accent:#2e75b6;--gray:#4a5568;--line:#dce3ec;--paper:#f7f9fc;--rail:132px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--navy);font-family:"Noto Sans SC","Microsoft YaHei",sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}button{font:inherit}img,video{display:block;max-width:100%}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.side-rail{position:fixed;inset:0 auto 0 0;width:var(--rail);z-index:20;background:var(--paper);border-right:1px solid var(--line);display:flex;align-items:center;flex-direction:column}
.rail-logo{padding:30px 8px 10px;width:124px}.rail-logo img{width:100%;height:auto;filter:contrast(1.08)}
.rail-bottom{margin-top:auto;padding-bottom:24px;display:flex;align-items:center;gap:12px;flex-direction:column;font:12px "Inter",sans-serif}
.rail-bottom small{writing-mode:vertical-rl;font-size:9px;letter-spacing:.1em;margin-top:8px}.mobile-header{display:none}
.menu-button{position:fixed;z-index:40;top:26px;right:28px;width:64px;height:64px;border:0;border-radius:50%;background:var(--navy);cursor:pointer}
.menu-button span:not(.sr-only){display:block;width:25px;height:1px;background:var(--paper);margin:7px auto;transition:transform .35s}
.menu-button[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}.menu-button[aria-expanded=true] span:nth-child(2){transform:translateY(-4px) rotate(-45deg)}
.site-menu{position:fixed;z-index:30;inset:0 0 0 var(--rail);background:var(--paper);padding:9vw 9vw 6vw;transform:translateY(-105%);transition:transform .6s cubic-bezier(.16,1,.3,1)}
.site-menu.open{transform:none}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
.menu-grid a{background:var(--paper);padding:32px;display:flex;flex-direction:column;gap:8px}.menu-grid strong{font:900 42px/1 "Inter",sans-serif;letter-spacing:-.06em}.menu-grid span{font-size:13px}
.menu-contact{margin-top:40px;display:flex;gap:24px;align-items:end}.menu-contact a{font:700 34px "Inter",sans-serif}.menu-contact span{font-size:12px}
main,footer{margin-left:var(--rail)}
.hero{height:1020px;position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:var(--navy)}
.hero::after{content:"";position:absolute;z-index:1;inset:0 0 auto;height:760px;background:linear-gradient(90deg,rgba(7,13,24,.82) 0%,rgba(12,22,39,.58) 48%,rgba(5,10,18,.72) 100%);pointer-events:none}
.hero-bg{position:absolute;inset:0;width:100%;height:760px;object-fit:cover;filter:saturate(.8) contrast(1.08)}
.hero-statement{position:absolute;z-index:2;top:55px;left:4vw;margin:0;color:var(--paper);font:900 clamp(80px,10.6vw,166px)/.78 "Inter",sans-serif;letter-spacing:-.075em}
.hero-orbit{position:absolute;z-index:2;top:185px;right:4%;width:43vw;height:31vw;border:1px solid rgba(143,185,240,.7);border-radius:50%;transform:rotate(-28deg)}
.hero-card{position:absolute;z-index:4;right:5vw;bottom:290px;width:min(650px,55vw);min-height:210px;background:rgba(20,33,57,.92);color:var(--paper);display:grid;grid-template-columns:95px 1fr;box-shadow:0 24px 60px rgba(0,0,0,.28)}
.hero-card-index{padding:28px 18px;font:800 26px "Inter";color:#8fb9f0;border-right:1px solid rgba(143,185,240,.3)}
.hero-card-copy{padding:27px 34px;display:grid;grid-template-columns:.9fr 1.1fr;gap:36px;align-items:end}
.hero-card h1{font:900 clamp(32px,3vw,46px)/.88 "Inter";letter-spacing:-.06em;margin:0;white-space:nowrap}
.hero-card p{font-size:12px;line-height:1.9;margin:0}.hero-card b{font-size:15px}
.hero-controls{position:absolute;z-index:5;right:5vw;bottom:220px;display:flex;align-items:center;gap:18px;color:var(--paper);font-family:"Inter"}
.hero-controls button{width:48px;height:48px;border:1px solid rgba(247,249,252,.7);color:var(--paper);border-radius:50%;background:rgba(20,33,57,.55);cursor:pointer}.arrow-controls button{width:54px;height:54px;border:1px solid var(--navy);border-radius:50%;background:transparent;cursor:pointer}
.hero-news{position:absolute;z-index:5;left:4vw;right:4vw;bottom:50px;color:var(--paper);border-top:1px solid rgba(247,249,252,.28)}
.hero-news a,.news-list a{display:grid;grid-template-columns:120px 90px 1fr 40px;gap:20px;align-items:center;min-height:66px;border-bottom:1px solid var(--line);font-size:12px}
.hero-news a{border-color:rgba(247,249,252,.28)}.hero-news span{border:1px solid rgba(247,249,252,.7)}.news-list span{border:1px solid var(--navy)}
.hero-news p,.news-list p{margin:0}.hero-news i,.news-list i{font-style:normal;font-size:20px}
.hero-jp{position:absolute;z-index:2;left:7vw;top:535px;color:var(--paper);font-size:clamp(27px,2.8vw,45px);font-weight:900;line-height:1.45;letter-spacing:.03em}
.values{padding:130px 4vw 160px;overflow:hidden}.values-stage{position:relative;max-width:1120px;margin:auto;min-height:740px}
.values-word{position:absolute;top:-60px;left:-2vw;margin:0;color:var(--blue);font:900 clamp(90px,13vw,195px)/1 "Inter";letter-spacing:-.075em;z-index:0}
.values-stage>img{position:absolute;z-index:1;left:13%;top:80px;width:65%;aspect-ratio:16/10;object-fit:cover;background:#101b31}
.values-stage>img.technical-drawing{object-fit:contain;background:#eef3f8;padding:0}
.design-evidence{position:absolute;z-index:3;left:5%;top:500px;display:grid;width:34%;background:rgba(247,249,252,.96);border:1px solid var(--line);box-shadow:0 20px 55px rgba(28,40,64,.12)}
.design-evidence[hidden]{display:none}.design-evidence button{display:grid;grid-template-columns:42px 1fr;align-items:center;text-align:left;min-height:56px;padding:0 18px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--gray);cursor:pointer}
.design-evidence button:last-child{border-bottom:0}.design-evidence button span{font:700 11px "Inter";color:#8494a9}.design-evidence button.active{background:var(--navy);color:var(--paper)}.design-evidence button.active span{color:#8fb9f0}
.values-copy{position:absolute;z-index:2;right:0;bottom:0;width:42%;background:var(--paper);padding:50px 50px 20px}
.values-copy h2{font-size:clamp(25px,3vw,40px);line-height:1.55;margin:22px 0}.values-copy>p:last-of-type{font-size:13px;line-height:2}
.eyebrow{font-family:"Inter";letter-spacing:.1em}.arrow-controls{display:flex;gap:10px;margin-top:28px}
.history{padding:140px 6vw 0;background:#eef3f8}
.history-heading{max-width:1120px;margin:0 auto 75px;display:grid;grid-template-columns:.55fr 1.45fr;gap:50px;align-items:start}
.history-heading>p,.advantages-intro>p,.record-heading>p{font:700 12px "Inter";letter-spacing:.18em;color:var(--blue);margin:10px 0}
.history-heading h2{font-size:clamp(34px,4.2vw,66px);line-height:1.35;margin:0;letter-spacing:-.04em}
.history-heading h2 span{font:900 clamp(82px,11vw,150px)/.7 "Inter";color:var(--blue);vertical-align:-.12em;margin-right:18px}
.history-experience{position:relative;height:min(760px,calc(100vh - 40px));min-height:620px;margin:0 -6vw;background:#101b31;color:var(--paper);overflow:hidden}
.history-phases{position:absolute;z-index:7;left:42px;right:42px;top:34px;height:126px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(207,225,244,.42)}
.history-phases button{position:relative;display:grid;text-align:left;gap:6px;padding:20px 18px 12px;border:0;background:transparent;color:rgba(226,236,247,.58);cursor:pointer;transition:color .35s}
.history-phases button::before{content:"";position:absolute;left:18px;top:-4px;width:7px;height:7px;border-radius:50%;background:#8090a6;box-shadow:0 0 0 5px rgba(16,27,49,.72);transition:background .3s,transform .3s}
.history-phases button:hover,.history-phases button.active{color:var(--paper)}.history-phases button.active::before{background:#b9dcff;transform:scale(1.5)}
.history-phases time{font:700 11px "Inter";letter-spacing:.08em;color:#a9ccf5}.history-phases strong{font-size:17px}.history-phases span{font-size:10px;opacity:.66}
.history-case{position:absolute;inset:0;overflow:hidden;background:#101b31}.history-case figure{position:absolute;inset:0;margin:0;overflow:hidden}.history-case figure::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,17,33,.74) 0%,rgba(7,17,33,.02) 32%,rgba(7,17,33,.18) 55%,rgba(7,17,33,.96) 100%)}
.history-case figure>img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.06);animation:history-drift 8s linear both;transition:opacity .28s}.history-case figure>img.changing{opacity:0}
@keyframes history-drift{from{transform:scale(1.04) translate3d(0,0,0)}to{transform:scale(1.13) translate3d(-1.2%,.7%,0)}}
.history-case figcaption{position:absolute;z-index:2;left:6vw;right:25vw;bottom:94px;display:flex;align-items:baseline;gap:28px;padding:0;background:none}
.history-case figcaption span{font:800 clamp(42px,5vw,72px)/1 "Inter";color:#8fb9f0;letter-spacing:-.06em}.history-case figcaption strong{font-size:clamp(25px,3vw,44px);line-height:1.25}
.history-case>p{position:absolute;z-index:3;left:6.2vw;bottom:43px;max-width:65ch;margin:0;color:#d2dbe8;font-size:12px;line-height:1.8}
.history-case figcaption,.history-case>#history-case-copy{transition:opacity .22s ease,transform .45s cubic-bezier(.16,1,.3,1)}
.history-case.text-changing figcaption,.history-case.text-changing>#history-case-copy{opacity:0;transform:translateY(24px)}
.history-case-progress{position:absolute;z-index:4;right:5vw;bottom:54px;display:grid;grid-template-columns:auto auto;align-items:end;gap:8px;color:#d8e6f5}.history-case-progress b{font:800 38px/1 "Inter"}.history-case-progress span{font:700 11px "Inter";padding-bottom:4px;color:#8fa4bd}.history-case-progress i{grid-column:1/-1;display:block;width:150px;height:2px;background:linear-gradient(90deg,#9bc8fa var(--history-progress,8.33%),rgba(185,210,239,.28) 0)}
.history-scroll-cue{position:absolute!important;z-index:4!important;left:auto!important;right:5vw!important;bottom:112px!important;font:700 9px "Inter"!important;letter-spacing:.16em;color:#b9cce2!important}.history-scroll-cue span{display:inline-block;margin-left:10px;color:#8fb9f0;animation:history-cue 1.6s ease-in-out infinite}
@keyframes history-cue{50%{opacity:.28}}
.pile-3d{height:500vh;background:var(--navy);color:var(--paper);position:relative}
.pile-3d-sticky{height:100vh;position:sticky;top:0;overflow:hidden;background:radial-gradient(circle at 50% 43%,#345680 0%,#1d3150 30%,#101b31 69%)}
#pile-canvas{position:absolute;z-index:2;inset:0;width:100%;height:100%}
.pile-stage-word{position:absolute;z-index:1;inset:0;display:grid;place-items:center;overflow:hidden;pointer-events:none}
.pile-stage-word span{font:900 clamp(110px,18vw,290px)/.75 "Inter",sans-serif;letter-spacing:-.085em;color:transparent;-webkit-text-stroke:1px rgba(184,213,247,.3);white-space:nowrap;transition:opacity .35s}
.pile-stage-kicker{position:absolute;z-index:4;left:4vw;top:35px;font:700 10px "Inter";letter-spacing:.2em;color:#a9ccf5}
.pile-stage-panel{position:absolute;z-index:4;left:6vw;top:50%;width:min(350px,29vw);opacity:0;transform:translateY(calc(-50% + 28px));transition:opacity .5s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);pointer-events:none}
.pile-stage-panel-right{left:auto;right:5vw;text-align:right}.pile-stage-panel.active{opacity:1;transform:translateY(-50%)}
.pile-stage-panel span{font:700 11px "Inter";letter-spacing:.18em;color:#8fb9f0}.pile-stage-panel h2{font-size:clamp(32px,3.5vw,58px);line-height:1.25;letter-spacing:-.045em;margin:22px 0}
.pile-stage-panel p{font-size:13px;line-height:1.95;color:#c8d5e5;max-width:34ch}.pile-stage-panel-right p{margin-left:auto}
.pile-stage-progress{position:absolute;z-index:4;left:4vw;right:4vw;bottom:30px;height:1px;background:rgba(169,204,245,.24)}
.pile-stage-progress i{display:block;width:0;height:100%;background:#a9ccf5;transition:width .08s linear}
.pile-scroll-cue{position:absolute;z-index:2;right:4vw;bottom:35px;font:700 10px "Inter";letter-spacing:.2em;color:#8fb9f0}
.business{background:var(--navy);color:var(--paper);padding:140px 5vw 170px}
.section-intro{max-width:1070px;margin:0 auto 70px;display:grid;grid-template-columns:1.1fr .9fr;align-items:end}
.section-intro h2{font:900 clamp(72px,9vw,138px)/.78 "Inter";margin:0;letter-spacing:-.075em}.section-intro p{max-width:440px;line-height:2;font-size:13px}
.business-showcase{max-width:1170px;margin:auto;display:grid;grid-template-columns:220px 1fr 1fr;min-height:620px;border-top:1px solid #55627a;border-bottom:1px solid #55627a}
.business-nav{display:flex;flex-direction:column;border-right:1px solid #55627a}.business-nav button{flex:1;background:none;color:#9ba8bb;border:0;border-bottom:1px solid #55627a;text-align:left;cursor:pointer;padding:20px;font-weight:700}
.business-nav button:last-child{border-bottom:0}.business-nav button span{display:block;font:700 22px "Inter";margin-bottom:10px}.business-nav button.active{color:var(--paper);background:var(--blue)}
.business-copy{padding:45px 7%;display:flex;flex-direction:column}.giant-number{font:800 68px "Inter";color:#8fb9f0;margin:0}
.business-copy h3{font-size:36px;margin:50px 0 16px}.business-copy>p:not(.giant-number){font-size:13px;line-height:2}.business-copy a{margin-top:auto;border-bottom:1px solid #66758f;padding-bottom:15px;display:flex;justify-content:space-between}
.business-media{position:relative;min-width:0;height:100%;overflow:hidden;background:#101b31}.business-media>img,.business-media>video{width:100%;height:100%;object-fit:cover}.business-media>img{transition:opacity .4s}.business-media>img.technical-drawing{object-fit:contain;background:#f4f8fc;padding:35px}.business-media>video{position:absolute;inset:0;opacity:0;pointer-events:none;filter:saturate(.72) contrast(1.12) brightness(.78);transition:opacity .5s cubic-bezier(.16,1,.3,1)}.business-media.video-active>img{opacity:0}.business-media.video-active>video{opacity:1}.business-media.video-active::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,rgba(8,17,31,.42),rgba(12,28,50,.08) 58%,rgba(8,17,31,.3));pointer-events:none}.business-video-label{position:absolute;z-index:2;right:22px;bottom:20px;padding:9px 12px;background:rgba(16,27,49,.78);color:#dceaf8;font:700 9px "Inter";letter-spacing:.16em;opacity:0;transform:translateY(8px);transition:opacity .35s,transform .45s cubic-bezier(.16,1,.3,1)}.business-media.video-active .business-video-label{opacity:1;transform:none}
.advantages{background:var(--paper);display:grid;grid-template-columns:48% 52%;min-height:850px}
.advantages-intro{position:relative;background:var(--blue);color:var(--paper);padding:110px 8% 0;overflow:hidden}
.advantages-intro>p{color:#c9ddf5}.advantages-intro h2{position:relative;z-index:2;font-size:clamp(36px,4.2vw,62px);line-height:1.45;margin:24px 0 60px}
.advantages-video{position:relative;width:112%;max-width:none;height:430px;margin-left:-12%;margin-top:auto;overflow:hidden;background:#101b31}.advantages-video video{width:100%;height:100%;object-fit:cover;filter:saturate(.7) contrast(1.14) brightness(.78)}.advantages-video::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,17,31,.08),rgba(8,17,31,.48));pointer-events:none}.advantages-video span{position:absolute;z-index:2;left:24px;bottom:22px;color:#dceaf8;font:700 9px "Inter";letter-spacing:.17em}
.advantage-list{padding:75px 7%}
.advantage-list article{display:grid;grid-template-columns:70px 1fr;gap:25px;padding:30px 0;border-bottom:1px solid var(--line)}
.advantage-list article:first-child{border-top:1px solid var(--line)}.advantage-list span{font:700 22px "Inter";color:var(--blue)}
.advantage-list h3{font-size:25px;margin:0 0 12px}.advantage-list p{font-size:13px;line-height:1.9;color:var(--gray);margin:0;max-width:52ch}
.works{height:470px;background:var(--blue);color:var(--paper);position:relative;overflow:hidden;display:grid;place-items:center}
.outline-text{position:absolute;white-space:nowrap;font:900 180px "Inter";letter-spacing:-.07em;color:transparent;-webkit-text-stroke:1px rgba(247,249,252,.4);animation:marquee 18s linear infinite}
.works>a{position:relative;width:min(860px,84%);display:flex;align-items:end;border-bottom:1px solid var(--paper);padding-bottom:25px}.works strong{font:900 98px/.8 "Inter";letter-spacing:-.07em}.works span{margin-left:auto}.works i{font-size:28px;margin-left:30px;font-style:normal}
.track-record{padding:0 0 150px;background:var(--navy);color:var(--paper)}
.record-metrics{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #526079}
.record-metrics div{min-height:164px;padding:30px clamp(22px,2.5vw,38px);display:flex;flex-direction:column;justify-content:center;border-right:1px solid #526079}.record-metrics div:last-child{border-right:0}
.record-metrics b{font:900 clamp(42px,4.8vw,68px)/1 "Inter";letter-spacing:-.065em;color:#8fb9f0;transform-origin:left bottom}.record-metrics b.counting{animation:metric-rise .65s cubic-bezier(.16,1,.3,1)}.record-metrics span{font-size:12px;margin-top:13px}
@keyframes metric-rise{0%{opacity:.2;transform:translateY(18px) scale(.94);filter:blur(5px)}100%{opacity:1;transform:none;filter:none}}
.record-heading{max-width:1120px;margin:0 auto;padding:120px 0 70px;display:grid;grid-template-columns:.55fr 1.45fr;gap:50px}
.record-heading>p{color:#8fb9f0}.record-heading h2{font-size:clamp(32px,4vw,58px);line-height:1.45;margin:0}
.project-reel-wrap{max-width:1280px;margin:auto;padding-left:5vw;overflow:hidden}
.project-reel-top{display:flex;align-items:center;justify-content:space-between;padding:0 5vw 22px 0}.project-reel-top>p{font:700 10px "Inter";letter-spacing:.2em;color:#8fb9f0}
.project-reel-controls{display:flex;align-items:center;gap:14px}.project-reel-controls button{width:48px;height:48px;border:1px solid #71819b;border-radius:50%;background:transparent;color:var(--paper);cursor:pointer}.project-reel-controls span{font:700 12px "Inter";letter-spacing:.12em}
.project-reel{display:flex;height:640px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;overscroll-behavior-x:contain;cursor:grab;scrollbar-width:none}
.project-reel::-webkit-scrollbar{display:none}.project-reel.dragging{cursor:grabbing;scroll-snap-type:none}
.project-reel-card{position:relative;flex:0 0 clamp(190px,17vw,245px);height:100%;overflow:hidden;border-right:1px solid rgba(211,225,242,.25);scroll-snap-align:start;cursor:pointer;transition:flex-basis .6s cubic-bezier(.16,1,.3,1);isolation:isolate}
.project-reel-card:first-child{flex-basis:clamp(280px,27vw,390px)}.project-reel-card:hover,.project-reel-card:focus-visible,.project-reel-card.expanded{flex-basis:clamp(300px,31vw,440px);outline:none}
.project-reel-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.78) brightness(.72);transition:filter .45s,transform .8s cubic-bezier(.16,1,.3,1)}
.project-reel-card:hover>img,.project-reel-card:focus-visible>img,.project-reel-card.expanded>img{filter:saturate(.95) brightness(.8);transform:scale(1.035)}
.project-reel-card::after{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,rgba(10,19,34,.05) 20%,rgba(10,19,34,.92) 100%)}
.project-reel-index{position:absolute;z-index:2;left:22px;top:22px;font:800 13px "Inter";letter-spacing:.12em;color:#dceaf8}
.project-reel-copy{position:absolute;z-index:2;left:22px;right:22px;bottom:26px}.project-reel-copy>p{font:700 9px "Inter";letter-spacing:.14em;color:#a9ccf5}
.project-reel-copy h3{font-size:clamp(21px,2vw,31px);line-height:1.28;margin:12px 0 0;max-width:11em}
.project-reel-detail{max-height:0;opacity:0;overflow:hidden;transform:translateY(14px);transition:max-height .55s cubic-bezier(.16,1,.3,1),opacity .35s,transform .55s cubic-bezier(.16,1,.3,1)}
.project-reel-card:hover .project-reel-detail,.project-reel-card:focus-visible .project-reel-detail,.project-reel-card.expanded .project-reel-detail{max-height:180px;opacity:1;transform:none}
.project-reel-detail p{font-size:11px;line-height:1.75;color:#d0d8e4;margin:18px 0 12px}.project-reel-detail strong{font-size:11px;line-height:1.6;color:#a9ccf5}
.project-reel-progress{height:2px;margin:24px 5vw 0 0;background:#516079;overflow:hidden}.project-reel-progress i{display:block;width:16.66%;height:100%;background:#8fb9f0;transition:width .18s linear}
.news{padding:140px 5vw}.news .section-intro{color:var(--navy)}.news-list{max-width:1070px;margin:auto}.news-list a{min-height:96px}.news-list a:hover p{color:var(--blue)}
.company-band{position:relative;min-height:760px;padding:72px 4.5vw;background:var(--navy);color:var(--paper);display:grid;grid-template-columns:minmax(360px,.76fr) minmax(600px,1.42fr);align-items:center;gap:clamp(25px,4vw,70px);overflow:hidden}
.company-band::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(143,185,240,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(143,185,240,.055) 1px,transparent 1px);background-size:40px 40px;pointer-events:none}
.company-copy{position:relative;z-index:2}.company-copy>p:first-child{font:700 11px "Inter";letter-spacing:.2em;color:#8fb9f0}.company-band h2{font-size:clamp(35px,4vw,62px);line-height:1.22;margin:24px 0 30px}.company-band h2 em{font-style:normal;color:#8fb9f0;text-shadow:0 0 24px rgba(55,103,168,.38)}
.company-lead{max-width:41ch;margin:0 0 14px;color:#c7d0dc;font-size:13px;line-height:2}
.company-band ul{list-style:none;padding:0;margin:36px 0 0;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(143,185,240,.46);background:rgba(16,27,49,.58)}
.company-band li{display:flex;flex-direction:column;align-items:center;gap:7px;padding:23px 10px;border-right:1px solid rgba(143,185,240,.32);font-size:13px;text-align:center}.company-band li:last-child{border-right:0}
.company-band li b{font:800 clamp(34px,4vw,54px)/1 "Inter";color:#8fb9f0;text-shadow:0 0 18px rgba(55,103,168,.56)}.company-band li span{display:grid;gap:6px}.company-band li small{font:600 9px "Inter";letter-spacing:.18em;color:#91a4bc}
.company-map{position:relative;z-index:2;margin:0;min-width:0}.company-map>img{display:block;width:100%;height:auto;object-fit:contain;filter:hue-rotate(22deg) saturate(.75) brightness(.9) contrast(1.05);opacity:.94}.company-map figcaption{position:absolute;right:3%;bottom:2%;font:600 9px "Inter";letter-spacing:.16em;color:#8fb9f0}
.map-point{position:absolute;z-index:3;left:var(--x);top:var(--y);width:8px;height:8px;border-radius:50%;background:#d9eaff;box-shadow:0 0 6px #d9eaff,0 0 14px #8fb9f0,0 0 28px #3767a8;transform:translate(-50%,-50%)}
.map-point::before,.map-point::after{content:"";position:absolute;inset:-6px;border:1px solid rgba(143,185,240,.78);border-radius:50%;animation:map-pulse 2.6s cubic-bezier(.16,1,.3,1) infinite;animation-delay:var(--delay)}
.map-point::after{inset:-13px;animation-delay:calc(var(--delay) + .55s)}.map-point-major{width:11px;height:11px;background:#eef5ff}
@keyframes map-pulse{0%{transform:scale(.25);opacity:0}20%{opacity:1}100%{transform:scale(2.8);opacity:0}}
.contact{position:relative;min-height:820px;color:var(--paper);padding:clamp(90px,9vw,145px) 7vw 90px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.62fr);align-items:end;gap:clamp(50px,8vw,130px);background:var(--navy) url("assets/yusente/brand/final-contact-hero.png") center/cover no-repeat;overflow:hidden}.contact::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,19,34,.95) 0%,rgba(10,19,34,.74) 42%,rgba(10,19,34,.16) 72%,rgba(10,19,34,.36) 100%)}.contact-copy,.contact-panel{position:relative;z-index:1}.contact-copy>p:first-child{font:700 10px "Inter";letter-spacing:.22em;color:#a9ccf5}.contact h2{max-width:820px;font-size:clamp(38px,4.8vw,70px);line-height:1.28;margin:30px 0 28px;letter-spacing:-.035em}.contact h2 small{display:block;margin-bottom:14px;font-size:.34em;font-weight:500;letter-spacing:.16em}.contact-lead{max-width:55ch;color:#c9d4e1;font-size:13px;line-height:2}.contact-values{display:flex;flex-wrap:wrap;gap:0;margin-top:48px;border-top:1px solid rgba(211,225,242,.42);max-width:720px}.contact-values span{min-width:145px;padding:20px 30px 0 0;font-size:13px}.contact-values small{display:block;margin-top:6px;color:#91a4bc;font:600 8px "Inter";letter-spacing:.16em}.contact-panel{align-self:end;background:rgba(16,27,49,.86);border:1px solid rgba(169,204,245,.42);padding:30px}.contact-panel>span{display:block;margin-bottom:18px;color:#8fb9f0;font:700 9px "Inter";letter-spacing:.2em}.contact-panel a{display:grid;gap:7px;padding:24px 0;border-top:1px solid rgba(211,225,242,.3)}.contact-panel small,.contact-panel i{font-size:10px;font-style:normal;color:#aebdce}.contact-panel b{font:700 clamp(20px,2vw,30px) "Inter";letter-spacing:-.03em}
footer{background:#111d32;color:var(--paper);padding:36px 5vw;display:grid;grid-template-columns:1fr 1.2fr 1fr auto;align-items:center;gap:35px;border-top:1px solid #34445e}
.footer-brand{font:900 30px/1 "Inter";letter-spacing:.08em;color:#8fb9f0}footer p{font-size:10px;line-height:1.8;margin:0;color:#b8c4d2}footer>a{font:11px "Inter";letter-spacing:.12em}
.footer-icp{color:#8fa4bd;font-size:10px;line-height:1.9}
@keyframes marquee{to{transform:translateX(-20%)}}
@media(max-width:850px){
  :root{--rail:0px}.side-rail{display:none}.mobile-header{display:block;position:fixed;z-index:18;top:0;left:0;right:0;height:65px;background:var(--paper);border-bottom:1px solid var(--line)}
  .mobile-brand{font:700 18px "Inter";line-height:65px;padding-left:18px}.menu-button{top:10px;right:12px;width:45px;height:45px}
  .site-menu{inset:0;padding:100px 20px 30px}.menu-grid{grid-template-columns:1fr}.menu-grid a{padding:15px 20px}.menu-grid strong{font-size:30px}.menu-contact{align-items:start;flex-direction:column}.menu-contact a{font-size:26px}
  main,footer{margin-left:0}.hero{height:880px;padding-top:65px}.hero::after,.hero-bg{height:650px}.hero-statement{top:100px;left:18px;font-size:19vw}.hero-orbit{top:240px;left:8%;width:92vw;height:68vw}
  .hero-card{top:auto;right:18px;left:18px;bottom:170px;width:auto;min-height:190px;grid-template-columns:55px 1fr}.hero-card-index{padding:20px 12px;font-size:18px}
  .hero-card-copy{padding:22px;grid-template-columns:1fr;gap:18px}.hero-card h1{font-size:8vw}.hero-card p{font-size:10px;line-height:1.75}.hero-card b{font-size:12px}
  .hero-controls{right:18px;bottom:105px}.hero-jp{left:20px;top:350px;font-size:26px}.hero-news{display:none}
  .values{padding:100px 20px}.values-stage{min-height:760px}.values-word{top:-35px;font-size:24vw}.values-stage>img{left:0;top:50px;width:100%;aspect-ratio:16/10}.design-evidence{left:0;top:365px;width:72%}.design-evidence button{min-height:48px}.values-copy{width:88%;right:0;padding:28px;bottom:0}.values-copy h2{font-size:23px}
  .history{padding:90px 20px 0}.history-heading,.record-heading{grid-template-columns:1fr;gap:20px;margin-bottom:45px}.history-heading h2 span{display:block;margin:0 0 20px}.history-experience{height:680px;min-height:0;margin:0 -20px}.history-phases{left:12px;right:0;top:72px;height:100px;display:flex;overflow-x:auto}.history-phases button{flex:0 0 145px;padding:18px 10px 12px}.history-phases button::before{left:10px}.history-phases strong{font-size:14px}.history-phases span{display:none}.history-case figcaption{left:20px;right:20px;bottom:112px;display:block}.history-case figcaption span{display:block;font-size:42px;margin-bottom:8px}.history-case figcaption strong{font-size:25px}.history-case>p{left:20px;right:20px;bottom:54px;max-width:none}.history-case-progress{right:20px;bottom:150px}.history-case-progress b{font-size:28px}.history-case-progress i{width:90px}.history-scroll-cue{display:none}
  .pile-3d{height:420vh}.pile-stage-word span{font-size:32vw}.pile-stage-kicker{left:20px;top:82px}.pile-stage-panel,.pile-stage-panel-right{left:22px;right:22px;top:auto;bottom:74px;width:auto;text-align:left;transform:translateY(22px)}.pile-stage-panel.active{transform:none}.pile-stage-panel h2{font-size:32px;margin:14px 0}.pile-stage-panel p{font-size:12px;max-width:32ch;margin:0}.pile-stage-panel-right p{margin-left:0}.pile-stage-progress{left:22px;right:22px;bottom:40px}.pile-scroll-cue{display:none}
  .business{padding:100px 20px}.section-intro{grid-template-columns:minmax(0,1fr);gap:30px}.section-intro>*{min-width:0}.section-intro h2{font-size:18vw}.business-showcase{grid-template-columns:1fr;min-height:0}.business-nav{display:grid;grid-template-columns:1fr 1fr;border-right:0}
  .business-nav button{min-height:95px;border-right:1px solid #55627a}.business-copy{min-height:430px;padding:30px}.business-copy h3{margin:20px 0 12px}.business-media{height:360px}
  .advantages{grid-template-columns:1fr}.advantages-intro{padding:80px 22px 0}.advantages-video{height:300px;margin-top:20px}.advantage-list{padding:50px 22px}.advantage-list article{grid-template-columns:50px 1fr}
  .works{height:320px}.outline-text{font-size:92px}.works strong{font-size:50px}.works>a{width:88%}
  .track-record{padding-bottom:90px}.record-metrics{grid-template-columns:1fr 1fr}.record-metrics div{min-height:126px;padding:22px;border-bottom:1px solid #526079}.record-metrics b{font-size:42px}.record-heading{padding:80px 22px 45px}
  .project-reel-wrap{padding-left:20px}.project-reel-top{padding-right:20px}.project-reel-top>p{max-width:150px;line-height:1.6}.project-reel-controls button{width:42px;height:42px}.project-reel{height:520px}.project-reel-card,.project-reel-card:first-child{flex-basis:74vw}.project-reel-card:hover,.project-reel-card:focus-visible,.project-reel-card.expanded{flex-basis:82vw}.project-reel-progress{margin-right:20px}
  .news{padding:100px 20px}.news-list a{grid-template-columns:90px 75px 1fr;gap:10px;padding:16px 0}.news-list i{display:none}
  .company-band{min-height:0;padding:75px 20px 55px;grid-template-columns:1fr;gap:35px}.company-band h2{font-size:38px}.company-lead{font-size:12px}.company-band ul{margin-top:25px}.company-band li{padding:18px 5px}.company-band li b{font-size:30px}.company-map{margin:0 -12px}.company-map figcaption{display:none}
  .contact{min-height:760px;padding:100px 22px 55px;grid-template-columns:1fr;align-items:end;gap:45px;background-position:62% center}.contact::before{background:linear-gradient(180deg,rgba(10,19,34,.82),rgba(10,19,34,.94) 72%)}.contact h2{font-size:43px}.contact-values{margin-top:30px}.contact-values span{min-width:50%;padding-right:10px}.contact-panel{padding:22px}
  footer{grid-template-columns:1fr;padding:40px 25px;gap:18px}.footer-brand{font-size:28px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.hero-bg{display:none}.hero{background:url("assets/yusente/brand/wusong-river.webp") top center/cover no-repeat}}

/* 2026 design upgrade: industrial cinema, drawing-board order, restrained motion */
:root{
  --ink:oklch(26% .035 255);
  --ink-deep:oklch(18% .03 255);
  --ink-soft:oklch(35% .035 255);
  --brand:oklch(53% .115 252);
  --brand-bright:oklch(72% .105 250);
  --surface:oklch(97.5% .008 250);
  --surface-blue:oklch(94.5% .014 250);
  --text-muted:oklch(49% .025 255);
  --hairline:oklch(83% .018 250);
  --rail:clamp(112px,8.2vw,142px);
  --ease-out:cubic-bezier(.16,1,.3,1);
}
body{background:var(--surface);color:var(--ink);font-feature-settings:"kern" 1,"palt" 1}
::selection{background:var(--brand);color:var(--surface)}
:focus-visible{outline:2px solid var(--brand-bright);outline-offset:5px}
.skip-link{position:fixed;z-index:100;left:18px;top:18px;padding:12px 18px;background:var(--surface);color:var(--ink);transform:translateY(-160%);transition:transform .25s var(--ease-out)}
.skip-link:focus{transform:none}
.scroll-progress{position:fixed;z-index:60;top:0;left:var(--rail);right:0;height:2px;background:rgba(255,255,255,.12);pointer-events:none}
.scroll-progress i{display:block;width:0;height:100%;background:var(--brand-bright);box-shadow:0 0 18px color-mix(in oklch,var(--brand-bright),transparent 35%)}
.anchor-target{position:absolute;top:0}

.side-rail{background:var(--ink-deep);border:0;color:var(--surface);padding:0 14px}
.side-rail::after{content:"";position:absolute;right:0;top:0;bottom:0;width:1px;background:linear-gradient(transparent,rgba(164,199,241,.35) 16%,rgba(164,199,241,.35) 84%,transparent)}
.rail-logo{width:calc(100% + 4px);margin-top:18px;padding:12px 7px 10px;background:var(--surface)}.rail-logo img{filter:none;opacity:1}
.rail-nav{width:100%;margin:auto 0;display:grid;gap:0}
.rail-nav a{position:relative;display:grid;grid-template-columns:25px 1fr;align-items:center;min-height:44px;color:rgba(225,234,245,.42);transition:color .3s var(--ease-out)}
.rail-nav a::after{content:"";position:absolute;right:-14px;width:2px;height:0;background:var(--brand-bright);transition:height .45s var(--ease-out)}
.rail-nav a:hover,.rail-nav a.active{color:var(--surface)}
.rail-nav a.active::after{height:24px}
.rail-nav span{font:600 9px "Inter",sans-serif;letter-spacing:.08em}
.rail-nav b{font-size:10px;font-weight:500;letter-spacing:.08em;white-space:nowrap}
.rail-bottom{color:rgba(225,234,245,.55)}.rail-bottom span{font-size:10px}

.menu-button{top:24px;right:24px;width:58px;height:58px;background:color-mix(in oklch,var(--ink-deep),transparent 8%);border:1px solid rgba(185,213,245,.24);box-shadow:0 16px 42px rgba(4,11,22,.18);transition:background .3s var(--ease-out),border-color .3s var(--ease-out)}
.menu-button:hover{background:var(--brand);border-color:var(--brand-bright)}
.site-menu{background:var(--ink-deep);color:var(--surface)}
.menu-grid{background:rgba(164,199,241,.18)}
.menu-grid a{background:var(--ink-deep);min-height:150px;justify-content:flex-end;transition:background .35s var(--ease-out),color .35s var(--ease-out)}
.menu-grid a:hover{background:var(--brand)}
.menu-grid strong{font-size:clamp(30px,3vw,48px)}

.hero{height:max(820px,100svh);min-height:820px;background:var(--ink-deep)}
.hero::after{height:100%;background:linear-gradient(90deg,rgba(5,12,24,.88) 0%,rgba(7,15,28,.4) 48%,rgba(5,12,24,.18) 72%,rgba(5,12,24,.6) 100%),linear-gradient(180deg,rgba(6,13,25,.12) 45%,rgba(6,13,25,.88) 100%)}
.hero-bg{height:100%;filter:saturate(.7) contrast(1.14) brightness(.78);transform:scale(1.01)}
.hero-statement{top:clamp(86px,11vh,130px);left:clamp(28px,4.3vw,72px);font-size:clamp(82px,10.4vw,174px);line-height:.77;letter-spacing:-.082em;text-shadow:0 18px 60px rgba(4,10,20,.25)}
.hero-statement::after{content:"钢板桩工法综合解决方案";display:block;margin-top:42px;font:500 11px/1.5 "Noto Sans SC",sans-serif;letter-spacing:.35em;color:rgba(229,238,248,.72)}
.hero-orbit{top:18%;right:-7%;width:min(720px,48vw);height:min(480px,34vw);border-color:rgba(169,204,245,.34)}
.hero-orbit::before,.hero-orbit::after{content:"";position:absolute;border:1px solid rgba(169,204,245,.16);border-radius:50%;inset:8%}
.hero-orbit::after{inset:18%}
.hero-card{right:4vw;bottom:clamp(130px,16vh,178px);width:min(610px,50vw);min-height:190px;background:rgba(11,23,42,.82);border:1px solid rgba(185,213,245,.28);box-shadow:0 32px 90px rgba(3,9,18,.34)}
.hero-card-copy{padding:clamp(24px,2.5vw,38px)}
.hero-card h1{font-size:clamp(38px,4.4vw,68px);line-height:.84}
.hero-card p{color:#d0dbe8}.hero-card-index{color:var(--brand-bright)}
.hero-controls{bottom:72px}.hero-controls button,.arrow-controls button{transition:background .25s,color .25s,border-color .25s}
.hero-controls button:hover,.arrow-controls button:hover{background:var(--brand);color:var(--surface);border-color:var(--brand)}
.hero-news{bottom:0;background:rgba(9,19,36,.88);border-color:rgba(185,213,245,.22)}
.hero-news a{min-height:82px}.hero-jp{opacity:.85}

.values{padding:clamp(120px,11vw,190px) clamp(28px,6vw,100px);background:var(--surface)}
.values-stage{max-width:1380px;margin:auto;min-height:760px}
.values-word{color:transparent;-webkit-text-stroke:1px color-mix(in oklch,var(--brand),transparent 56%);font-size:clamp(110px,17vw,260px);letter-spacing:-.085em}
.values-stage>img{box-shadow:0 38px 100px rgba(20,38,66,.16);border:1px solid var(--hairline)}
.design-evidence{box-shadow:0 26px 70px rgba(16,34,60,.12)}
.design-evidence button{background:color-mix(in oklch,var(--surface),transparent 4%);transition:background .3s,color .3s}
.design-evidence button:hover,.design-evidence button.active{background:var(--ink);color:var(--surface)}
.values-copy{background:var(--ink);color:var(--surface);box-shadow:0 36px 90px rgba(9,20,38,.2)}
.values-copy::before{content:"YUSENTE / INTEGRATED VALUE";display:block;margin-bottom:30px;font:600 9px "Inter";letter-spacing:.22em;color:var(--brand-bright)}

.history{background:var(--surface-blue)}
.history-heading{padding-top:clamp(110px,10vw,170px)}
.history-heading>p,.record-heading>p,.advantages-intro>p,.company-copy>p:first-child{letter-spacing:.22em;font-size:10px}
.history-heading h2,.record-heading h2,.advantages-intro h2,.company-band h2{letter-spacing:-.045em}
.history-experience{max-width:1500px;margin-inline:auto;box-shadow:0 40px 110px rgba(17,34,60,.15)}
.history-case figure::after{background:linear-gradient(180deg,rgba(6,13,25,.12),rgba(6,13,25,.8))}
.history-phases{background:rgba(8,18,34,.76);border-color:rgba(169,204,245,.22)}
.history-phases button{transition:background .35s var(--ease-out),color .35s var(--ease-out)}
.history-phases button:hover{background:rgba(55,103,168,.3)}

.pile-3d-sticky{background:radial-gradient(circle at 50% 42%,oklch(29% .05 251),var(--ink-deep) 62%)}
.pile-3d-sticky::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(159,194,235,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(159,194,235,.055) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,transparent,black 20%,black 80%,transparent);pointer-events:none}
.pile-stage-panel h2{letter-spacing:-.055em}

.business{padding-top:clamp(120px,11vw,180px);background:var(--ink-deep)}
.section-intro{max-width:1250px}.section-intro h2{color:var(--surface);font-size:clamp(82px,11vw,168px)}
.business-showcase{max-width:1350px;border-color:rgba(169,204,245,.28);grid-template-columns:minmax(190px,240px) minmax(270px,.75fr) minmax(420px,1.35fr)}
.business-nav{border-color:rgba(169,204,245,.28)}
.business-nav button{border-color:rgba(169,204,245,.2);transition:background .35s,color .35s}
.business-nav button:hover{color:var(--surface);background:rgba(55,103,168,.18)}
.business-nav button.active{background:var(--brand)}
.business-copy{padding:52px 9%}.business-copy h3{font-size:clamp(34px,3vw,50px)}
.business-media{min-height:660px}

.advantages{background:var(--surface);grid-template-columns:minmax(500px,.92fr) minmax(520px,1.08fr)}
.advantages-intro{background:var(--ink);padding-top:clamp(100px,9vw,150px)}
.advantages-intro h2{font-size:clamp(42px,4.3vw,70px)}
.advantages-video{height:470px}
.advantage-list{padding:clamp(70px,7vw,115px) 8%}
.advantage-list article{grid-template-columns:58px 1fr;padding:34px 0;transition:padding-left .35s var(--ease-out),color .35s}
.advantage-list article:hover{padding-left:12px}
.advantage-list h3{font-size:clamp(22px,2vw,29px)}

.works{height:400px;background:var(--brand)}
.outline-text{opacity:.55;animation-duration:28s}
.works>a{max-width:1040px}.works strong{font-size:clamp(64px,8vw,120px)}

.track-record{background:var(--ink-deep)}
.record-metrics{border-color:rgba(169,204,245,.26)}
.record-metrics div{border-color:rgba(169,204,245,.22);min-height:150px}
.record-heading{max-width:1240px}.record-heading h2{font-size:clamp(38px,4.4vw,66px)}
.project-reel-wrap{max-width:1500px}
.project-reel{height:min(690px,74vh)}
.project-reel-card{border-color:rgba(211,225,242,.18)}
.project-reel-card>img{filter:saturate(.68) brightness(.7) contrast(1.08)}
.project-reel-copy h3{letter-spacing:-.035em}
.project-reel-controls button{transition:background .25s,border-color .25s}.project-reel-controls button:hover{background:var(--brand);border-color:var(--brand)}

.news{background:var(--surface);padding-block:clamp(110px,10vw,165px)}
.news .section-intro h2{color:var(--ink)}
.news-list a{border-color:var(--hairline);transition:padding-left .35s var(--ease-out),background .35s}
.news-list a:hover{padding-left:18px;background:var(--surface-blue)}

.company-band{min-height:850px;background:var(--ink);padding-block:clamp(90px,9vw,150px)}
.company-band::before{background-size:56px 56px}
.company-band h2{font-size:clamp(44px,4.8vw,76px)}
.company-band ul{background:rgba(9,19,36,.54)}
.company-map>img{filter:saturate(.58) brightness(.88) contrast(1.08)}

.contact{min-height:max(820px,92svh);background-position:center}
.contact::before{background:linear-gradient(90deg,rgba(7,15,29,.96) 0%,rgba(7,15,29,.78) 44%,rgba(7,15,29,.16) 76%,rgba(7,15,29,.36) 100%)}
.contact h2{font-size:clamp(42px,5vw,76px);letter-spacing:-.052em}
.contact h2 small{letter-spacing:.22em;color:var(--brand-bright)}
.contact-panel{background:rgba(8,18,34,.88);box-shadow:0 28px 80px rgba(3,9,18,.24)}
.contact-panel a{transition:padding-left .3s var(--ease-out),background .3s}.contact-panel a:hover{padding-left:12px;background:rgba(55,103,168,.12)}
footer{background:var(--ink-deep)}

@media(max-width:1100px) and (min-width:851px){
  :root{--rail:104px}
  .rail-nav b{display:none}.rail-nav a{grid-template-columns:1fr;text-align:center}.rail-nav a::after{right:-14px}
  .business-showcase{grid-template-columns:190px .8fr 1.2fr}
  .advantages{grid-template-columns:46% 54%}
}
@media(max-width:850px){
  .scroll-progress{left:0}
  .mobile-header{background:color-mix(in oklch,var(--surface),transparent 4%);backdrop-filter:blur(14px)}
  .mobile-brand{font-size:15px;letter-spacing:.08em}
  .hero{min-height:820px;height:900px}.hero::after,.hero-bg{height:100%}
  .hero-statement{top:105px;font-size:18vw}.hero-statement::after{margin-top:26px;font-size:9px}
  .hero-card{bottom:128px;background:rgba(10,21,39,.9)}
  .hero-controls{bottom:76px}.hero-jp{top:310px}
  .values{padding-inline:20px}.values-stage{min-height:780px}
  .history-heading{padding-top:90px}
  .business-showcase{grid-template-columns:1fr}.business-media{min-height:0;height:420px}
  .advantages{grid-template-columns:1fr}.advantages-video{height:330px}
  .company-band{min-height:0}
  .contact h2{font-size:clamp(38px,11vw,52px)}
}

/* Color rhythm review: reduce long dark runs without losing industrial authority */
:root{
  --surface-warm:oklch(98.2% .006 245);
  --surface-mist:oklch(94.8% .018 244);
  --surface-steel:oklch(90.5% .028 244);
  --body-readable:oklch(39% .026 255);
}

/* Keep the hero cinematic, but reveal more authentic project detail. */
.hero::after{
  background:
    linear-gradient(90deg,rgba(5,12,24,.80) 0%,rgba(7,15,28,.30) 49%,rgba(5,12,24,.10) 72%,rgba(5,12,24,.48) 100%),
    linear-gradient(180deg,rgba(6,13,25,.08) 42%,rgba(6,13,25,.78) 100%);
}
.hero-bg{filter:saturate(.76) contrast(1.08) brightness(.88)}

/* Reserve a clean lower-third for the two project links. */
@media(min-width:851px){
  .hero-card{bottom:clamp(214px,23vh,270px)}
  .hero-controls{bottom:176px}
  .hero-jp{
    top:auto;
    bottom:226px;
    max-width:420px;
    margin:0;
  }
  .hero-news{background:rgba(9,19,36,.97)}
}

@media(min-width:851px) and (max-height:900px){
  .hero-statement{
    top:72px;
    font-size:clamp(76px,8.7vw,142px);
  }
  .hero-statement::after{margin-top:28px}
  .hero-jp{
    top:480px;
    bottom:auto;
    font-size:clamp(28px,2.2vw,36px);
    line-height:1.25;
  }
  .hero-card{
    bottom:214px;
    min-height:174px;
  }
  .hero-card-copy{padding-block:24px}
  .hero-card h1{font-size:clamp(36px,3.7vw,58px)}
}

/* Light evidence sections use two related papers instead of identical white. */
.values{background:var(--surface-warm)}
.history{background:var(--surface-mist)}
.history-experience{box-shadow:0 34px 90px rgba(17,34,60,.13)}
.history-case figure::after{
  background:linear-gradient(180deg,rgba(6,13,25,.18) 0%,rgba(6,13,25,.02) 46%,rgba(6,13,25,.76) 100%);
}

/* The 3D chapter remains the deliberate dark immersion point. */
.pile-3d-sticky{
  background:radial-gradient(circle at 50% 42%,oklch(34% .055 251),oklch(21% .035 255) 68%);
}

/* Core capabilities become a technical-paper chapter after the dark 3D scene. */
.business{background:var(--surface-warm);color:var(--ink)}
.business .section-intro{grid-template-columns:1fr;gap:34px}
.business .section-intro h2{color:var(--ink)}
.business .section-intro p{color:var(--body-readable);max-width:540px;margin-left:auto}
.business-showcase{border-color:var(--hairline)}
.business-nav{border-color:var(--hairline)}
.business-nav button{
  color:var(--text-muted);
  border-color:var(--hairline);
}
.business-nav button:hover{
  color:var(--ink);
  background:var(--surface-mist);
}
.business-nav button.active{color:var(--surface-warm);background:var(--brand)}
.business-copy .giant-number{color:var(--brand)}
.business-copy h3{color:var(--ink)}
.business-copy>p:not(.giant-number){color:var(--body-readable)}
.business-copy a{border-color:var(--hairline);color:var(--ink)}

/* Full-length anti-corrosion process — driven by the verified STL geometry. */
.corrosion-process{
  position:relative;
  height:auto;
  background:var(--ink-deep);
  color:var(--surface);
}
.corrosion-sticky{
  position:relative;
  height:min(1000px,100svh);
  min-height:760px;
  overflow:hidden;
  background:
    radial-gradient(circle at 55% 46%,rgba(58,106,164,.24),transparent 38%),
    linear-gradient(125deg,#081222,#12233c 62%,#091423);
}
.corrosion-sticky::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(154,190,232,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(154,190,232,.055) 1px,transparent 1px);
  background-size:60px 60px;
  mask-image:linear-gradient(to bottom,transparent 3%,black 22%,black 84%,transparent);
  pointer-events:none;
}
.corrosion-product{
  --coat-progress:0;
  --reveal-right:100%;
  --scan-position:0%;
  position:absolute;
  z-index:2;
  left:3.5vw;
  right:3.5vw;
  top:38vh;
  height:24vh;
  min-height:200px;
  display:grid;
  place-items:center;
  isolation:isolate;
}
.corrosion-product::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:4%;
  right:2%;
  top:50%;
  height:38%;
  border-radius:50%;
  background:rgba(50,111,174,.22);
  filter:blur(60px);
  transform:translateY(-8%);
}
.corrosion-product>img,.corrosion-reveal,.corrosion-reveal img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.corrosion-product>img,.corrosion-reveal img{object-fit:contain;filter:drop-shadow(0 28px 30px rgba(0,0,0,.42))}
.corrosion-reveal{overflow:hidden;clip-path:inset(0 var(--reveal-right) 0 0);will-change:clip-path}
.corrosion-scan{
  position:absolute;
  z-index:4;
  left:var(--scan-position);
  top:8%;
  bottom:8%;
  width:2px;
  background:#b8e0ff;
  box-shadow:0 0 10px #8bc9ff,0 0 34px 12px rgba(74,157,232,.3);
  opacity:calc(.22 + var(--coat-progress)*.72);
  transform:translateX(-1px);
}
.corrosion-scan::before{content:"";position:absolute;inset:0 -24px;background:linear-gradient(90deg,transparent,rgba(119,190,247,.14),transparent)}
.corrosion-product.is-inspecting .corrosion-scan{animation:corrosion-inspection 2.4s cubic-bezier(.16,1,.3,1) infinite}
.corrosion-length{position:absolute;right:2%;bottom:-8px;color:rgba(181,210,241,.42);font:600 9px "Inter";letter-spacing:.22em}
@keyframes corrosion-inspection{0%{left:3%;opacity:.15}65%{left:97%;opacity:1}100%{left:97%;opacity:0}}
.corrosion-heading{position:absolute;z-index:2;left:5vw;top:8vh;max-width:570px}
.corrosion-heading p{margin:0 0 20px;color:var(--brand-bright);font:600 10px "Inter",sans-serif;letter-spacing:.24em}
.corrosion-heading h2{margin:0;font-size:clamp(44px,5.3vw,82px);line-height:1.04;letter-spacing:-.055em}
.corrosion-stage{
  position:absolute;
  z-index:3;
  left:5vw;
  bottom:19vh;
  width:min(440px,34vw);
  padding-top:22px;
  border-top:1px solid rgba(188,215,246,.38);
}
.corrosion-stage span{color:var(--brand-bright);font:700 11px "Inter";letter-spacing:.18em}
.corrosion-stage h3{margin:15px 0 12px;font-size:clamp(27px,2.4vw,38px);letter-spacing:-.035em}
.corrosion-stage p{margin:0;color:#c8d5e4;font-size:14px;line-height:1.9}
.corrosion-spec{
  position:absolute;
  z-index:3;
  right:4.5vw;
  top:10vh;
  width:min(290px,24vw);
  border-top:1px solid rgba(188,215,246,.35);
}
.corrosion-spec p{display:flex;justify-content:space-between;align-items:end;margin:0;padding:17px 0;border-bottom:1px solid rgba(188,215,246,.2)}
.corrosion-spec span{color:#94a9c1;font-size:11px;letter-spacing:.08em}
.corrosion-spec strong{font:700 22px "Inter";color:#e7f1fc}
.corrosion-cross-section{
  position:absolute;
  z-index:3;
  right:4.5vw;
  top:36vh;
  width:300px;
  height:182px;
  opacity:0;
  transform:translateY(20px);
  transition:opacity .45s,transform .45s;
}
.corrosion-cross-section.visible{opacity:1;transform:none}
.corrosion-cross-section>span{position:absolute;left:0;top:18px;width:92px;height:122px;border-radius:2px;transform:skewY(-12deg);box-shadow:10px 12px 24px rgba(0,0,0,.18)}
.corrosion-cross-section .coat-steel{background:#728399;transform:translate(0,0) skewY(-12deg)}
.corrosion-cross-section .coat-primer{background:#87959e;transform:translate(12px,-7px) skewY(-12deg)}
.corrosion-cross-section .coat-middle{background:#263648;transform:translate(24px,-14px) skewY(-12deg)}
.corrosion-cross-section .coat-finish{background:#2467a8;transform:translate(36px,-21px) skewY(-12deg)}
.corrosion-cross-section div{position:absolute;left:132px;top:0;display:grid;grid-template-columns:1fr auto;gap:13px 18px;width:168px;padding-top:9px}
.corrosion-cross-section b{font-size:11px;font-weight:500;white-space:nowrap}.corrosion-cross-section em{font:600 11px "Inter";font-style:normal;color:var(--brand-bright)}
.corrosion-timeline{
  position:absolute;
  z-index:4;
  left:5vw;
  right:4.5vw;
  bottom:7vh;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  border-top:1px solid rgba(188,215,246,.3);
}
.corrosion-timeline button{
  position:relative;
  min-height:58px;
  padding:17px 10px 0 0;
  border:0;
  background:transparent;
  color:rgba(220,232,246,.42);
  text-align:left;
  font:500 11px "Noto Sans SC",sans-serif;
  cursor:pointer;
  transition:color .3s;
}
.corrosion-timeline button i{position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:#60758e;transition:background .3s,box-shadow .3s}
.corrosion-timeline button span{margin-right:9px;font:700 10px "Inter"}
.corrosion-timeline button.active{color:#f3f7fc}
.corrosion-timeline button.active i{background:var(--brand-bright);box-shadow:0 0 0 8px rgba(111,171,234,.13),0 0 22px var(--brand-bright)}
.corrosion-progress{position:absolute;z-index:3;left:5vw;right:4.5vw;bottom:4.6vh;height:2px;background:rgba(188,215,246,.16)}
.corrosion-progress i{display:block;width:0;height:100%;background:var(--brand-bright);box-shadow:0 0 20px var(--brand-bright)}
.corrosion-note{position:absolute;z-index:3;right:4.5vw;bottom:1.6vh;margin:0;color:rgba(210,225,241,.48);font-size:10px}
.corrosion-scroll-cue{position:absolute;z-index:3;left:5vw;bottom:1.5vh;margin:0;color:var(--brand-bright);font:600 9px "Inter";letter-spacing:.2em}

/* One committed brand-blue collision marks the advantages chapter. */
.advantages{background:var(--surface-warm)}
.advantages-intro{background:var(--brand)}
.advantages-intro>p{color:oklch(91% .045 245)}
.advantages-video video{filter:saturate(.82) contrast(1.06) brightness(.92)}
.advantages-video::after{background:linear-gradient(180deg,rgba(8,17,31,.02),rgba(8,17,31,.30))}
.advantage-list{background:var(--surface-warm)}
.advantage-list p{color:var(--body-readable)}

/* Project evidence is easier to scan on light paper; the reel stays cinematic. */
.track-record{background:var(--surface-warm);color:var(--ink)}
.record-metrics{border-color:var(--hairline);background:var(--surface-mist)}
.record-metrics div{border-color:var(--hairline)}
.record-metrics b{color:var(--brand)}
.record-metrics span{color:var(--body-readable)}
.record-heading>p{color:var(--brand)}
.record-heading h2{color:var(--ink)}
.project-reel-wrap{
  max-width:none;
  padding-top:42px;
  padding-bottom:54px;
  background:var(--ink-deep);
  color:var(--surface);
}
.project-reel-top{padding-left:0}

/* Service copy gets a cool pause before returning to dark national scale. */
.news{background:var(--surface-mist)}
.news-list a{border-color:oklch(81% .025 245)}
.news-list p{color:var(--body-readable)}
.news-list a:hover{background:var(--surface-warm)}

/* Retain dark authority, but lift the final chapters enough to expose imagery. */
.company-band{
  background:linear-gradient(108deg,oklch(31% .045 255),oklch(24% .035 255));
}
.company-lead{color:oklch(85% .018 250)}
.contact::before{
  background:linear-gradient(90deg,rgba(7,15,29,.86) 0%,rgba(7,15,29,.62) 43%,rgba(7,15,29,.08) 76%,rgba(7,15,29,.25) 100%);
}
.contact-lead{color:oklch(87% .018 250)}
.contact-panel{background:rgba(8,18,34,.79)}

@media(max-width:850px){
  .project-reel-wrap{padding-top:30px;padding-bottom:40px}
  .hero::after{
    background:linear-gradient(180deg,rgba(5,12,24,.54),rgba(5,12,24,.78) 76%,rgba(5,12,24,.9));
  }
  .contact::before{
    background:linear-gradient(180deg,rgba(7,15,29,.62),rgba(7,15,29,.88) 74%);
  }
  .corrosion-process{height:auto}
  .corrosion-sticky{height:auto;min-height:0;padding:90px 20px 38px;display:flex;flex-direction:column;gap:24px}
  .corrosion-heading{position:relative;left:auto;right:auto;top:auto;order:1}
  .corrosion-heading p{margin-bottom:14px;font-size:9px;line-height:1.6}
  .corrosion-heading h2{font-size:clamp(34px,10vw,46px);line-height:1.08}
  .corrosion-product{position:relative;left:auto;right:auto;top:auto;order:2;width:calc(100% + 16px);height:150px;min-height:0;margin:0 -8px}
  .corrosion-length{display:none}
  .corrosion-stage{position:relative;left:auto;bottom:auto;order:4;width:auto;padding-top:18px}
  .corrosion-stage h3{margin:12px 0 9px;font-size:26px;line-height:1.25}
  .corrosion-stage p{font-size:14px;line-height:1.75}
  .corrosion-spec{position:relative;right:auto;top:auto;order:3;width:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(188,215,246,.28)}
  .corrosion-spec p{display:grid;align-content:start;gap:8px;padding:14px 8px 12px 0;border-bottom:1px solid rgba(188,215,246,.2)}
  .corrosion-spec span{font-size:10px;line-height:1.45}.corrosion-spec strong{font-size:16px;line-height:1.2}
  .corrosion-cross-section{display:none}
  .corrosion-timeline{position:relative;left:auto;right:auto;bottom:auto;order:5;grid-template-columns:repeat(3,minmax(0,1fr));row-gap:12px}
  .corrosion-timeline button{min-height:56px;padding:16px 8px 4px 0;font-size:12px;line-height:1.4}
  .corrosion-progress{position:relative;left:auto;right:auto;bottom:auto;order:6}
  .corrosion-note{position:relative;right:auto;bottom:auto;order:7;font-size:11px;line-height:1.7}
  .corrosion-scroll-cue{position:relative;left:auto;bottom:auto;order:8;font-size:9px}
}

/* Consolidated press-in section: single final implementation, replacing iterative legacy blocks. */
.pressin-method.pressin-film{
  position:relative;
  height:clamp(600px,76svh,760px);
  min-height:600px;
  display:grid;
  grid-template-columns:minmax(360px,39%) minmax(620px,61%);
  grid-template-rows:1fr auto;
  padding:0;
  overflow:hidden;
  color:#111b27;
  background:linear-gradient(90deg,#e3e7ea 0%,#d8dee3 39%,#101927 39%,#0a111d 100%);
}
.pressin-method.pressin-film::before{display:none}
.pressin-method.pressin-film::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  opacity:.62;
  background-image:
    linear-gradient(rgba(74,91,108,.075) 1px,transparent 1px),
    linear-gradient(90deg,rgba(74,91,108,.075) 1px,transparent 1px);
  background-size:64px 64px;
}
.pressin-film-copy{
  position:relative;
  z-index:3;
  grid-column:1;
  grid-row:1;
  align-self:end;
  padding:clamp(70px,7vw,104px) clamp(30px,4.7vw,72px) 18px;
}
.pressin-film-copy p{
  margin:0 0 18px;
  color:#416f9e;
  font:800 10px "Inter",sans-serif;
  letter-spacing:.24em;
}
.pressin-film-copy h2{
  margin:0;
  max-width:12.4em;
  color:#101a26;
  font-size:clamp(33px,3.65vw,56px);
  line-height:1.1;
  letter-spacing:-.052em;
  text-wrap:balance;
}
.pressin-film-copy span{
  display:block;
  max-width:45ch;
  margin-top:20px;
  color:#314050;
  font-size:clamp(14px,.98vw,16px);
  line-height:1.9;
}
.pressin-film-panel{
  position:relative;
  z-index:3;
  grid-column:1;
  grid-row:2;
  padding:0 clamp(30px,4.7vw,72px) clamp(44px,5vw,74px);
}
.pressin-film-panel>b{
  display:block;
  padding-bottom:12px;
  color:#416f9e;
  font:800 9px "Inter",sans-serif;
  letter-spacing:.24em;
}
.pressin-film-panel ol{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  max-width:500px;
  margin:0;
  padding:0;
  list-style:none;
}
.pressin-film-panel li{
  min-height:58px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 13px;
  border:1px solid rgba(72,91,110,.22);
  background:rgba(248,250,252,.66);
  color:#101a26;
  box-shadow:0 12px 32px rgba(25,43,62,.055);
}
.pressin-film-panel li:hover{
  background:rgba(255,255,255,.82);
  border-color:rgba(65,111,158,.34);
}
.pressin-film-panel li:active{transform:translateY(0) scale(.985)}
.pressin-film-panel span{
  color:#416f9e;
  font:800 13px "Inter",sans-serif;
}
.pressin-film-media{
  position:relative;
  z-index:2;
  grid-column:2;
  grid-row:1 / span 2;
  width:100%;
  height:100%;
  min-height:0;
  overflow:hidden;
  background:#0b1422;
  box-shadow:inset 1px 0 0 rgba(231,239,248,.14);
}
.pressin-film-media::before{
  content:"";
  position:absolute;
  z-index:3;
  left:0;
  right:0;
  top:0;
  height:39%;
  background:linear-gradient(180deg,rgba(7,14,26,.95),rgba(7,14,26,.76) 54%,rgba(7,14,26,0));
  pointer-events:none;
}
.pressin-film-media::after{
  content:"";
  position:absolute;
  z-index:4;
  inset:26px;
  border:1px solid rgba(244,248,252,.18);
  pointer-events:none;
}
.pressin-film-media video{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 76%;
  transform:scale(1.5) translateY(-12%);
  filter:saturate(.5) contrast(1.22) brightness(.68) sepia(.06);
}
.pressin-film-scrim{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(7,14,26,.72),rgba(7,14,26,.05) 48%,rgba(7,14,26,.18)),
    linear-gradient(180deg,rgba(7,14,26,.05),rgba(7,14,26,.72));
}
.pressin-film-caption{
  position:absolute;
  z-index:5;
  right:clamp(32px,4.2vw,68px);
  bottom:clamp(28px,4vw,58px);
  width:min(365px,29vw);
  padding:13px 15px;
  border:1px solid rgba(244,248,252,.2);
  background:rgba(11,19,31,.76);
  color:oklch(92% .012 250);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.pressin-film-caption strong{font-size:14px;line-height:1.35}
.pressin-film-caption span{color:#8eb9e6;font:700 10px "Inter",sans-serif;letter-spacing:.24em}
.corrosion-cross-section .coat-finish{background:#80888b}
.corrosion-process{
  background:
    radial-gradient(circle at 68% 18%,rgba(61,127,206,.22),transparent 34%),
    radial-gradient(circle at 16% 72%,rgba(39,78,124,.2),transparent 35%),
    linear-gradient(180deg,oklch(13% .032 255),oklch(9% .026 255));
}
@media (max-width:980px) and (min-width:851px){
  .pressin-method.pressin-film{grid-template-columns:43% 57%;height:700px;min-height:700px}
  .pressin-film-copy,.pressin-film-panel{padding-inline:38px}
  .pressin-film-panel ol{grid-template-columns:1fr}
}
@media (max-width:850px){
  .pressin-method.pressin-film{
    height:auto;
    min-height:0;
    display:flex;
    flex-direction:column;
    background:linear-gradient(180deg,#e5e9ec,#d9dfe4);
  }
  .pressin-film-copy{padding:72px 20px 24px}
  .pressin-film-copy h2{font-size:clamp(30px,9.2vw,42px);line-height:1.12;max-width:none}
  .pressin-film-copy span{font-size:14px;line-height:1.82;max-width:none}
  .pressin-film-media{
    height:48svh;
    min-height:320px;
    border-top:1px solid rgba(36,52,72,.16);
    border-bottom:1px solid rgba(36,52,72,.16);
  }
  .pressin-film-media video{transform:scale(1.46) translateY(-12%);filter:saturate(.54) contrast(1.17) brightness(.72) sepia(.04)}
  .pressin-film-media::after{inset:14px}
  .pressin-film-panel{padding:22px 20px 0}
  .pressin-film-panel ol{grid-template-columns:1fr 1fr;max-width:none}
  .pressin-film-panel li{min-height:62px;background:rgba(255,255,255,.74)}
  .pressin-film-caption{position:relative;right:auto;bottom:auto;width:auto;margin:18px 20px 38px;background:rgba(12,22,36,.78)}
}
@media (max-width:420px){
  .pressin-film-copy{padding-top:66px}
  .pressin-film-media{height:300px;min-height:300px}
  .pressin-film-panel ol{grid-template-columns:1fr}
}

/* Impeccable flagship polish: precise industrial rhythm, accessibility states, reduced visual drift. */
:root{
  --steel-950:oklch(15% .028 254);
  --steel-900:oklch(19% .032 254);
  --steel-800:oklch(25% .034 254);
  --steel-700:oklch(34% .036 254);
  --steel-100:oklch(95.5% .01 248);
  --steel-050:oklch(98% .006 248);
  --yusente-blue:oklch(52% .118 252);
  --yusente-blue-soft:oklch(72% .09 250);
  --drawing-line:oklch(82% .018 248);
  --section-pad-x:clamp(22px,5vw,96px);
  --section-pad-y:clamp(92px,10vw,168px);
}
html{scroll-padding-top:18px;text-rendering:optimizeLegibility}
body{-webkit-font-smoothing:antialiased;text-size-adjust:100%}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:80;
  pointer-events:none;
  opacity:.26;
  background:
    linear-gradient(90deg,rgba(46,88,132,.035) 1px,transparent 1px),
    linear-gradient(rgba(46,88,132,.025) 1px,transparent 1px);
  background-size:96px 96px;
  mask-image:linear-gradient(90deg,transparent 0,var(--steel-950) 10%,var(--steel-950) 90%,transparent 100%);
}
main>section{scroll-margin-top:2px}
a,button{transition:color .24s var(--ease-out),background .24s var(--ease-out),border-color .24s var(--ease-out),opacity .24s var(--ease-out),transform .24s var(--ease-out)}
button:active,a:active{transform:translateY(1px)}
button{touch-action:manipulation}
@media (hover:hover){
  .rail-nav a:hover b,.menu-grid a:hover strong,.contact-panel a:hover b{color:var(--yusente-blue-soft)}
}
.rail-logo{box-shadow:inset 0 0 0 1px rgba(20,38,66,.08)}
.rail-nav a{min-height:48px}
.rail-nav a::before{
  content:"";
  position:absolute;
  left:-10px;
  width:4px;
  height:4px;
  border-radius:50%;
  background:currentColor;
  opacity:.32;
}
.rail-nav a.active::before{opacity:1;background:var(--yusente-blue-soft);box-shadow:0 0 0 6px rgba(143,185,240,.12)}
.menu-button{backdrop-filter:none}
.site-menu{background:linear-gradient(135deg,var(--steel-950),oklch(18% .036 254))}
.menu-grid a{position:relative;overflow:hidden}
.menu-grid a::after{
  content:"";
  position:absolute;
  left:32px;
  right:32px;
  bottom:24px;
  height:1px;
  background:rgba(185,213,245,.18);
  transform-origin:left;
  transform:scaleX(.18);
  transition:transform .42s var(--ease-out),background .24s var(--ease-out);
}
.menu-grid a:hover::after,.menu-grid a:focus-visible::after{transform:scaleX(1);background:rgba(229,238,248,.6)}
.hero{isolation:isolate}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    radial-gradient(circle at 74% 24%,rgba(112,159,214,.18),transparent 28%),
    linear-gradient(rgba(169,204,245,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(169,204,245,.045) 1px,transparent 1px);
  background-size:auto,84px 84px,84px 84px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.92),rgba(0,0,0,.18) 72%,transparent 100%);
}
.hero-card{backdrop-filter:none;border-color:rgba(185,213,245,.34)}
.hero-card::after{
  content:"";
  position:absolute;
  inset:12px;
  border:1px solid rgba(185,213,245,.14);
  pointer-events:none;
}
.hero-card-copy{position:relative;z-index:1}
.hero-news a{position:relative;overflow:hidden}
.hero-news a::before,.news-list a::before{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:1px;
  background:var(--yusente-blue-soft);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .42s var(--ease-out);
}
.hero-news a:hover::before,.news-list a:hover::before{transform:scaleX(1)}
.values-stage>img,.history-case figure,.business-media,.advantages-video,.project-reel-card,.company-map,.contact-panel{will-change:auto}
.values-copy,.contact-panel,.history-phases,.business-showcase,.record-metrics,.company-band ul{
  border-color:color-mix(in oklch,var(--drawing-line),transparent 18%);
}
.values-copy h2,.history-heading h2,.section-intro h2,.record-heading h2,.company-band h2,.contact h2{text-wrap:balance}
.values-copy>p:last-of-type,.section-intro p,.business-copy>p:not(.giant-number),.advantages-intro>p,.company-lead,.contact-lead{max-width:68ch}
.history-experience{border:1px solid rgba(52,76,110,.14)}
.history-case-progress i{box-shadow:0 0 18px rgba(143,185,240,.38)}
.pile-3d-sticky{background:radial-gradient(circle at 52% 42%,oklch(31% .055 251),var(--steel-950) 64%)}
.business{background:linear-gradient(180deg,var(--steel-950),var(--steel-900))}
.business-showcase{box-shadow:0 36px 120px rgba(4,12,24,.28)}
.business-nav button{cursor:pointer}
.business-nav button:focus-visible{outline-offset:-6px}
.business-copy a{color:var(--yusente-blue-soft)}
.business-media::before{
  content:"";
  position:absolute;
  inset:18px;
  z-index:3;
  border:1px solid rgba(231,239,248,.16);
  pointer-events:none;
}
.pressin-film{
  background:linear-gradient(90deg,oklch(93.8% .01 248) 0%,oklch(88.8% .013 248) 39%,var(--steel-950) 39%,oklch(10.8% .02 254) 100%)!important;
}
.pressin-film-copy p,.pressin-film-panel>b,.pressin-film-panel span{color:var(--yusente-blue)!important}
.pressin-film-panel li{box-shadow:0 12px 32px rgba(25,43,62,.055)!important}
.pressin-film-media{box-shadow:inset 1px 0 0 rgba(231,239,248,.14)}
.corrosion-process{isolation:isolate}
.corrosion-sticky::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 50% 54%,rgba(143,185,240,.08),transparent 42%);
}
.corrosion-heading,.corrosion-stage,.corrosion-spec,.corrosion-timeline,.corrosion-note,.corrosion-scroll-cue{z-index:4}
.project-reel{scroll-snap-type:x proximity;scroll-padding-left:5vw}
.project-reel-card{scroll-snap-align:start;cursor:grab}
.project-reel.dragging .project-reel-card{cursor:grabbing}
.project-reel-card:focus-visible{outline:2px solid var(--yusente-blue-soft);outline-offset:4px}
.record-metrics div{position:relative}
.record-metrics div::after{
  content:"";
  position:absolute;
  left:28px;
  right:28px;
  bottom:0;
  height:1px;
  background:linear-gradient(90deg,var(--yusente-blue-soft),transparent);
  opacity:.22;
}
.company-map{filter:drop-shadow(0 34px 80px rgba(0,0,0,.22))}
.contact-panel{box-shadow:0 32px 92px rgba(3,10,20,.28)}
.contact-panel a:hover{color:var(--yusente-blue-soft)}
footer{border-top-color:rgba(143,185,240,.22)}
.footer-brand{letter-spacing:.1em}
.polish-reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.polish-reveal.is-visible{opacity:1;transform:none}
@media (max-width:850px){
  body::before{opacity:.15;background-size:72px 72px;mask-image:none}
  .menu-button{width:48px;height:48px;right:12px;top:10px}
  .mobile-header{height:62px;background:rgba(247,249,252,.94);backdrop-filter:blur(10px)}
  .mobile-brand{line-height:62px;font-size:14px;letter-spacing:.08em}
  .hero{height:auto;min-height:780px}
  .hero-statement{font-size:clamp(66px,18vw,92px);line-height:.82;top:96px}
  .hero-statement::after{letter-spacing:.22em;max-width:22em}
  .hero-card{bottom:168px;border-radius:0}
  .hero-card::after{inset:8px}
  .hero-card h1{font-size:clamp(32px,9.5vw,42px)}
  .hero-card p{font-size:12px;line-height:1.75}
  .values-copy,.contact-panel{box-shadow:0 22px 62px rgba(6,14,26,.22)}
  .values-copy>p:last-of-type,.history-case>p,.business-copy>p:not(.giant-number),.advantages-intro>p,.company-lead,.contact-lead{font-size:14px;line-height:1.85}
  .history-experience{height:700px}
  .business-showcase{box-shadow:none}
  .business-media::before{inset:12px}
  .pressin-film{background:linear-gradient(180deg,oklch(94.5% .009 248),oklch(88.8% .013 248))!important}
  .pressin-film-panel li{min-height:62px!important}
  .project-reel{scroll-padding-left:20px}
  .project-reel-card{min-width:74vw}
  .contact h2{font-size:clamp(36px,11vw,48px)}
  footer p{font-size:12px;line-height:1.8}
  .footer-icp{font-size:11px;line-height:1.9}
  .polish-reveal{opacity:1;transform:none;transition:none}
}
@media (prefers-reduced-motion:reduce){
  .polish-reveal{opacity:1!important;transform:none!important;transition:none!important}
  body::before{display:none}
}

/* Mobile final audit 2026-06-28: readable story flow, no overlay collisions. */
@media (max-width:850px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  main,footer{margin-left:0}

  .mobile-header{
    z-index:36;
    height:58px;
    background:rgba(8,18,34,.94);
    border-bottom:1px solid rgba(169,204,245,.22);
    backdrop-filter:blur(14px);
  }
  .mobile-brand{
    line-height:58px;
    padding-left:18px;
    color:var(--surface);
    font:800 13px/58px "Inter","Noto Sans SC",sans-serif;
    letter-spacing:.08em;
  }
  .menu-button{
    z-index:46;
    top:9px;
    right:12px;
    width:48px;
    height:48px;
    min-width:48px;
    min-height:48px;
    border:1px solid rgba(185,213,245,.36);
    background:rgba(12,24,43,.94);
    box-shadow:0 12px 34px rgba(3,9,18,.28);
  }

  .site-menu{
    z-index:42;
    inset:58px 0 auto 0;
    max-height:calc(100svh - 58px);
    overflow:auto;
    padding:12px 14px 18px;
    background:rgba(7,16,30,.97);
    border-bottom:1px solid rgba(169,204,245,.24);
    transform:translateY(-118%);
    transition:transform .42s cubic-bezier(.16,1,.3,1);
    box-shadow:0 28px 70px rgba(3,9,18,.42);
  }
  .site-menu.open{transform:none}
  .menu-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    background:transparent;
  }
  .menu-grid a{
    min-height:56px;
    padding:12px 16px;
    background:rgba(231,239,248,.055);
    border:1px solid rgba(169,204,245,.16);
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:12px;
  }
  .menu-grid strong{
    font-size:clamp(23px,8vw,34px);
    line-height:.95;
    letter-spacing:-.055em;
  }
  .menu-grid span{
    font-size:13px;
    color:rgba(231,239,248,.74);
    white-space:nowrap;
  }
  .menu-contact{
    margin-top:12px;
    padding:14px 16px 2px;
    gap:6px;
  }
  .menu-contact a{font-size:24px;letter-spacing:-.03em}
  .menu-contact span{font-size:12px;color:rgba(231,239,248,.72)}

  .hero{
    height:auto;
    min-height:760px;
    padding-top:58px;
    display:grid;
    align-content:start;
    overflow:hidden;
    background:#07101e;
  }
  .hero::before{display:none}
  .hero::after{
    height:100%;
    background:
      linear-gradient(180deg,rgba(5,12,24,.2) 0%,rgba(5,12,24,.58) 42%,rgba(5,12,24,.97) 100%),
      linear-gradient(90deg,rgba(5,12,24,.72),rgba(5,12,24,.2));
  }
  .hero-bg{
    height:100%;
    object-position:center top;
    filter:saturate(.76) contrast(1.05) brightness(.72);
    transform:none;
  }
  .hero-statement{
    top:86px;
    left:18px;
    right:18px;
    font-size:clamp(56px,16.5vw,76px);
    line-height:.82;
    letter-spacing:-.075em;
    opacity:.96;
  }
  .hero-statement::after{
    margin-top:20px;
    max-width:18em;
    font-size:10px;
    line-height:1.65;
    letter-spacing:.22em;
  }
  .hero-jp{
    left:18px;
    right:18px;
    top:286px;
    font-size:clamp(30px,9vw,42px);
    line-height:1.28;
    letter-spacing:-.035em;
    text-shadow:0 16px 38px rgba(3,9,18,.45);
  }
  .hero-orbit{display:none}
  .hero-card{
    left:18px;
    right:18px;
    bottom:112px;
    width:auto;
    min-height:0;
    display:grid;
    grid-template-columns:48px 1fr;
    background:rgba(9,20,38,.9);
    border:1px solid rgba(169,204,245,.28);
    box-shadow:0 20px 58px rgba(3,9,18,.34);
  }
  .hero-card::after{display:none}
  .hero-card-index{
    padding:18px 10px;
    font-size:18px;
    border-right:1px solid rgba(169,204,245,.24);
  }
  .hero-card-copy{
    padding:18px 18px 20px;
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
  }
  .hero-card h1{
    font-size:clamp(34px,11vw,48px);
    line-height:.84;
    white-space:normal;
  }
  .hero-card p{
    font-size:13px;
    line-height:1.85;
    color:#dbe6f2;
  }
  .hero-card b{font-size:14px}
  .hero-controls{
    left:18px;
    right:18px;
    bottom:34px;
    justify-content:space-between;
    gap:12px;
  }
  .hero-controls button{
    width:56px;
    height:56px;
    min-width:56px;
    min-height:56px;
    background:rgba(11,23,42,.72);
  }
  .hero-controls span{
    font-size:22px;
    color:#eef5ff;
  }
  .hero-news{display:none!important}

  .section-intro h2,.record-heading h2,.history-heading h2{word-break:keep-all}
  .values,.business,.news{padding-left:18px;padding-right:18px}
  .history{padding-left:18px;padding-right:18px}
  .values-stage,.business-showcase,.company-band,.contact{max-width:100%}
  .business-nav button,.project-reel-controls button,.arrow-controls button{min-height:44px;min-width:44px}
}

@media (max-width:430px){
  .hero{min-height:735px}
  .hero-statement{font-size:clamp(52px,15.5vw,68px)}
  .hero-jp{top:270px}
  .hero-card{bottom:108px}
  .hero-card h1{font-size:clamp(32px,10.2vw,42px)}
  .hero-card p{font-size:12px;line-height:1.75}
}