:root{--black:#11131a;--white:#fffdf8;--blue:#4266ed;--line:#2025322b}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--black);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid #1d58da;outline-offset:5px}
.skip{position:fixed;z-index:100;top:-80px;left:16px;background:#fff;color:#111;padding:12px 16px}.skip:focus{top:16px}
.wrap{width:min(100% - 96px,1400px);margin:auto}
.progress{position:fixed;z-index:100;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,#ff537e,#ffc43d,#49dac8,#6b62ff);transform:scaleX(0);transform-origin:left;pointer-events:none}
.header{position:fixed;z-index:50;top:0;left:0;width:100%;height:76px;padding:0 48px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:#11131ae8;color:#fff;transition:height .3s,background .3s,backdrop-filter .3s}
.header.scrolled{height:64px;background:#11131af0;backdrop-filter:blur(20px)}
.brand{font-size:23px;font-weight:850;letter-spacing:-.1em;width:max-content}.brand span{color:#ffcf5d}
.header nav{display:flex;gap:40px}.header nav a,.lang{font-size:12px;font-weight:700;color:#ffffffb8;transition:color .2s}.header nav a:hover,.lang:hover{color:#fff}.lang{justify-self:end}
.hero{position:relative;isolation:isolate;overflow:hidden;height:max(740px,100svh);min-height:700px;color:#151521;background:linear-gradient(125deg,#ff5b76 0%,#ff9c4d 18%,#f6df49 37%,#4edabf 56%,#5b8dec 76%,#9a66ed 100%);background-size:160% 160%;animation:color-flow 17s ease-in-out infinite alternate}
.hero:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,#ffffff1a,transparent 55%);pointer-events:none}
.hero-grid{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,transparent 49.9%,#ffffff29 50%,transparent 50.1%);background-size:18vw 100%;opacity:.6}
.hero-inner{height:100%;position:relative;display:flex;flex-direction:column;justify-content:center;padding-top:70px}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:11px;font-weight:850;letter-spacing:.2em;margin:0 0 33px}.eyebrow i{width:34px;height:2px;background:currentColor}
.hero-title{width:max-content;max-width:100%;font-size:clamp(108px,17vw,240px);line-height:.95;letter-spacing:-.12em;font-weight:850;margin:0 0 45px}.hero-title span{display:block}.hero-title b{font-style:normal;color:#fff;text-shadow:0 2px 30px #0002}
.hero-title-en{font-size:clamp(78px,12vw,175px);letter-spacing:-.09em}
.hero-details{display:flex;align-items:baseline;gap:45px}.hero-details strong{font-size:clamp(22px,2.7vw,36px);letter-spacing:-.04em}.hero-details>span{font-size:12px;letter-spacing:.06em;line-height:2;font-weight:650}.hero-details em{padding:0 10px;font-style:normal;color:#fff}
.enter{opacity:0;transform:translateY(45px);animation:enter .95s cubic-bezier(.16,1,.3,1) forwards}.hero-title.enter{animation-delay:.12s}.hero-details.enter{animation-delay:.35s}
.scroll-cue,.hero-count{position:absolute;bottom:40px;font-size:10px;letter-spacing:.18em;font-weight:850}.scroll-cue{left:48px;display:flex;align-items:center;gap:18px}.scroll-cue i{width:68px;height:2px;background:#11131a55;position:relative;overflow:hidden}.scroll-cue i:after{content:"";position:absolute;inset:0;background:#11131a;transform:translateX(-100%);animation:scan 2.3s ease-in-out infinite}.hero-count{right:48px}
.section{padding:clamp(100px,12vw,175px) 0}.light{color:var(--black)}.dark{color:#fff}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:25px;padding-top:20px;margin-bottom:90px;border-top:1px solid currentColor}.section-head>span{font-size:11px;letter-spacing:.17em;font-weight:850;white-space:nowrap;opacity:.62}.section-head h2{font-size:clamp(32px,5vw,72px);line-height:1.18;letter-spacing:-.07em;text-align:right;margin:0}.section-head b{color:#f86370}
.profile{background:#fff9e9}.profile-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:9vw;align-items:start}.profile-lead{font-size:clamp(30px,3.6vw,53px);font-weight:750;letter-spacing:-.055em;line-height:1.65;margin:0}.prose{padding-top:10px}.prose p{font-size:clamp(16px,1.5vw,20px);line-height:2.1;color:#525661;margin:0 0 28px}
.keywords{display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap;margin-top:145px;padding:30px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:11px;font-weight:850;letter-spacing:.12em}.keywords span:nth-of-type(1){color:#ed5878}.keywords span:nth-of-type(2){color:#d17e16}.keywords span:nth-of-type(3){color:#2777b5}.keywords span:nth-of-type(4){color:#794dd0}.keywords i{width:5px;height:5px;border-radius:50%;background:#9d9aaa}
.work{background:#26214c;position:relative;overflow:hidden}.work:before{content:"";position:absolute;inset:auto -25% -50% auto;width:100%;height:100%;background:linear-gradient(125deg,transparent,#5d50bc70,#cc5da970);filter:blur(100px);pointer-events:none}.work>.wrap{position:relative}.work .section-head b{color:#ffca57}
.project{position:relative;isolation:isolate;display:block;min-height:650px;padding:42px 50px;overflow:hidden;border:1px solid #ffffff80;background:linear-gradient(120deg,#ff6580,#ff9f72 35%,#ffd36f 65%,#9fe2c8);background-size:180% 180%;box-shadow:0 30px 100px #17123370;transition:transform .5s,border-color .3s,background-position .6s;color:#1d1a2a}.project:hover{transform:translateY(-8px);border-color:#fff;background-position:100% 50%}.project:after{content:"";position:absolute;z-index:-1;inset:0;background:repeating-linear-gradient(90deg,#ffffff27 0 1px,transparent 1px 75px);mix-blend-mode:soft-light}.project-glow{position:absolute;z-index:-1;inset:0;background:radial-gradient(550px circle at var(--px,75%) var(--py,40%),#ffffff9c,transparent 68%);opacity:.5;transition:opacity .3s}.project:hover .project-glow{opacity:1}
.project-top,.project-foot{display:flex;justify-content:space-between;gap:35px}.project-top{font-size:11px;font-weight:850;letter-spacing:.17em}.project-main{display:flex;justify-content:space-between;align-items:end;min-height:430px}.project-main small{font-size:12px;font-weight:750;letter-spacing:.1em}.project-main h3{font-size:clamp(88px,13vw,180px);line-height:.83;letter-spacing:-.11em;margin:28px 0 44px}.project-main h3 strong{color:#fff;text-shadow:0 4px 25px #702e6d44}.round-arrow{width:75px;height:75px;display:grid;place-items:center;border:1px solid #1d1a2a;border-radius:50%;font-size:34px;font-weight:300;margin-bottom:40px;transition:background .3s,color .3s,transform .3s}.project:hover .round-arrow{background:#1d1a2a;color:#fff;transform:rotate(45deg)}.project-foot{align-items:end;padding-top:24px;border-top:1px solid #1d1a2a8a}.project-foot p{font-size:15px;line-height:1.9;max-width:590px;margin:0}.project-foot>span{font-size:11px;font-weight:850;letter-spacing:.12em;white-space:nowrap}
.media{background:#dcf4ef}.media .section-head b{color:#287eb0}.media-list{border-top:1px solid var(--line)}.media-row{display:grid;grid-template-columns:70px 1fr 45px;gap:25px;align-items:center;min-height:195px;padding:25px 10px;border-bottom:1px solid var(--line);transition:background .3s,padding .3s}.media-row:hover{background:#ffffffa8;padding-left:25px;padding-right:25px}.num{font-size:14px;color:#307b88;align-self:start;padding-top:8px}.media-row>span:nth-child(2){display:flex;flex-direction:column;gap:18px}.media-row small{font-size:11px;letter-spacing:.14em;color:#48737e;font-weight:850}.media-row strong{font-size:clamp(21px,2.5vw,35px);line-height:1.5;letter-spacing:-.04em}.media-row i{font-size:29px;color:#236f9c;font-style:normal;transition:transform .3s}.media-row:hover i{transform:translate(5px,-5px)}
.contact{position:relative;overflow:hidden;min-height:700px;background:linear-gradient(125deg,#4139a8,#4358cb 35%,#348ebd 70%,#21a89e);background-size:250% 250%;animation:color-flow 16s ease-in-out infinite alternate}.contact .section-head b{color:#ffdf6d}.contact-intro{font-size:clamp(20px,2.5vw,33px);margin:0 0 55px}.email{display:flex;justify-content:space-between;align-items:center;gap:20px;width:min(100%,1000px);padding-bottom:25px;border-bottom:1px solid #ffffffb0;font-size:clamp(37px,7vw,100px);font-weight:780;letter-spacing:-.075em;transition:color .3s,border-color .3s}.email:hover{color:#ffe2a2;border-color:#ffe2a2}.email i{font-size:clamp(32px,4vw,60px);font-style:normal;font-weight:300;transition:transform .3s}.email:hover i{transform:translate(8px,-8px)}.social{display:flex;gap:42px;margin-top:45px}.social a{font-size:14px}.social a:hover{text-decoration:underline;text-underline-offset:4px}
footer{background:#11131a;color:#ffffffae}footer .wrap{min-height:95px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:11px;letter-spacing:.1em}
.reveal{opacity:0;transform:translateY(45px);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1)}.reveal.visible{opacity:1;transform:translateY(0)}.media-row:nth-child(2).reveal{transition-delay:.12s}
@keyframes enter{to{opacity:1;transform:translateY(0)}}@keyframes color-flow{from{background-position:0 30%}to{background-position:100% 70%}}@keyframes scan{to{transform:translateX(100%)}}
@media(max-width:1000px){.wrap{width:min(100% - 56px,1400px)}.header{padding:0 28px}.hero-title{font-size:clamp(95px,18vw,180px)}.hero-title-en{font-size:clamp(75px,13vw,140px)}.profile-grid{gap:5vw}.scroll-cue{left:28px}.hero-count{right:28px}}
@media(max-width:700px){.wrap{width:min(100% - 40px,1400px)}.header{height:65px;padding:0 20px;grid-template-columns:auto 1fr auto}.header nav{justify-content:center;gap:18px}.header nav a{font-size:10px}.header nav a:nth-child(2),.header nav a:nth-child(3){display:none}.lang{font-size:11px}.hero{height:780px;min-height:680px}.hero-inner{justify-content:flex-end;padding-bottom:160px}.hero-title{font-size:clamp(80px,18vw,135px);margin-bottom:28px}.hero-title-en{font-size:clamp(64px,14vw,105px)}.hero-details{display:block}.hero-details strong{display:block;margin-bottom:10px}.hero-details>span{font-size:10px;display:block;max-width:350px}.hero-details em{padding:0 5px}.scroll-cue{left:20px;bottom:32px}.hero-count{right:20px;bottom:32px}.section-head{display:block;margin-bottom:55px}.section-head h2{text-align:left;margin-top:18px}.profile-grid{display:block}.profile-lead{margin-bottom:40px}.keywords{margin-top:65px;justify-content:flex-start}.project{padding:28px;min-height:560px}.project-main{min-height:350px}.project-main h3{font-size:clamp(75px,14vw,120px)}.round-arrow{width:50px;height:50px;font-size:25px}.project-foot{display:block}.project-foot>span{display:block;margin-top:20px}.media-row{grid-template-columns:35px 1fr 25px;gap:10px;min-height:165px}.media-row i{font-size:22px}.contact{min-height:600px}.email{font-size:clamp(30px,7vw,55px)}}
@media(max-width:430px){.header nav a:first-child{display:none}.header nav{justify-content:flex-end;margin-right:20px}.eyebrow{font-size:9px}.hero-title{font-size:19vw}.hero-title-en{font-size:15vw}.project-main h3{font-size:75px}.email{font-size:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal,.enter{opacity:1!important;transform:none!important}}
