:root{--ink:#080e12;--mint:#a8dabc;--text:#f2f6f3;--muted:#acb9b6;--line:#cce6da26}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:105px}body{margin:0;background:var(--ink);color:var(--text);font-family:"Microsoft JhengHei",system-ui,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}p{font-size:17px;line-height:1.9;color:var(--muted);margin:0 0 20px}h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.04em;line-height:1.4}h2{font-size:clamp(30px,3.7vw,54px)}h3{font-size:27px}em{font-style:normal;color:var(--mint)}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--mint);outline-offset:6px}.skip{position:fixed;top:-100px;left:20px;z-index:99;background:#2f8f62;padding:16px}.skip:focus{top:12px}.nav{position:sticky;top:0;height:86px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;gap:24px;background:#080e12f2;border-bottom:1px solid var(--line);z-index:10;backdrop-filter:blur(16px)}.brand{font-size:23px;font-weight:700;letter-spacing:-1px;white-space:nowrap}.brand span{color:var(--mint)}nav{display:flex;gap:30px}nav a{font-size:14px;color:#c3cdca}nav a:hover{color:var(--mint)}#motion,#menu{border:1px solid var(--line);border-radius:30px;padding:9px 14px;font-size:12px;background:transparent;white-space:nowrap}#motion span{color:var(--mint)}#menu{display:none}.journey{min-height:calc(100svh - 86px);display:grid;grid-template-columns:1.3fr 1fr;align-items:center;position:relative;padding:70px 5vw 85px;overflow:hidden;background:radial-gradient(ellipse at 83% 60%,#123b5d55,transparent 55%)}.hero-copy{z-index:2;max-width:850px}.eyebrow{font-size:13px;letter-spacing:.12em;color:var(--mint);margin-bottom:24px}.hero-copy h1{font-size:clamp(36px,4vw,65px);line-height:1.5;letter-spacing:-.045em}.hero-description{max-width:610px;margin-top:28px}.button{display:inline-flex;background:var(--mint);color:#0a251b;padding:18px 26px;border-radius:3px;font-weight:600;transition:background .2s,transform .2s}.button:hover{background:#c2e9d1;transform:translateY(-2px)}.helper{font-size:13px;margin:18px 0 0;color:#8faaa0}.door-world{height:650px;max-height:72svh;position:relative;min-width:0}#portal{display:block;width:100%;height:100%}.door-label{position:absolute;bottom:1%;width:100%;text-align:center;font-size:11px;letter-spacing:.23em;color:#94bda6}.door-label small{display:block;margin-top:8px;font-size:12px;letter-spacing:.1em}.section{padding:105px 8vw;border-top:1px solid var(--line)}.heading{margin-bottom:50px}.paths{display:grid;grid-template-columns:1fr 1fr;gap:30px}.paths article{padding:40px;background:linear-gradient(130deg,#18382d66,#101a20);border:1px solid var(--line);display:flex;flex-direction:column}.paths article:nth-child(2){background:linear-gradient(130deg,#123b5d66,#101a20)}.symbol{color:var(--mint);font-size:36px;margin-bottom:24px}.paths h3{margin-bottom:24px}.text-link{display:inline-flex;width:fit-content;border-bottom:1px solid #7fba9870;padding:12px 0;color:var(--mint);font-size:15px}.paths .text-link{margin-top:auto}.topics{background:#0c151b}.topic-list article{display:grid;grid-template-columns:145px 1fr 65px;gap:30px;padding:40px 0;border-top:1px solid var(--line)}.topic-list article>span{font-size:12px;color:var(--mint);letter-spacing:.1em;padding-top:8px}.topic-list h3{font-size:25px;margin-bottom:15px}.topic-list p{max-width:760px;margin:0}.topic-list b{font-size:45px;color:#729585;text-align:right;font-weight:400}.topic-list article.recommended{border-left:3px solid var(--mint);padding-left:20px}#path-note{margin-top:23px;font-size:15px}.split{display:flex;justify-content:space-between;align-items:end;gap:35px}.split>p{font-size:15px;margin:0}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 24px}.project{border:0;background:none;padding:0;text-align:left;min-width:0}.project-image{height:340px;overflow:hidden;background:#101a20;border:1px solid var(--line);position:relative}.project img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .5s}.project:hover img{transform:scale(1.035)}.project-image::after{content:'查看完整設計 ↗';position:absolute;right:14px;bottom:14px;background:#080e12e6;padding:10px 14px;font-size:12px}.project-meta{display:flex;justify-content:space-between;gap:15px;padding:16px 0;border-bottom:1px solid var(--line)}.project-meta strong{font-size:16px;font-weight:500}.project-meta span{color:var(--muted);font-size:12px}.source-link{margin-top:35px}.method{display:grid;grid-template-columns:1fr 1.25fr;gap:70px;background:#12251d}.method ol{list-style:none;margin:0;padding:0}.method li{display:flex;gap:25px;padding:28px 0;border-bottom:1px solid var(--line)}.method li:first-child{padding-top:0}.method li>span{font-size:12px;color:var(--mint);padding-top:8px}.method h3{font-size:23px;margin-bottom:14px}.method p{margin:0}.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px;align-items:center}.about figure{margin:0}.about img{width:100%;aspect-ratio:4/5;object-fit:cover}.about figcaption{font-size:10px;color:var(--muted);letter-spacing:.13em;margin-top:18px}.about h2{margin-bottom:30px}.about p{font-size:16px}.belief{position:relative;padding-left:23vw;background:linear-gradient(110deg,#123b5d,#0b1821 75%)}.belief::before{content:'';position:absolute;left:8vw;top:115px;width:8vw;height:230px;border:1px solid var(--mint);transform:skewY(-10deg);opacity:.4}.belief h2{margin-bottom:35px}.belief>p{max-width:720px}.faq{display:grid;grid-template-columns:1fr 1.5fr;gap:80px}.faq details{border-bottom:1px solid var(--line);padding:24px 0}.faq details:first-child{padding-top:0}.faq summary{font-size:19px;font-weight:500;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:24px;line-height:1.6}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:'＋';color:var(--mint)}.faq details[open] summary::after{content:'−'}.faq details p{font-size:16px;margin:22px 35px 0 0}.next{text-align:center;background:radial-gradient(ellipse at 50% 100%,#2f8f6235,transparent 75%);padding:120px 6vw}.next p:not(.eyebrow){margin:30px 0}footer{padding:55px 5vw;display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid var(--line)}footer p{font-size:13px;margin:0}footer>a:last-child{font-size:13px;color:var(--muted)}dialog{background:#101a20;color:var(--text);border:1px solid var(--line);padding:25px;width:min(900px,92vw);max-height:90svh;border-radius:5px}dialog::backdrop{background:#020609df;backdrop-filter:blur(10px)}.dialog-head{display:flex;justify-content:space-between;gap:20px;align-items:center;position:sticky;top:-25px;padding:15px 0;background:#101a20}.dialog-head h2{font-size:23px}.close{background:none;border:1px solid var(--line);padding:10px 14px}dialog img{width:100%;display:block;height:auto;margin:20px 0}dialog p,dialog a{font-size:13px}body.dialog-open{overflow:hidden}
@media(max-width:1000px){nav{gap:18px}.nav{gap:18px}.hero-copy h1{font-size:40px}.hero-description{font-size:16px}.section{padding:80px 6vw}.project-grid{grid-template-columns:repeat(2,1fr)}.method,.faq,.about{gap:40px}.belief{padding-left:24vw}.topic-list article{grid-template-columns:105px 1fr 45px}}
@media(max-width:700px){html{scroll-padding-top:90px}.nav{height:72px;padding:0 5vw;gap:12px}.brand{font-size:21px}#menu{display:block;margin-left:auto}#motion{padding:8px 10px;font-size:11px}nav{display:none;position:absolute;top:71px;left:0;right:0;padding:25px 5vw;background:#0c151b;border-bottom:1px solid var(--line);flex-direction:column}nav.open{display:flex}.journey{min-height:auto;display:block;padding:65px 6vw 28px}.hero-copy h1{font-size:clamp(29px,7.9vw,42px);line-height:1.5}.hero-copy .eyebrow{font-size:11px;letter-spacing:.05em}.hero-description{font-size:15px;margin-top:22px}.button{font-size:14px;padding:16px 22px}.helper{font-size:12px;max-width:290px}.door-world{height:330px;max-height:none;margin-top:18px}.section{padding:65px 6vw}.heading{margin-bottom:35px}h2{font-size:31px}.paths{grid-template-columns:1fr;gap:22px}.paths article{padding:28px}.paths h3{font-size:25px}.paths p{font-size:15px}.topic-list article{grid-template-columns:1fr 35px;gap:16px;padding:28px 0}.topic-list article>span{grid-column:1/-1}.topic-list h3{font-size:21px}.topic-list p{font-size:15px}.topic-list b{font-size:32px}.split{display:block}.split>p{margin-top:24px}.project-grid{gap:24px 14px}.project-image{height:230px}.project-image::after{right:8px;bottom:8px;font-size:10px;padding:7px}.project-meta{display:block}.project-meta strong{font-size:14px;display:block;line-height:1.6}.project-meta span{display:block;margin-top:5px;font-size:10px}.method,.about,.faq{display:block}.method h3{font-size:21px}.method p,.about p{font-size:15px}.about figure{max-width:430px;margin:0 auto 45px}.about img{aspect-ratio:1/1;object-position:center 30%}.belief{padding-left:6vw}.belief::before{display:none}.belief>p{font-size:15px}.faq summary{font-size:17px}.faq details p{font-size:15px}.next h2{font-size:29px}.next p:not(.eyebrow){font-size:15px}footer{display:block;padding:40px 6vw}footer p{margin:22px 0}dialog{padding:16px}.dialog-head{top:-16px}.dialog-head h2{font-size:19px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}body.reduced *{transition:none!important}html:has(body.reduced){scroll-behavior:auto}

/* Restored scroll-through doorway: native scrolling, readable static fallback. */
.journey{display:block;height:340svh;min-height:0;padding:0;overflow:visible;background:none}
.scene{position:sticky;top:86px;height:calc(100svh - 86px);overflow:hidden;background:radial-gradient(ellipse at 50% 70%,#102a2960,#080e12 65%)}
.door-world{position:absolute;inset:0;height:100%;max-height:none;margin:0;pointer-events:none}
#portal{position:absolute;inset:0;width:100%;height:100%}
.hero-copy{position:absolute;z-index:2;inset:0;max-width:none;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 5vw;text-align:center;transform-origin:center}
.hero-copy h1{font-size:clamp(36px,4.4vw,68px);text-shadow:0 2px 28px #080e12}
.hero-copy .hero-description{max-width:700px;margin:23px 0;color:#cad5cf;text-shadow:0 2px 10px #080e12,0 2px 25px #080e12}
.hero-copy .eyebrow{margin-bottom:23px}.hero-copy .helper{max-width:none;font-size:12px;text-shadow:0 2px 10px #080e12}
.door-label{bottom:7%;z-index:1}.scroll-cue{position:absolute;bottom:24px;left:5vw;display:flex;align-items:center;gap:15px;font-size:11px;color:#a8c7b5;letter-spacing:.15em;pointer-events:none}.scroll-cue span{font-size:22px}
.arrival{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#080e12;opacity:0;pointer-events:none;z-index:3}.arrival>p:last-child{font-size:clamp(40px,6vw,90px);letter-spacing:-.04em;line-height:1.3;color:var(--text);margin:0}.progress{position:absolute;bottom:0;left:0;right:0;height:2px;z-index:4;background:#ffffff08}.progress i{display:block;height:100%;background:#2f8f62;transform-origin:left;transform:scaleX(0)}
body.reduced .journey{height:auto}body.reduced .scene{position:relative;top:0;min-height:780px;height:calc(100svh - 86px)}body.reduced .hero-copy{opacity:1!important;transform:none!important;visibility:visible!important}body.reduced .arrival,body.reduced .progress,body.reduced .scroll-cue{display:none}
@media(max-width:700px){.journey{height:300svh;padding:0}.scene{top:72px;height:calc(100svh - 72px)}.hero-copy{padding:25px 6vw 50px}.hero-copy h1{font-size:clamp(27px,7.5vw,42px)}.hero-copy .hero-description{font-size:14px;margin:20px 0;max-width:420px}.hero-copy .eyebrow{font-size:10px;margin-bottom:18px}.hero-copy .helper{font-size:11px;max-width:300px}.door-world{height:100%;margin:0}.door-label{bottom:5%;font-size:9px}.door-label small{display:none}.scroll-cue{bottom:15px;font-size:9px}.arrival>p:last-child{font-size:42px}body.reduced .scene{min-height:680px;height:calc(100svh - 72px)}}
@media(max-height:650px){.hero-copy{padding:20px 5vw}.hero-copy h1{font-size:clamp(25px,4vw,40px)}.hero-copy .eyebrow{margin-bottom:8px}.hero-copy .hero-description{font-size:13px;line-height:1.6;margin:12px 0;max-width:700px}.hero-copy .helper{margin-top:10px}.hero-copy .button{padding:12px 22px}.door-label{display:none}}
@media(prefers-reduced-motion:reduce){.journey{height:auto}.scene{position:relative;top:0}}
/* Copy enters with scroll and settles below the doorway. */
.journey{height:340svh}.hero-copy{inset:auto 0 auto;display:flex;padding:0 5vw 25px;justify-content:flex-start;gap:0}.hero-copy h1{font-size:clamp(30px,3vw,46px);line-height:1.4}.hero-copy .eyebrow{margin:0 0 14px}.hero-copy .hero-description{font-size:15px;line-height:1.75;margin:17px 0 19px;max-width:710px}.hero-copy .button{font-size:14px;padding:14px 24px}.hero-copy .helper{margin-top:14px}.hero-copy>*{will-change:transform,opacity}.arrival{display:none}.door-label{bottom:8%}
@media(max-width:700px){.journey{height:340svh}.hero-copy{padding:0 6vw 18px}.hero-copy h1{font-size:clamp(25px,7vw,36px);line-height:1.4}.hero-copy .eyebrow{font-size:10px;margin-bottom:12px}.hero-copy .hero-description{font-size:13px;line-height:1.8;margin:14px 0 17px}.hero-copy .helper{font-size:10px;margin-top:12px}.hero-copy .button{font-size:13px;padding:13px 23px}}
@media(max-height:650px){.scene{height:700px}.hero-copy h1{font-size:30px}.hero-copy .hero-description{font-size:14px}.hero-copy .helper{font-size:11px}}
body.reduced .journey{height:auto}body.reduced .scene{height:max(780px,calc(100svh - 86px));min-height:780px}
@media(max-width:700px){body.reduced .scene{height:max(720px,calc(100svh - 72px));min-height:720px}}
/* Two architectural doors for two starting paths. */
.paths{max-width:1100px;margin:0 auto;gap:clamp(30px,6vw,90px);align-items:stretch;padding:12px 14px 0}.paths article,.paths article:nth-child(2){position:relative;padding:0;background:#0c1917;border:1px solid #91b7a666;border-radius:170px 170px 3px 3px;box-shadow:0 0 0 8px #080e12,0 0 0 9px #53796655,15px 18px 45px #0005;overflow:hidden;display:flex;flex-direction:column}.paths article:nth-child(2){background:#101e2a;border-color:#8fa7bb66}.path-picture{height:370px;overflow:hidden;flex-shrink:0;position:relative}.path-picture::after{content:'';position:absolute;inset:auto 0 0;height:110px;background:linear-gradient(transparent,#0c1917)}.paths article:nth-child(2) .path-picture::after{background:linear-gradient(transparent,#101e2a)}.path-picture img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 43%;transition:transform .7s}.paths article:hover .path-picture img{transform:scale(1.035)}.path-copy{padding:8px 36px 38px;display:flex;flex-direction:column;flex:1}.path-copy h3{font-size:28px;line-height:1.45;margin-bottom:20px}.path-copy p{font-size:15px;line-height:1.9}.paths .text-link{margin-top:auto;padding-top:20px}.paths article::after{content:'';position:absolute;right:13px;top:54%;height:60px;width:4px;background:#aacbb4;border-radius:5px;box-shadow:0 0 15px #9accb140}.belief .belief-passion{font-size:clamp(22px,2.5vw,34px);color:var(--mint);line-height:1.5;margin-top:32px;margin-bottom:18px}
@media(max-width:700px){.paths{max-width:450px;gap:48px;padding:8px 10px}.paths article,.paths article:nth-child(2){padding:0;border-radius:145px 145px 3px 3px}.path-picture{height:310px}.path-copy{padding:5px 25px 30px}.path-copy h3{font-size:25px}.path-copy p{font-size:14px}.paths article::after{right:10px;width:3px;height:48px}}
/* Supplied desk portrait: preserve the full image and its lettering. */
.about img{display:block;aspect-ratio:auto;height:auto;object-fit:contain;border-radius:3px}.about figure{width:100%;align-self:center}
@media(max-width:700px){.about img{aspect-ratio:auto;object-position:center}.about figure{max-width:540px}}

/* Project inquiry: click-only popup, with the original hosted form. */
#project-form-dialog{width:min(760px,94vw);max-height:88svh;padding:0;overflow:auto;overscroll-behavior:contain;border-radius:8px}
#project-form-dialog .dialog-head{top:0;padding:18px 22px;z-index:2;border-bottom:1px solid var(--line);gap:14px}
#project-form-title{font-size:22px;line-height:1.4}#project-form-dialog .close{flex-shrink:0}
.project-form-body{background:#fff;border-radius:8px;margin:16px;overflow:hidden}.project-form-body iframe{display:block;width:100%;height:1010px;border:0}
#project-form-dialog .form-fallback{padding:0 22px 18px;margin:0;font-size:13px}.form-fallback a{color:var(--mint);text-decoration:underline}
@media(max-width:700px){#project-form-dialog{width:96vw;max-height:92svh}#project-form-dialog .dialog-head{padding:14px 15px}#project-form-title{font-size:18px}.project-form-body{margin:8px}#project-form-dialog .close{padding:9px 12px}}