*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;text-decoration:none}img,video{max-width:100%;display:block}html{font-size:62.5%}:root{--color-white:#fff;--color-jet:#333;--color-itense-grey:#8d8d8d;--color-dim-grey:#d6d6d6}h1{font-family:"NotoSansJP",sans-serif;font-weight:800;font-size:6.4rem;color:var(--color-jet)}h2{font-family:"NotoSansJP",sans-serif;font-weight:800;font-size:3rem;color:var(--color-jet);margin:0 0 2rem}h2 span{color:var(--color-dim-grey)}h3,.home p{font-family:"Inconsolata",sans-serif;font-weight:400;font-size:2.4rem;color:var(--color-jet)}h4{font-family:"Inconsolata",sans-serif;font-weight:400;font-size:1.6rem;color:var(--color-jet)}p{font-family:"NotoSansJP",sans-serif;font-weight:400;font-size:1.8rem;color:var(--color-jet)}.home p{color:var(--color-white);opacity:0;transition:opacity .3s ease}.content a{text-decoration:underline}.bot-awake{display:none}.home p span{opacity:0}.bot-sleep,.bot-awake,.bot{cursor:pointer;transition:opacity .2s ease}.bot-function{font-family:"Inconsolata",sans-serif;font-weight:500;font-size:1.4rem;color:var(--color-itense-grey);margin:.5rem 0 0}.bot-message div{display:flex;gap:1rem}.bot-message .alert{font-family:"Inconsolata",sans-serif;font-weight:400;font-size:1.6rem;color:var(--color-jet);background:var(--color-white);border:1px solid var(--color-jet);padding:1rem;display:flex;align-items:center}.bot-message .message{font-family:"Inconsolata",sans-serif;font-weight:400;font-size:1.6rem;color:var(--color-jet);background:var(--color-white);padding:1rem;display:flex;align-items:center;position:relative;opacity:0;overflow:hidden}.bot-message .message::before{content:"";position:absolute;inset:0;border:1px solid var(--color-jet);transform:scaleX(0);transform-origin:left;transition:transform .3s ease;pointer-events:none}.bot-message .message.is-active{opacity:1}.bot-message .message.is-active::before{transform:scaleX(1)}.bot-message svg{width:71px;height:71px;flex-shrink:0}.eye{transition:transform .12s ease-out;transform-origin:center}body{background-image:linear-gradient(rgba(51,51,51,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(51,51,51,.025) 1px,transparent 1px);background-size:10px 10px}header{position:fixed;top:0;background:var(--color-white);border-bottom:1px solid var(--color-dim-grey);padding:1rem 2rem;width:100%;z-index:2}footer{margin:10rem 0 0;background:var(--color-white);padding:1rem 2rem;width:100%;display:flex;justify-content:end;border-top:1px solid var(--color-dim-grey)}footer p{font-family:"Inconsolata",sans-serif;font-size:1.4rem}nav ul{list-style:none;display:flex;justify-content:end;gap:3rem}nav a{font-family:"Inconsolata",sans-serif;font-weight:500;font-size:1.6rem;display:flex;align-items:center;gap:.4rem;padding:.4rem .6rem;border:1px solid transparent;color:var(--color-jet);position:relative;overflow:hidden}nav a::before{content:"";position:absolute;inset:0;background:var(--color-jet);transform:scaleX(0);transform-origin:left;transition:transform .25s ease;z-index:0}nav a>*{position:relative;z-index:1}nav a:hover::before{transform:scaleX(1)}nav a:hover{border-color:var(--color-jet);color:var(--color-white)}nav a svg{flex-shrink:0}nav a svg path{fill:var(--color-itense-grey);transition:fill .15s ease}nav a:hover svg path{fill:var(--color-white)}nav a:focus-visible{outline:2px solid var(--color-jet);outline-offset:2px}.back-button{display:flex;justify-content:start;flex-grow:1}.burger-toggle{display:none;background:none;border:none;cursor:pointer;z-index:3}.burger-close{display:none}body.home{background-color:var(--color-jet);background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:10px 10px;color:var(--color-white)}body.home main{height:100vh;font-size:2.4rem;font-family:"Inconsolata",sans-serif;font-weight:400;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.screen-wipe{position:fixed;inset:0;background:var(--color-white);transform:scaleX(0);transform-origin:left;z-index:9999;pointer-events:none;transition:transform .6s cubic-bezier(.4,0,.2,1)}.screen-wipe.is-active{transform:scaleX(1)}body.projects{display:flex;flex-direction:column;align-items:center}body.projects main{max-width:1024px}.owner{margin:10rem 0}.titles,.project-tags{display:flex;flex-wrap:wrap;gap:0 1rem}.titles h3:not(:last-of-type),.project-tags h4:not(:last-of-type),.project-tags h3:not(:last-of-type){padding:0 1rem 0 0;border-right:1px solid var(--color-dim-grey)}.welcome{display:flex;align-items:center;gap:5rem}.welcome p:not(.bot-function){font-size:2.4rem}.welcome p:not(:last-of-type){margin:0 0 4rem}.works{margin:10rem 0 0;display:flex;flex-direction:column}.works h2:not(:first-of-type){margin:10rem 0 2rem}.case-studies,.research,.fencing{height:30rem;display:flex;gap:2rem}.research article,.fencing article{max-width:32.8rem}article{border:1px solid var(--color-jet)}article a{display:flex;flex-direction:column;height:100%}.card-title{background:var(--color-jet);padding:1rem;display:flex;align-items:center;gap:1rem}.card-title h3{color:var(--color-white)}.card-body{position:relative;overflow:hidden;background:var(--color-white);padding:1.5rem;display:flex;flex-direction:column;flex:1}.card-body::before{content:"";position:absolute;inset:0;background:var(--color-jet);transform:scaleY(0);transform-origin:top;transition:transform .3s ease;z-index:0}.card-body>*{position:relative;z-index:1}article a:hover .card-body::before{transform:scaleY(1)}article a:hover .card-body p,article a:hover .card-body h4{color:var(--color-white)}.card-body p{flex-grow:1}body.project-page main{display:flex;flex-direction:column;align-items:center}body.project-page .container{width:100%;max-width:1001px}.project-title{margin:10rem 0 5rem}.project-intro{margin:5rem 0 0}.project-intro p{font-size:2.4rem}.project-intro p:not(:last-of-type){margin:0 0 4rem}.project-question{margin:10rem 0 0;font-size:4.8rem;font-weight:800}.highlight{margin:10rem 0 0;padding:5rem 1rem;width:100%;background:var(--color-jet);display:flex;flex-direction:column;align-items:center}.highlight .container{display:flex;align-items:start;justify-content:space-between}.highlight :is(.left-col,.right-col){flex-grow:1;max-width:45rem}.highlight :is(span,h2,p){color:var(--color-white)}.highlight-list{display:flex;flex-direction:column;align-items:start;gap:2rem}.highlight-list p{font-family:"Inconsolata",sans-serif;font-size:2rem;font-weight:400;width:100%}.highlight-list p:not(:last-of-type){padding:0 0 2rem;border-bottom:1px solid var(--color-white)}.highlight-list p.highlight-subtitle{font-family:"NotoSansJP",sans-serif;font-weight:800;border:none;padding:0}.content{margin:10rem 0 0}.content p:not(:last-of-type){margin:0 0 1.5rem}.content img{width:100%;margin:3rem 0 0;border:1px solid var(--color-dim-grey)}.content .bot-message{margin:3rem 0 0}.highlight .bot-message{margin:5rem 0 0}.highlight .bot-message rect:first-of-type{fill:var(--color-white)}.highlight .bot-message rect:not(:first-of-type){fill:var(--color-jet)}@media (max-width:1040px){main{padding:0 1.5rem}header nav{padding:0 3rem}}@media (max-width:900px){.case-studies,.research,.fencing{flex-direction:column;height:auto}.case-studies article,.research article,.fencing article{width:100%;max-width:100%}.welcome-bot{display:none}.card-body .project-tags{margin:1rem 0 0}.bot-function{display:none}.highlight .container{flex-direction:column;gap:5rem}.highlight :is(.left-col,.right-col){width:100%;max-width:none}.bot-message .message{width:auto;max-width:100%;height:auto}}@media (max-width:600px){header{display:flex;align-items:center;justify-content:space-between}.burger-toggle{display:block;margin-left:auto}.back-button{display:none}nav{position:fixed;inset:0;background:var(--color-white);transform:translateY(-100%);transition:transform .4s ease;z-index:2}header.is-open nav{transform:translateY(0)}nav ul{height:100%;flex-direction:column;justify-content:center;align-items:flex-start;gap:3rem;width:fit-content;margin:0 auto}header.is-open .burger-open{display:none}header.is-open .burger-close{display:block}}@media (max-width:480px){h1{font-size:4rem}h2{font-size:2.5rem}h3{font-size:2rem}h4{font-size:1.4rem}p{font-size:1.6rem}nav a{font-size:2.4rem}.titles h3:not(:last-of-type){border-right:none;padding:0}.welcome p:not(.bot-function),.project-intro p{font-size:2rem}.welcome p:not(:last-of-type),.project-intro p:not(:last-of-type){margin:0 0 2.5rem}.owner{margin:10rem 0 5rem}.works{margin:5rem 0 0}.works h2:not(:first-of-type){margin:5rem 0 2rem}.bot-message{display:none}.project-question{margin:5rem 0 0;font-size:3rem}.highlight-list p{font-size:1.6rem}.content{margin:5rem 0 0}}