*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:#f5f3ed;color:#29352f;font-family:'Noto Sans TC',sans-serif;font-size:16px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #a34d33;outline-offset:7px}::selection{background:#d9dece}header,main,footer{max-width:1440px;margin:auto}header{height:126px;display:flex;align-items:center;justify-content:space-between;padding:0 6.25%}.brand{font-family:'Noto Serif TC',serif;font-size:37px;font-weight:600;display:flex;align-items:center;letter-spacing:-5px}.brand>span{color:#a64e35}.brand small{font-family:Arial,sans-serif;font-size:10px;line-height:1.6;letter-spacing:1.7px;font-weight:400;margin-left:28px}nav{display:flex;align-items:center;gap:35px;font-size:14px}nav a{transition:color .2s}nav a:hover{color:#a34d33}.nav-contact{padding:13px 0;border-bottom:1px solid #29352f}.nav-contact span{margin-left:24px}.hero{padding:35px 6.25% 0}.hero-top{border-top:1px solid #b7bcb1;padding-top:22px;display:flex;justify-content:space-between}.eyebrow{font-family:Arial,sans-serif;font-size:12px;letter-spacing:1.8px;line-height:1.8;margin:0}.edition{font-size:12px;letter-spacing:1px;color:#747b71}.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:6%;align-items:center;padding:64px 0 72px}.intro{font-size:14px;letter-spacing:3px;margin:0 0 26px}h1,h2,h3,p{margin-top:0}h1,h2{font-family:'Noto Serif TC',serif;font-weight:400}h1{font-size:clamp(58px,5.7vw,82px);line-height:1.38;letter-spacing:.05em;margin-bottom:24px}.serif-accent{color:#778068}.hero-description{font-size:15px;line-height:2.1;color:#677064;letter-spacing:.5px;margin-bottom:29px}.primary-link{display:inline-flex;align-items:center;gap:46px;font-size:14px;padding-bottom:12px;border-bottom:1px solid #858d7c}.primary-link span{font-size:24px;transition:transform .2s}.primary-link:hover span{transform:translate(4px,4px)}.diagram{background:#e9ecdf;aspect-ratio:1.11;position:relative;padding:28px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;background-image:linear-gradient(#6b785409 1px,transparent 1px),linear-gradient(90deg,#6b785409 1px,transparent 1px);background-size:24px 24px}.diagram-heading,.diagram-caption{display:flex;justify-content:space-between;font-family:Arial,sans-serif;font-size:10px;letter-spacing:1.4px;color:#6a745e}.diagram-caption{font-size:12px;letter-spacing:1px}.diagram-body{position:relative;display:flex;align-items:center;justify-content:center;height:240px}.data-input,.data-output{width:65px;position:relative;display:grid;gap:8px;z-index:1}.data-input{grid-template-columns:repeat(3,1fr);transform:rotate(-8deg)}.data-input span,.data-output span{position:absolute;top:-27px;left:0;font:9px Arial;letter-spacing:1px;color:#778165}.data-input i{height:15px;background:#859274;border:1px solid #798768}.data-input i:nth-child(3n){background:transparent;transform:translateY(-10px)}.data-input i:nth-child(4n){opacity:.3}.data-input i:nth-child(5){transform:translate(-8px,4px)}.logic{flex-shrink:0;border:1px solid #839074;background:#e9ecdf;width:155px;height:155px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;box-shadow:0 0 0 16px #e9ecdf,0 0 0 17px #8c987b50;z-index:2}.logic span{font:58px 'Noto Serif TC',serif;line-height:1.5}.logic small{font:9px Arial;letter-spacing:1.5px;color:#758168}.connection{height:1px;background:#839074;width:40px;min-width:20px}.connection.last:after{content:'';float:right;width:6px;height:6px;border-right:1px solid #839074;border-top:1px solid #839074;transform:rotate(45deg) translate(-1px,-3px)}.data-output{width:43px;gap:6px}.data-output b{height:12px;background:#5b6b51}.data-output b:nth-of-type(2){opacity:.75}.data-output b:nth-of-type(3){opacity:.55}.data-output b:nth-of-type(4){opacity:.35}.hero-bottom{border-top:1px solid #b7bcb1;border-bottom:1px solid #b7bcb1;padding:21px 0;display:flex;justify-content:space-between;font-family:Arial,sans-serif;font-size:11px;letter-spacing:1.3px}.hero-bottom em{font-style:normal;color:#abb09f;margin:0 14px}.hero-bottom a{font-family:'Noto Sans TC',sans-serif;font-size:12px}.hero-bottom a span{margin-left:30px}.section{padding:110px 6.25%}.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:53px}.section-head h2{font-size:36px;line-height:1.65;margin:20px 0 0}.section-head>p{font-size:14px;line-height:2;color:#6c7367;margin:0 0 8px}.services{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #b7bcb1}.services article{padding:34px 35px 34px 0;border-bottom:1px solid #b7bcb1;position:relative}.services article:nth-child(even){padding-left:38px;border-left:1px solid #b7bcb1}.services article:nth-child(odd){padding-right:38px}.number{font-family:Georgia,serif;font-style:italic;font-size:15px;color:#8c927f;position:absolute;right:30px;top:36px}.service-title{margin-bottom:23px}.service-title h3{font-family:'Noto Serif TC',serif;font-size:25px;font-weight:500;margin-bottom:10px;letter-spacing:1px}.service-title>span{font:10px Arial;letter-spacing:1.6px;color:#7e8678}.services p{font-size:14px;line-height:1.95;color:#677064}.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.tags span{font-size:12px;border:1px solid #ccd0c2;padding:5px 10px;color:#697460}.about{background:#e9ecdf;display:grid;grid-template-columns:1fr 1.4fr;gap:7%;padding-top:85px;padding-bottom:85px}.vertical-note{writing-mode:vertical-rl;font:25px 'Noto Serif TC',serif;letter-spacing:8px;margin-top:42px;color:#8a927d}.about h2{font-size:36px;line-height:1.7;margin:0 0 28px}.about-copy>p{font-size:15px;line-height:2.1;color:#63705c;max-width:510px}.principles{display:flex;gap:0;margin-top:32px;padding-top:23px;border-top:1px solid #bec5b2;font-size:13px}.principles span+span:before{content:'/';margin:0 23px;color:#9fa88f}.contact{display:flex;align-items:center;justify-content:space-between;gap:35px}.contact h2{font-size:38px;line-height:1.65;margin:22px 0}.contact p{font-size:14px;color:#6c7566;line-height:2}.contact-action{text-align:center;min-width:230px}.contact-mark{display:flex;align-items:center;justify-content:center;border:1px solid #b4bdab;border-radius:50%;width:100px;height:100px;font:44px Arial;margin:0 auto 24px;color:#617051}.contact-action .contact-placeholder{margin-bottom:10px;font-size:14px}.contact-action small{font:10px Arial;letter-spacing:1.4px;color:#7e8776}footer{border-top:1px solid #b7bcb1;display:flex;align-items:center;justify-content:space-between;padding:30px 6.25%;font-size:12px;color:#7c8374}footer .brand{font-size:28px}footer>a:last-child{font:10px Arial;letter-spacing:1.4px}.skip{position:absolute;top:-60px;left:15px;z-index:5;padding:12px;background:#29352f;color:white}.skip:focus{top:10px}@media(min-width:1500px){header,.hero,.section,footer{padding-left:90px;padding-right:90px}}@media(max-width:850px){header{height:100px}nav{gap:20px}.hero-grid{gap:4%;padding-top:45px;padding-bottom:50px}.diagram{padding:20px;aspect-ratio:.85}.logic{width:112px;height:112px}.logic span{font-size:42px}.data-input{width:40px;gap:4px}.data-input i{height:11px}.connection{width:25px}.data-output{width:28px}.diagram-heading{font-size:8px}.diagram-caption{font-size:10px;letter-spacing:0}.hero h1{font-size:60px}.section{padding-top:75px;padding-bottom:75px}.section-head h2,.about h2,.contact h2{font-size:30px}.about{grid-template-columns:.8fr 1.5fr}.principles span+span:before{margin:0 12px}}@media(max-width:600px){header{height:95px}.brand{font-size:30px}.brand small{font-size:8px;margin-left:18px;letter-spacing:1px}nav{gap:20px}nav a{font-size:12px}nav a:first-child{display:none}.nav-contact span{margin-left:8px}.hero{padding-top:15px}.hero-top .eyebrow{font-size:9px;letter-spacing:1px}.edition{display:none}.hero-grid{grid-template-columns:1fr;padding:38px 0 32px;gap:38px}.intro{font-size:12px;letter-spacing:2px;margin-bottom:18px}.hero h1{font-size:64px;line-height:1.35;margin-bottom:20px}.hero-description{font-size:14px}.diagram{aspect-ratio:1.3;padding:24px}.diagram-heading{font-size:9px}.logic{width:124px;height:124px}.data-input{width:50px;gap:6px}.data-output{width:33px}.connection{width:40px}.diagram-body{height:180px}.diagram-caption{font-size:11px}.hero-bottom>span{font-size:8px;letter-spacing:.6px}.hero-bottom em{margin:0 5px}.hero-bottom>a{font-size:10px}.hero-bottom a span{margin-left:5px}.section{padding-top:65px;padding-bottom:65px}.section-head{display:block;margin-bottom:35px}.section-head h2,.about h2,.contact h2{font-size:29px}.section-head>p{margin-top:20px}.services{grid-template-columns:1fr}.services article:nth-child(n){padding:30px 0;border-left:0}.number{right:5px}.service-title h3{font-size:24px}.services p{font-size:15px}.about{grid-template-columns:1fr;gap:30px}.vertical-note{display:none}.about-copy>p{font-size:15px}.contact{display:block}.contact-action{text-align:left;margin-top:30px;min-width:0}.contact-mark{display:none}.contact-action .contact-placeholder{border-bottom:1px solid #adb7a3;display:inline-block;padding-bottom:8px}.contact-action small{display:block;margin-top:10px}footer{padding-top:24px;padding-bottom:24px;gap:15px}footer>span{font-size:10px}footer>a:last-child{font-size:8px;letter-spacing:.5px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.brand{font-family:Georgia,serif;letter-spacing:-1.6px;font-size:36px}.brand small{letter-spacing:1.4px}.works{padding-top:0}.work-list{display:grid;gap:44px}.work-card{display:grid;grid-template-columns:1fr 1fr;gap:6%;align-items:center}.work-visual{padding:25px 32px;background:#e4e9dc;min-width:0}.work-kicker{font:10px Arial;letter-spacing:1.5px}.mini-ui{background:#f9faf6;border:1px solid #b9c3af;margin:24px auto;max-width:310px;padding:18px;box-shadow:8px 8px 0 #8b997818}.mini-bar{font-size:12px;border-bottom:1px solid #d5dbcd;padding-bottom:12px;display:flex;justify-content:space-between;gap:12px}.mini-bar>span{font:8px Arial;letter-spacing:1px;color:#8a9380}.chat-bubble{margin:17px 0 12px auto;width:fit-content;background:#dfe7d5;padding:8px 12px;font-size:12px}.chat-options{display:flex;flex-wrap:wrap;gap:6px;font-size:11px}.chat-options b{flex-basis:100%;font-weight:400;margin-bottom:4px}.chat-options span{border:1px solid #c4cfb9;padding:6px 14px}.chat-note{font-size:10px;color:#7d8872;margin-top:17px}.work-visual>small{font-size:10px;color:#6f7c65;letter-spacing:.5px}.work-copy h3{font:27px 'Noto Serif TC',serif;margin:16px 0 18px}.work-copy>p:not(.eyebrow){font-size:15px;line-height:2;color:#6a7464}.work-copy .eyebrow{font-size:10px}details{margin-top:22px;border-top:1px solid #bdc4b5}summary{display:flex;justify-content:space-between;cursor:pointer;list-style:none;padding:17px 0;font-size:14px}summary::-webkit-details-marker{display:none}summary span{font-size:20px;line-height:1}details[open] summary span{transform:rotate(45deg)}details>div{font-size:14px;line-height:1.9;color:#63705c}details ul{padding-left:20px}details .tech{font-size:12px;margin-top:18px}.attendance-visual{background:#e5e8e5}.attendance-time{font:36px Georgia;margin:20px 0 18px}.attendance-time small{font:11px 'Noto Sans TC',sans-serif;margin-left:12px;color:#818b7b}.attendance-buttons{display:flex;gap:9px;font-size:11px}.attendance-buttons span{padding:8px 12px;border:1px solid #a7b59b}.attendance-buttons span:first-child{background:#56694a;color:white}.mini-table{display:flex;justify-content:space-between;font-size:10px;border-top:1px solid #d5dbcd;margin-top:20px;padding-top:12px}.website-visual{background:#eae3d9}.web-mini{background:#f6f2e9}.web-mini h4{font:26px/1.6 'Noto Serif TC',serif;letter-spacing:1px;margin:20px 0}.mini-web-bottom{display:flex;justify-content:space-between;font:8px Arial;letter-spacing:1px;border-top:1px solid #d4cfc3;padding-top:12px}.hero-description{font-size:16px}.services p{font-size:16px}.diagram-heading,.work-kicker,.mini-bar>span,.work-copy .eyebrow{font-size:12px}.brand small{font-size:10px}@media(max-width:850px){nav{gap:18px}.brand small{display:none}.work-copy h3{font-size:23px}.work-visual{padding:20px}.work-copy .eyebrow{font-size:10px}}@media(max-width:600px){.brand{font-size:30px}nav a:first-child{display:inline}nav a:nth-child(2),nav a:nth-child(3){display:none}.work-card{grid-template-columns:1fr;gap:24px}.work-list{gap:42px}.works{padding-top:0}.work-copy h3{font-size:25px}.work-visual{padding:22px}.hero-description{font-size:14px}.hero h1{font-size:clamp(48px,15vw,64px)}}.contact-email{display:block;font-family:Georgia,serif;font-size:22px;border-bottom:1px solid #aab39f;padding:0 0 15px;margin-bottom:20px}.contact-email:hover{color:#a34d33}.contact-email span{margin-left:12px}@media(max-width:600px){.contact-email{font-size:22px;width:fit-content}}