@charset "UTF-8";
:root{--paper:#f5f4ef;--ink:#20221f;--line:#cecec5;--accent:#d6e544;--gutter:5.2vw}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"Helvetica Neue","Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #657408;outline-offset:6px}button{color:inherit}img{display:block;width:100%;height:100%;object-fit:cover}p{line-height:2;font-size:14px}h1,h2,h3,p{margin-top:0}::selection{background:var(--accent);color:var(--ink)}.skip{position:fixed;top:-100px;z-index:100;background:var(--accent);padding:15px}.skip:focus{top:10px}.header{height:100px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;background:var(--paper);position:relative;z-index:10}.logo{font-size:35px;font-weight:800;letter-spacing:-2px;line-height:1}.logo-dot{font-size:11px;vertical-align:top;margin-left:5px;letter-spacing:0}.header nav{display:flex;gap:34px;align-items:center;font-size:10px;font-weight:600;letter-spacing:.06em}.header nav a{padding:14px 0}.header nav a:hover{opacity:.55}.nav-contact{border-bottom:1px solid var(--ink)}.nav-contact span{margin-left:25px}.menu-toggle{display:none}.hero{padding:25px var(--gutter) 0}.hero-kicker{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.1em;margin:9px 0 45px}.hero h1{font-size:clamp(48px,7.8vw,125px);letter-spacing:-.065em;line-height:1.32;font-weight:750;margin:0 0 34px}.hero h1 span{display:block}.hero h1 span:nth-child(2){padding-left:17.5%}.hero-bottom{display:flex;justify-content:space-between;align-items:end;margin-bottom:45px}.hero-bottom p{font-size:13px;line-height:1.9;margin:0;letter-spacing:.04em}.scroll-link{font-size:9px;letter-spacing:.06em;display:flex;align-items:center;gap:30px}.scroll-link span{font-size:25px}.hero-image{height:620px;position:relative;overflow:hidden;background:#73898c}.hero-image img{filter:saturate(.62) brightness(.8);object-position:center 65%;animation:picture-in 1.5s ease-out}.hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 65%,#0006);pointer-events:none}.image-caption{position:absolute;bottom:26px;left:30px;right:30px;display:flex;justify-content:space-between;color:white;font-size:9px;letter-spacing:.1em;z-index:1}.image-statement{position:absolute;left:36px;top:40px;color:white;font-size:clamp(44px,7.5vw,110px);font-weight:500;letter-spacing:-.07em;line-height:.95}.section{padding:110px var(--gutter);scroll-margin-top:20px}.section-label{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:20px;font-size:10px;letter-spacing:.08em;margin-bottom:70px}.section-label span:last-child{letter-spacing:.1em}.philosophy-content{display:grid;grid-template-columns:1.15fr 1fr;gap:10%}.philosophy h2{font-size:clamp(28px,3.2vw,48px);line-height:1.65;letter-spacing:-.06em}.body-copy p{font-size:15px;line-height:2.3;margin-bottom:25px}.word-line{font-size:clamp(35px,7.4vw,110px);font-weight:700;letter-spacing:-.07em;white-space:nowrap;margin-top:85px;display:flex;justify-content:space-between;line-height:1}.word-line span{color:#888b7c}.projects{background:#e9e9e1}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:65px}.section-heading h2{font-size:clamp(48px,6.5vw,100px);font-weight:500;letter-spacing:-.065em;line-height:1; margin:0}.section-heading>p{font-size:14px;margin:0 0 4px}.project-photo{display:block;height:580px;position:relative;overflow:hidden}.project-photo img{filter:saturate(.65);transition:transform 1s}.project-photo:hover img{transform:scale(1.035)}.photo-link{position:absolute;bottom:25px;right:25px;background:var(--paper);padding:18px 22px;display:flex;gap:40px;font-size:10px}.photo-link span{font-size:17px}.project-meta{display:flex;align-items:center;gap:40px;padding:28px 0 35px;border-bottom:1px solid #bcbfb3}.project-meta h3{font-size:47px;letter-spacing:-.05em;font-weight:500;margin:0}.project-meta p{font-size:10px;line-height:1.9;margin:0}.project-meta p span{font-size:11px}.project-number{margin-left:auto;font-size:35px;font-weight:300;color:#808477}.story{display:grid;grid-template-columns:1fr 1.2fr;gap:8%;padding:80px 0 45px}.eyebrow{font-size:10px;letter-spacing:.08em;line-height:2}.story h3{font-size:clamp(24px,2.6vw,39px);line-height:1.7;letter-spacing:-.03em;margin-bottom:30px}.story p{max-width:530px;color:#4b5045}.story details{margin-top:30px}.story summary{font-size:12px;border-bottom:1px solid #aeb1a4;padding:18px 0;display:flex;justify-content:space-between;cursor:pointer}.story-detail{padding:25px 0}.story-detail h4{font-size:16px}.results{display:grid;grid-template-columns:1fr 1fr;gap:30px;border-top:1px solid #bcbfb3;padding-top:32px}.results>div+div{border-left:1px solid #bcbfb3;padding-left:40px}.results p{font-size:12px}.results strong{font-size:clamp(64px,8vw,115px);letter-spacing:-.065em;font-weight:500;line-height:1.1}.results strong span{font-size:20px;letter-spacing:0;margin-left:8px}.draft-note{font-size:10px;color:#636759;margin:24px 0 85px}.upcoming{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.canalis-art{height:340px;background:#374038;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#ecebda;position:relative;overflow:hidden}.canalis-art:before,.canalis-art:after{content:"";position:absolute;width:200%;height:75px;border:1px solid #818b77;transform:rotate(-38deg);opacity:.45}.canalis-art:after{height:180px}.canalis-name{font-family:inherit;font-weight:600;font-size:55px;letter-spacing:.13em;z-index:1}.canalis-tag{font-size:8px;letter-spacing:.23em;margin-top:15px;z-index:1}.upcoming-copy h3{font-size:30px;line-height:1.6;margin:20px 0}.upcoming-copy p{font-size:12px}.status{display:inline-flex;gap:9px;align-items:center;font-size:10px;margin-top:12px}.status i{width:6px;height:6px;border-radius:50%;background:#69834a}.approach{background:#20251f;color:#f1f1e7}.approach .section-label{border-color:#4b5146}.approach .section-heading>p{font-size:24px;line-height:1.6}.technology{display:grid;grid-template-columns:1fr 1.2fr;gap:9%;margin-top:85px}.tech-copy h3{font-size:30px;line-height:1.6}.tech-copy>p{color:#c3c9b9;font-size:13px;line-height:2.2}.tech-steps{margin-top:45px}.tech-steps button{display:flex;width:100%;border:0;border-top:1px solid #52594a;background:transparent;text-align:left;padding:23px 0;gap:25px;align-items:center;font-size:13px}.tech-steps button span{font-size:10px;color:#b9c1aa}.tech-steps button b{margin-left:auto;font-weight:400}.tech-steps button.active{color:var(--accent)}.demo-shell{padding:25px;background:#dce0d2;color:var(--ink);align-self:start;min-height:485px}.demo-top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.07em;padding-bottom:22px;border-bottom:1px solid #b8c0aa}.demo-top span:last-child{color:#5a664c}#demo-content{padding:28px 14px 10px;min-height:360px}.demo-step{font-size:10px;color:#616950;letter-spacing:.1em}.demo-shell h4{font-size:22px;line-height:1.5;margin:18px 0 22px;letter-spacing:-.03em}.demo-options{display:flex;flex-direction:column;gap:8px}.demo-option{padding:16px;border:1px solid #b6c0a6;background:transparent;display:flex;justify-content:space-between;font-size:12px;text-align:left}.demo-option.selected{background:#f7f8f0;border-color:#48563d}.demo-option .check{font-size:13px}.demo-option small{display:block;font-size:10px;color:#656f59;margin-top:7px}.demo-summary{font-size:11px;margin:18px 0 0}.demo-note{font-size:9px;line-height:1.7;color:#5c654e;text-align:center;border-top:1px solid #b8c0aa;padding-top:18px;margin-bottom:0}.demo-message{background:#f5f6ee;padding:18px;font-size:12px;line-height:1.9;margin-bottom:12px}.demo-message.reply{margin-left:28px;background:#c5cdb8}.task-row{border-bottom:1px solid #b8c0aa;display:flex;justify-content:space-between;padding:17px 0;font-size:12px}.task-row span{font-size:10px;color:#52613f}.services h2{font-size:clamp(40px,5vw,75px);line-height:1.5;letter-spacing:-.055em;margin-bottom:65px}.service-list details{border-top:1px solid var(--line)}.service-list details:last-child{border-bottom:1px solid var(--line)}summary{list-style:none}summary::-webkit-details-marker{display:none}.service-list summary{display:flex;align-items:center;gap:45px;cursor:pointer;padding:25px 0}.service-list summary>span:first-child{font-size:11px}.service-list h3{font-size:32px;letter-spacing:-.04em;margin:0}.service-en{font-size:11px;letter-spacing:.1em;margin-left:auto}.service-list b{font-weight:400;font-size:23px;margin-left:20px;transition:transform .2s}.service-list details[open] b{transform:rotate(45deg)}.service-list details>div{padding:0 60px 28px;max-width:780px}.service-list details p{font-size:13px}.service-tags{color:#757969;font-size:11px!important}.small-note{font-size:11px;color:#6c705f;margin-top:20px}.owner{display:grid;grid-template-columns:.65fr 1.4fr 1fr;gap:25px;margin-top:85px;align-items:start}.owner>span{font-size:10px;letter-spacing:.05em;padding-top:6px}.owner p{font-size:20px;line-height:1.8;letter-spacing:-.04em}.owner>div{font-size:12px;line-height:2;color:#646a5a}.company{padding-top:20px}.company-grid{display:grid;grid-template-columns:1fr 1fr;gap:10%}.company h2{font-size:42px;line-height:1.6;letter-spacing:-.06em}.businesses{display:flex;gap:20px;font-size:10px;margin:35px 0 50px;flex-wrap:wrap}.company-name{font-size:13px}.company-name span{font-size:9px;letter-spacing:.1em}.contact{background:var(--accent);padding-bottom:95px}.contact .section-label{border-color:#9da924}.contact-row{display:flex;justify-content:space-between;align-items:center}.contact h2{font-size:clamp(35px,5.4vw,80px);line-height:1.5;letter-spacing:-.055em;margin-bottom:30px}.contact-button{width:125px;height:125px;border:1px solid #647011;border-radius:50%;background:transparent;font-size:65px;transition:background .25s,transform .25s}.contact-button:hover{background:var(--ink);color:var(--accent);transform:rotate(45deg)}.text-contact{background:transparent;border:0;border-bottom:1px solid var(--ink);padding:16px 0;font-size:12px;margin-top:15px;min-width:230px;text-align:left}.text-contact span{float:right}.contact>p{font-size:13px}footer{padding:55px var(--gutter);display:flex;align-items:center;gap:40px}footer .logo{font-size:30px}footer>span{font-size:10px}footer>a:not(.logo){font-size:9px;margin-left:auto}footer small{font-size:8px;color:#6f7364}dialog{width:min(600px,calc(100% - 30px));max-height:90vh;border:0;padding:35px;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#172019b8;backdrop-filter:blur(5px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;font-size:11px;margin-bottom:30px}.dialog-close{border:0;background:none;font-size:30px;padding:5px}.dialog-head+h2{font-size:25px;line-height:1.5}.form-note{font-size:11px;color:#65695c}form label{display:block;font-size:12px;margin:20px 0}input,select,textarea{display:block;width:100%;background:transparent;border:1px solid #b7bbad;border-radius:0;padding:12px;margin-top:9px;color:var(--ink)}textarea{resize:vertical}.save-button{width:100%;border:0;background:var(--ink);color:var(--paper);padding:18px;font-size:13px}#form-status{font-size:12px;margin-top:15px;margin-bottom:0}@keyframes picture-in{from{transform:scale(1.04)}to{transform:scale(1)}}
@media(min-width:1600px){body{max-width:2000px;margin:auto}.hero-image{height:720px}}
@media(max-width:850px){:root{--gutter:6vw}.header{height:85px}.header nav{gap:20px;font-size:9px}.logo{font-size:29px}.hero-kicker span:last-child{display:none}.hero h1{font-size:9vw}.hero h1 span:nth-child(2){padding-left:9%}.hero-image{height:470px}.hero-bottom p{font-size:11px}.section{padding-top:80px;padding-bottom:80px}.section-label{margin-bottom:50px}.philosophy-content{gap:5%}.body-copy p{font-size:13px}.project-photo{height:450px}.story{gap:5%}.story h3{font-size:25px}.technology{gap:5%;grid-template-columns:1fr 1.2fr}.demo-shell{padding:20px}.approach .section-heading>p{font-size:18px}.owner{grid-template-columns:1fr 2fr}.owner>div{grid-column:2}.upcoming{gap:6%}.canalis-art{height:280px}.canalis-name{font-size:34px}.upcoming-copy h3{font-size:25px}footer{gap:25px;flex-wrap:wrap}}
@media(max-width:600px){html{scroll-padding-top:20px}.header{height:78px}.logo{font-size:29px}.menu-toggle{display:flex;align-items:center;gap:18px;border:0;background:none;padding:12px 0;font-size:10px}.menu-toggle span{font-size:22px}.header nav{display:none;position:absolute;top:78px;left:0;right:0;background:var(--paper);padding:25px var(--gutter) 35px;border-bottom:1px solid var(--line)}.header nav.open{display:flex;flex-direction:column;align-items:stretch;gap:10px;font-size:12px}.nav-contact{display:flex;justify-content:space-between}.hero{padding-top:22px}.hero-kicker{font-size:8px;margin-bottom:35px}.hero h1{font-size:10.2vw;line-height:1.5;letter-spacing:-.07em;margin-bottom:26px}.hero h1 span:nth-child(2){padding-left:4%}.hero-bottom{display:block;margin-bottom:28px}.hero-bottom p{font-size:10px;line-height:2.1}.scroll-link{font-size:8px;margin-top:26px;justify-content:space-between}.scroll-link span{font-size:20px}.hero-image{height:470px;margin:0 calc(-1 * var(--gutter));}.hero-image img{object-position:61% center}.image-statement{font-size:60px;left:6vw;top:30px}.image-caption{left:6vw;right:6vw;bottom:22px;font-size:7px;gap:20px}.image-caption span:last-child{display:none}.section{padding-top:60px;padding-bottom:60px}.section-label{font-size:8px;margin-bottom:40px;padding-top:16px}.philosophy-content{display:block}.philosophy h2{font-size:28px;margin-bottom:32px}.body-copy{margin-left:12%}.body-copy p{font-size:12px;line-height:2.2}.word-line{font-size:8.3vw;margin-top:45px}.section-heading{display:block;margin-bottom:35px}.section-heading h2{font-size:47px}.section-heading>p{font-size:11px;margin-top:22px}.project-photo{height:350px}.photo-link{right:15px;bottom:15px;font-size:8px;padding:13px;gap:25px}.project-meta{gap:25px;padding:22px 0}.project-meta h3{font-size:32px}.project-meta p{font-size:8px}.project-meta p span{font-size:9px}.project-number{font-size:25px}.story{display:block;padding:40px 0 25px}.story>.eyebrow{display:block;margin-bottom:25px;font-size:8px}.story h3{font-size:24px}.story p{font-size:12px}.results{gap:12px;padding-top:20px}.results>div+div{padding-left:15px}.results p{font-size:9px;line-height:1.8;min-height:33px}.results strong{font-size:43px}.results strong span{font-size:11px;margin-left:3px}.draft-note{font-size:8px;margin-bottom:45px}.upcoming{display:block}.canalis-art{height:270px}.canalis-name{font-size:48px}.upcoming-copy{padding-top:28px}.upcoming-copy h3{font-size:26px}.approach .section-heading>p{font-size:20px;margin-top:28px}.technology{display:block;margin-top:40px}.tech-copy h3{font-size:26px}.tech-copy>p{font-size:12px}.tech-steps{margin-top:25px;margin-bottom:30px}.tech-steps button{padding:19px 0}.demo-shell{min-height:450px}.demo-shell h4{font-size:21px}#demo-content{padding:25px 5px 10px;min-height:340px}.services h2{font-size:40px;margin-bottom:35px}.service-list summary{gap:17px;padding:22px 0}.service-list h3{font-size:25px}.service-en{font-size:8px}.service-list b{margin-left:0;font-size:18px}.service-list details>div{padding:0 0 20px 30px}.service-list details p{font-size:12px}.small-note{font-size:9px}.owner{display:block;margin-top:45px}.owner p{font-size:20px;margin-top:20px}.owner>div{font-size:11px}.company{padding-top:0}.company-grid{display:block}.company h2{font-size:33px}.company-grid p{font-size:12px}.businesses{gap:17px;font-size:8px;margin:25px 0 35px}.contact-row{gap:10px}.contact h2{font-size:32px;letter-spacing:-.07em}.contact-button{flex-shrink:0;width:60px;height:60px;font-size:33px}.contact>p{font-size:11px;max-width:250px}.contact .section-label{font-size:7px}.text-contact{font-size:11px}footer{padding-top:35px;padding-bottom:35px;gap:25px}footer .logo{width:50%;font-size:28px}footer>span{font-size:9px}footer>a:not(.logo){margin-left:0;font-size:8px}footer small{margin-left:auto;font-size:7px}dialog{padding:24px}.dialog-head+h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}