:root{--navy:#16356e;--orange:#ef5a22;--ink:#16181d;--paper:#f4f1eb;--card:#fffcf8;--muted:#5c6570;--line:#e2dcd2;--sans:"Noto Sans TC","PingFang HK","Microsoft JhengHei",sans-serif;--serif:"Noto Serif TC","Songti TC",serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}
button,[role="button"]{cursor:pointer}:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.wrap{width:min(72rem,100% - 2rem);margin-inline:auto}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.bar{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--paper) 95%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.bar-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0}
.brand{display:flex;align-items:center;gap:.75rem}.brand img{height:2.75rem;width:auto}.brand-text{display:none;font-size:.875rem;line-height:1.25}.brand-text small{display:block;color:var(--muted)}
.desk{display:none;gap:1.5rem;font-size:.875rem;font-weight:600}.bar-actions{display:flex;gap:.5rem;align-items:center}
.btn{display:inline-flex;min-height:2.75rem;align-items:center;justify-content:center;border-radius:.75rem;padding:0 1rem;font-size:.875rem;font-weight:700;border:0}
.orange{background:var(--orange);color:var(--ink)}.navy{background:var(--navy);color:var(--paper)}.ghost{background:var(--card);border:1px solid var(--line)}.full{width:100%}
.menu{display:inline-flex;min-height:2.75rem;min-width:2.75rem;align-items:center;justify-content:center;border-radius:.75rem;border:1px solid var(--line);background:transparent}
.mobile{border-top:1px solid var(--line);padding:.5rem 1rem 1rem}.mobile a{display:block;padding:.75rem 0;font-weight:600}
.hero{display:grid;gap:2rem;align-items:center;padding:2.5rem 0 3.5rem}.kicker{color:var(--navy);font-size:.875rem;font-weight:700;margin:0}.kicker span{color:var(--line);margin:0 .4rem}
h1,h2{font-family:var(--serif);font-weight:600;line-height:1.15;margin:.5rem 0 0}h1{font-size:3rem}h2{font-size:2.25rem}.lead{font-size:1.125rem;color:var(--muted);max-width:36rem}.muted{color:var(--muted)}.narrow{max-width:28rem}
.row{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin:2rem 0 0;padding-top:1.5rem;border-top:1px solid var(--line)}.stats dt{font-size:.875rem;color:var(--muted)}.stats dd{margin:.15rem 0 0;font-family:var(--serif);font-size:1.5rem;font-weight:600}
.hero-fig{overflow:hidden;border-radius:.75rem;background:var(--ink);margin:0}.hero-fig img{width:100%;aspect-ratio:4/3;object-fit:cover}.hero-fig figcaption{display:flex;justify-content:space-between;color:var(--paper);font-size:.875rem;padding:.75rem 1rem}.accent{color:var(--orange)}
.band{background:var(--card);border-top:1px solid var(--line)}.split{display:grid;gap:2rem;padding:3.5rem 0}
.svc{border-bottom:1px solid var(--line)}.svc-btn{width:100%;display:flex;gap:1rem;align-items:flex-start;text-align:left;background:none;border:0;padding:1rem 0}
.svc-btn strong{display:block;font-size:1.125rem}.svc-btn small{display:block;color:var(--muted);font-size:.875rem;margin-top:.25rem}.svc-btn em{font-style:normal;color:var(--orange);font-weight:700;font-size:.875rem}
.svc ul{display:none;grid-template-columns:1fr;gap:.5rem;margin:0 0 1.2rem;padding:0 0 0 0;list-style:none}.svc[data-open="true"] ul{display:grid}.svc li{background:var(--paper);border-radius:.75rem;padding:.5rem .75rem;font-size:.875rem}
.section-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;align-items:flex-end}#work{padding:3.5rem 0}
.shots{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:2rem}.shot{padding:0;border:0;border-radius:.75rem;overflow:hidden;background:var(--ink);text-align:left}
.shot img{width:100%;aspect-ratio:1;object-fit:cover}.shot span{display:block;color:var(--paper);font-size:.875rem;padding:.5rem .75rem}
.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2.5rem}.chip{min-height:2.75rem;border-radius:.75rem;border:1px solid var(--line);background:var(--card);padding:0 1rem;font-weight:700;font-size:.875rem}.chip.on{background:var(--navy);color:var(--paper);border-color:var(--navy)}
#job-search{min-height:2.75rem;flex:1;min-width:12rem;border-radius:.75rem;border:1px solid var(--line);background:var(--card);padding:0 .75rem}
.jobs{list-style:none;margin:.75rem 0 0;padding:0;border-top:1px solid var(--line)}.jobs li{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--line)}.jobs small{color:var(--muted);white-space:nowrap}
.navy-band{background:var(--navy);color:var(--paper);padding:3.5rem 0}.steps{display:grid;gap:1.5rem;list-style:none;margin:2rem 0 0;padding:0}.steps li{border-top:1px solid color-mix(in srgb,var(--paper) 20%,transparent);padding-top:1rem}.steps p{font-family:var(--serif);font-size:1.875rem;color:var(--orange);margin:0}.steps h3{margin:.5rem 0;font-size:1.25rem}.steps span{color:color-mix(in srgb,var(--paper) 80%,transparent)}
.about{display:grid;gap:2rem;align-items:center;padding:3.5rem 0}.about img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:.75rem}
.lic{list-style:none;padding:0;margin:1.5rem 0 0}.lic li{border-left:4px solid var(--orange);padding-left:.75rem;margin:.75rem 0;font-size:.875rem}.lic .n{border-color:var(--navy)}.lic b{display:block;margin-top:.2rem}
.quotes{display:grid;gap:1.5rem;margin-top:2rem}.quotes figure{margin:0;border-left:4px solid var(--orange);padding-left:1rem}.quotes blockquote{margin:0;font-size:1.125rem}.quotes figcaption{margin-top:.75rem;color:var(--muted);font-size:.875rem}
.quote{display:grid;gap:2.5rem;padding:3.5rem 0}.contact{margin:1.5rem 0}.contact dt{color:var(--muted);font-size:.875rem}.contact dd{margin:.15rem 0 .8rem;font-weight:600}.contact a{text-decoration:underline}
.map{display:inline-flex;min-height:2.75rem;align-items:center;color:var(--navy);font-weight:700;font-size:.875rem;text-decoration:underline}
#quote-form{display:grid;gap:1rem;border:1px solid var(--line);background:var(--card);border-radius:.75rem;padding:1.25rem}
#quote-form label{display:grid;gap:.25rem;font-size:.875rem;font-weight:600}
#quote-form input,#quote-form select,#quote-form textarea{min-height:2.75rem;border-radius:.75rem;border:1px solid var(--line);background:var(--paper);padding:.5rem .75rem;font-weight:400}
.err{color:var(--navy);font-weight:700;font-size:.875rem;margin:0}.ok{color:var(--navy);font-size:.875rem;margin:0}
footer{background:var(--ink);color:var(--paper);border-top:1px solid var(--line)}.foot{display:flex;flex-direction:column;gap:1.5rem;padding:2.5rem 0}.serif{font-family:var(--serif);font-size:1.5rem;margin:0}.dim{color:color-mix(in srgb,var(--paper) 70%,transparent)}
.dock{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:30;min-height:3rem;display:flex;align-items:center;justify-content:center;border-radius:.75rem;background:var(--orange);color:var(--ink);font-weight:700;box-shadow:0 8px 24px rgb(22 24 29 / 18%)}
body{padding-bottom:5rem}
.lightbox{position:fixed;inset:0;z-index:40;background:rgb(22 24 29 / 90%);display:flex;align-items:center;justify-content:center;padding:1rem}
.lightbox[hidden]{display:none}.lightbox figure{max-width:56rem;margin:0}.lightbox img{max-height:80vh;width:100%;object-fit:contain}.lightbox figcaption{color:var(--paper);text-align:center;margin-top:.75rem}
.close{position:absolute;top:1rem;right:1rem;min-height:2.75rem;border:0;border-radius:.75rem;background:var(--paper);padding:0 1rem;font-weight:700}
@media(min-width:768px){
  .brand-text,.desk{display:flex}.menu,.mobile,.dock{display:none}body{padding-bottom:0}
  .hero,.about,.quote{grid-template-columns:1fr 1fr}.split{grid-template-columns:4fr 8fr}
  h1{font-size:3.75rem}.shots{grid-template-columns:repeat(4,1fr)}.steps,.quotes{grid-template-columns:1fr 1fr}.steps{grid-template-columns:repeat(3,1fr)}
  .svc ul{grid-template-columns:1fr 1fr}.foot{flex-direction:row;justify-content:space-between}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}