/* One geometric family: sharp image edges, rounded interactive controls only. Layers: header 10; native dialog top layer. */
:root{color-scheme:dark;--bg:#171717;--text:#f3f3ef;--muted:#b9b9b3;--line:#42423f;--accent:#e3ff4c;--on-accent:#171717;--panel:#232323}
html[data-theme=light]{color-scheme:light;--bg:#f3f3ef;--text:#1b1b1b;--muted:#5a5a55;--line:#c8c8c1;--accent:#e3ff4c;--on-accent:#171717;--panel:#e8e8e1}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font-family:"Helvetica Neue",Arial,"PingFang HK","Noto Sans CJK TC",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}button:active,.button:active{transform:scale(.97)}:focus-visible{outline:3px solid var(--accent);outline-offset:6px}.wrap{max-width:1440px;margin:auto;padding-left:5%;padding-right:5%}.skip{position:fixed;left:20px;top:-100px;z-index:20;background:var(--accent);color:var(--on-accent);padding:16px}.skip:focus{top:16px}.header{height:80px;display:flex;align-items:center;gap:32px;border-bottom:1px solid var(--line);position:relative;z-index:10}.brand{margin-right:auto;display:flex;align-items:center}.brand img{width:94px;height:auto;max-height:55px;object-fit:contain}.logo-light{display:none}html[data-theme=light] .logo-light{display:block}html[data-theme=light] .logo-dark{display:none}nav{display:flex;gap:32px;align-items:center;font-size:14px}nav a:hover,footer a:hover{color:var(--accent)}.controls{display:flex;align-items:center;gap:16px}.controls button{padding:8px 3px;border:0;background:none;font-size:14px}#theme{font-size:24px}#menu{display:none}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:5%;align-items:center;padding-top:64px;padding-bottom:80px;min-height:650px}.hero-copy{padding-bottom:18px}.eyebrow{font-size:11px;letter-spacing:.13em;margin:0 0 30px}.hero h1{font-size:clamp(40px,4.5vw,68px);font-weight:600;letter-spacing:-.06em;line-height:1.18;margin:0 0 28px}.intro{font-size:17px;color:var(--muted);line-height:1.8;max-width:360px;margin-bottom:36px}.button{display:inline-flex;align-items:center;gap:54px;border-radius:99px;padding:17px 24px;background:var(--accent);color:var(--on-accent);font-size:15px;white-space:nowrap}.button span:last-child{font-size:22px}.hero-image{overflow:hidden;aspect-ratio:1.04}.hero-image img{width:100%;height:100%;object-fit:cover;object-position:65% center}.work{padding-top:45px;padding-bottom:110px}h2{font-size:clamp(32px,3.7vw,54px);letter-spacing:-.045em;font-weight:500;line-height:1.2;margin:0 0 24px}.section-intro{color:var(--muted);line-height:1.8;max-width:580px;font-size:16px}.filters{display:flex;gap:12px;flex-wrap:wrap;margin:38px 0 42px}.filters button{border:1px solid var(--line);background:transparent;border-radius:99px;padding:11px 20px;font-size:13px}.filters button.selected{background:var(--text);color:var(--bg);border-color:var(--text)}.projects{display:grid;grid-template-columns:1.18fr 1fr;gap:64px 5%}.project:nth-child(even){padding-top:100px}.project{border:0;background:transparent;text-align:left;padding:0;display:block;width:100%}.project figure{margin:0;overflow:hidden;aspect-ratio:1.35;background:var(--panel)}.project:nth-child(even) figure{aspect-ratio:1.14}.project img{width:100%;height:100%;object-fit:cover;transition:transform .6s}.project:hover img{transform:scale(1.035)}.project-info{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-top:20px}.project h3{font-size:23px;font-weight:500;line-height:1.3;margin:0;letter-spacing:-.025em}.project-info span{font-size:24px}.project-meta{color:var(--muted);font-size:12px;line-height:1.8;margin:10px 0 0}.credit{font-size:12px;max-width:720px;line-height:1.9;color:var(--muted);margin-top:54px}.studio{padding-top:90px;padding-bottom:110px;border-top:1px solid var(--line);display:grid;grid-template-columns:1.1fr 1fr;gap:7%}.studio-copy>p{line-height:1.9;font-size:17px;color:var(--muted);margin:0 0 28px}.studio-copy .statement{font-size:32px;color:var(--accent);font-weight:500;line-height:1.25;margin-top:45px;letter-spacing:-.035em}.services{padding-top:60px;padding-bottom:110px}.service-list{margin-top:48px;max-width:900px;margin-left:auto}details{border-top:1px solid var(--line);padding:24px 0}summary{display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:26px;list-style:none}summary::-webkit-details-marker{display:none}summary span:last-child{font-weight:300;font-size:30px;color:var(--accent);transition:transform .2s}details[open] summary span:last-child{transform:rotate(45deg)}details p{font-size:16px;color:var(--muted);line-height:1.8;max-width:520px;margin:22px 0 4px}.contact{border-top:1px solid var(--line);padding-top:80px;padding-bottom:70px}.contact h2{font-size:clamp(42px,6vw,84px);margin-bottom:45px}.email{display:inline-flex;gap:45px;align-items:center;font-size:clamp(19px,3vw,42px);letter-spacing:-.03em;border-bottom:1px solid var(--accent);padding-bottom:12px;color:var(--accent)}.contact-bottom{display:flex;justify-content:space-between;gap:30px;margin-top:56px;color:var(--muted);font-size:14px;line-height:1.8}.contact-bottom p{margin:0}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:25px;padding-bottom:25px;color:var(--muted);font-size:12px}dialog{border:1px solid var(--line);padding:60px 5%;background:var(--bg);color:var(--text);width:min(980px,92vw);max-height:90dvh}dialog::backdrop{background:rgb(0 0 0/.8)}.close{position:absolute;top:12px;right:22px;border:0;background:none;font-size:36px}.dialog-image{width:100%;max-height:55dvh;object-fit:cover;margin-bottom:30px}.dialog-meta{color:var(--muted);line-height:1.8}.dialog-credit{font-size:13px;color:var(--accent);line-height:1.8;margin-top:22px}.project[hidden]{display:none}
@media(prefers-reduced-motion:no-preference){.hero-copy{animation:enter .7s both}.hero-image{animation:enter .9s .1s both}@keyframes enter{from{opacity:1;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
@media(min-width:1600px){.hero{min-height:740px}}
@media(max-width:1023px){nav{gap:20px}.hero{gap:4%;min-height:590px}.hero h1{font-size:48px}.header{gap:20px}.project h3{font-size:20px}}
@media(max-width:767px){.wrap{padding-left:6%;padding-right:6%}.header{height:72px}.brand img{width:78px}#menu{display:block}.controls{gap:18px}nav{display:none;position:absolute;top:72px;left:0;right:0;padding:25px 6%;background:var(--bg);border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:25px;font-size:20px}nav.open{display:flex}.hero{grid-template-columns:1fr;gap:36px;min-height:0;padding-top:45px;padding-bottom:60px}.hero-copy{padding:0}.eyebrow{margin-bottom:24px;font-size:10px}.hero h1{font-size:clamp(37px,9.3vw,58px);margin-bottom:22px}.intro{font-size:15px;margin-bottom:26px;max-width:340px}.hero-image{aspect-ratio:1.25}.work{padding-top:26px;padding-bottom:65px}h2{font-size:34px}.section-intro{font-size:14px}.filters{gap:8px;margin:26px 0 30px}.filters button{padding:9px 14px;font-size:12px}.projects{grid-template-columns:1fr;gap:36px}.project:nth-child(even){padding:0}.project figure,.project:nth-child(even) figure{aspect-ratio:1.3}.project-info{margin-top:16px}.project h3{font-size:22px}.credit{margin-top:35px}.studio{grid-template-columns:1fr;gap:16px;padding-top:55px;padding-bottom:50px}.studio h2{font-size:34px}.studio-copy>p{font-size:15px}.studio-copy .statement{font-size:30px;margin-top:34px}.services{padding-top:32px;padding-bottom:60px}.service-list{margin-top:30px}summary{font-size:22px}details p{font-size:14px}.contact{padding-top:48px;padding-bottom:45px}.contact h2{font-size:48px}.email{gap:20px;font-size:clamp(17px,5.5vw,26px)}.contact-bottom{flex-direction:column;gap:24px;margin-top:35px}footer{font-size:10px;gap:20px}dialog{padding:55px 6% 30px}.dialog-image{max-height:35dvh}.dialog-meta{font-size:14px}}

html[data-theme=light] .statement,html[data-theme=light] .email,html[data-theme=light] .dialog-credit,html[data-theme=light] summary span:last-child,html[data-theme=light] nav a:hover,html[data-theme=light] footer a:hover{color:var(--text)}html[data-theme=light] :focus-visible{outline-color:var(--text)}

/* Project scope and collaboration content share the existing brand tokens. */
.service-list .service-output{color:var(--text);font-size:14px;border-left:2px solid var(--accent);padding-left:18px;max-width:650px}.scope-note{max-width:900px;margin:24px 0 0 auto;font-size:13px;color:var(--muted);line-height:1.8}.process{border-top:1px solid var(--line);padding-top:80px;padding-bottom:100px}.process-list{list-style:none;padding:0;margin:48px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:0 7%}.process-list li{border-top:1px solid var(--line);padding:30px 0 35px}.process-list h3{font-size:26px;font-weight:500;letter-spacing:-.03em;margin:0 0 18px}.process-list p{font-size:16px;line-height:1.8;color:var(--muted);max-width:480px;margin:0 0 18px}.process-list .prepare{font-size:13px;color:var(--text);margin:0;line-height:1.8}.contact-intro{max-width:680px;font-size:17px;color:var(--muted);line-height:1.9;margin:0 0 36px}.brief-list{display:grid;grid-template-columns:1fr 1fr;gap:30px 7%;max-width:900px;margin:0 0 50px}.brief-list dt{font-size:20px;font-weight:500;margin-bottom:12px}.brief-list dd{font-size:15px;color:var(--muted);line-height:1.8;margin:0;max-width:340px}.email-hint{font-size:13px;line-height:1.8;color:var(--muted);max-width:650px;margin-top:18px}.project-story{max-width:740px;line-height:1.85}.project-story h3{font-size:18px;font-weight:500;margin:26px 0 10px}.project-story p{font-size:16px;color:var(--muted);margin:0}.dialog-image{max-height:42dvh}
@media(max-width:767px){.process{padding-top:48px;padding-bottom:55px}.process-list{grid-template-columns:1fr;gap:0;margin-top:28px}.process-list li{padding:24px 0}.process-list h3{font-size:23px}.process-list p{font-size:14px}.process-list .prepare{font-size:12px}.contact-intro{font-size:15px}.brief-list{grid-template-columns:1fr;gap:24px;margin-bottom:35px}.brief-list dt{font-size:18px}.brief-list dd{font-size:14px}.project-story p{font-size:14px}.service-list .service-output{font-size:13px}.scope-note{font-size:12px}}

/* Featured experience stays explicitly credited to the founding team. */
nav{gap:24px}.project.featured{grid-column:1/-1;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:7%;padding:0 0 28px}.project.featured figure{aspect-ratio:1.45}.project.featured .project-info{margin-top:0}.project.featured h3{font-size:36px}.featured-label{color:var(--accent);font-size:13px;margin:0 0 20px}.featured-intro{font-size:17px;line-height:1.9;color:var(--muted);max-width:440px;margin:24px 0}.featured-action{display:inline-block;border-bottom:1px solid var(--accent);padding:0 0 7px;font-size:15px}.gallery .dialog-image{display:block;object-fit:contain;background:var(--panel);height:42dvh;margin:0}.gallery-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 32px}.gallery-controls button{background:none;border:1px solid var(--line);border-radius:99px;padding:10px 16px;font-size:13px;min-height:44px}.gallery-controls button:disabled{opacity:.4;cursor:default}.gallery-count{font-size:13px;white-space:nowrap;color:var(--muted)}.image-status{font-size:13px;color:var(--muted);margin:10px 0;min-height:18px}.image-status:empty{display:none}.email-row{display:flex;align-items:center;gap:28px;flex-wrap:wrap}#copy-email{border:1px solid var(--accent);color:var(--text);background:transparent;border-radius:99px;padding:13px 20px;font-size:14px;min-height:44px}#copy-email:hover{background:var(--accent);color:var(--on-accent)}#copy-status{max-width:650px;color:var(--muted);font-size:13px;line-height:1.8;min-height:24px;margin:14px 0 0}.email-hint{margin-top:4px}html[data-theme=light] .featured-label{color:var(--text)}
@media(max-width:1023px) and (min-width:768px){nav{gap:14px;font-size:12px}.header{gap:15px}.controls{gap:10px}.project.featured h3{font-size:28px}}
@media(max-width:767px){.project.featured{grid-template-columns:1fr;gap:20px;padding:0}.project.featured figure{aspect-ratio:1.3}.project.featured h3{font-size:26px}.featured-label{margin-bottom:15px}.featured-intro{font-size:14px;margin:18px 0}.featured-action{font-size:13px}.gallery .dialog-image{height:31dvh}.gallery-controls{gap:8px}.gallery-controls button{padding:10px 12px;font-size:12px}.email-row{gap:20px}#copy-email{font-size:13px}#copy-status{font-size:12px}}

/* All project covers use one aligned 4:3 image size. Full photographs remain in the dialog. */
.projects{grid-template-columns:1fr 1fr;align-items:start}
.project.featured{grid-column:auto;display:block;padding:0}
.project:nth-child(even){padding-top:0}
.project figure,.project:nth-child(even) figure,.project.featured figure{aspect-ratio:4/3}
.project img{object-fit:cover;background:var(--panel)}
.project.featured h3{font-size:23px}
.project.featured .project-info{margin-top:20px}
.featured-label{margin:20px 0 0}
.featured-intro{font-size:15px;margin:18px 0}
@media(max-width:767px){.projects{grid-template-columns:1fr}.project.featured h3{font-size:22px}.project.featured .project-info{margin-top:16px}.featured-label{margin-top:16px}.featured-intro{font-size:14px}}

.project-asterisk{font-size:.6em;line-height:0;vertical-align:super;margin-left:.2em}
