.section--alt{background:var(--surface-alt)}.service-list{gap:clamp(20px,2.4vw,28px);display:grid}.service-list[data-count="1"]{max-width:880px;margin-inline:auto}.service-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);padding:clamp(24px,3.5vw,40px)}.service-card__head{flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-bottom:clamp(24px,3vw,36px);display:flex}.service-card__index{color:var(--accent-text);font-family:var(--font-serif);font-size:var(--fs-h3);font-weight:700}.service-card__head h3{font-size:clamp(1.3rem,1.15rem + .7vw,1.65rem)}.service-card__count{color:var(--text-muted);font-size:var(--fs-small)}.service-steps{gap:0;margin:0;padding:0;list-style:none;display:grid}.service-step{grid-template-columns:40px 1fr;align-content:start;gap:16px;padding-bottom:24px;display:grid;position:relative}.service-step:last-child{padding-bottom:0}.service-step:not(:last-child):before{content:"";background:linear-gradient(var(--accent-soft), var(--border));width:2px;position:absolute;top:40px;bottom:0;left:19px}.service-step__num{z-index:1;background:var(--accent-strong);width:40px;height:40px;box-shadow:0 0 0 5px var(--surface);color:var(--on-accent);border-radius:50%;place-items:center;font-weight:700;display:grid;position:relative}.service-step__text{gap:4px;padding-top:7px;display:grid}.service-step__name{font-weight:600;line-height:1.5}.service-step__note{color:var(--text-muted);font-size:var(--fs-small);line-height:1.6}@media (width>=960px){.service-steps{grid-template-columns:repeat(var(--steps,5), minmax(0, 1fr));gap:16px}.service-step{text-align:center;grid-template-columns:1fr;gap:14px;padding-bottom:0}.service-step:not(:last-child):before{background:linear-gradient(90deg, var(--accent-soft), var(--border));width:auto;height:2px;inset:19px calc(-50% - 8px) auto 50%}.service-step__num{justify-self:center}.service-step__text{padding-top:0}}.contact{padding:clamp(36px, 5vw, 64px) var(--gutter);border-radius:calc(var(--radius) + 8px);background:radial-gradient(circle at 15% 0%, #f0c9a08c, transparent 55%), radial-gradient(circle at 90% 100%, #e9d5b0b3, transparent 50%), var(--surface);box-shadow:var(--shadow);text-align:center;margin-top:clamp(48px,6vw,80px);position:relative;overflow:hidden}.contact h3{font-size:var(--fs-h2)}.contact__lead{text-wrap:balance;color:var(--text-muted);margin-top:12px}.contact__mail{overflow-wrap:anywhere;max-width:100%;margin-top:28px}.work-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:clamp(20px,2.4vw,28px);margin:0;padding:0;list-style:none;display:grid}.work-grid[data-count=few]{flex-wrap:wrap;justify-content:center;display:flex}.work-grid[data-count=few] .work-grid__item{flex:320px;max-width:440px}.work-grid__item{display:flex}.work-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);width:100%;box-shadow:var(--shadow);text-align:left;cursor:pointer;transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease);flex-direction:column;padding:0;display:flex;overflow:hidden}.work-card__media{aspect-ratio:16/10;background:var(--surface-alt);display:block;position:relative;overflow:hidden}.work-card__media img{object-fit:cover;object-position:top center;width:100%;height:100%;transition:transform .5s var(--ease)}.work-card__placeholder{width:100%;height:100%;color:var(--text-muted);font-family:var(--font-serif);place-items:center;font-size:2.5rem;display:grid}.work-card__body{flex-direction:column;flex:1;gap:10px;padding:18px 20px 20px;display:flex}.work-card__title{font-family:var(--font-serif);font-size:var(--fs-h3);-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-weight:700;line-height:1.5;display:-webkit-box;overflow:hidden}.work-card__more{color:var(--text-muted);font-size:var(--fs-small);transition:color var(--dur) var(--ease);margin-top:auto;font-weight:600}@media (hover:hover){.work-card:hover{border-color:var(--accent-soft);box-shadow:var(--shadow-hover);transform:translateY(-4px)}.work-card:hover .work-card__media img{transform:scale(1.03)}.work-card:hover .work-card__more{color:var(--accent-text)}}.work-card:focus-visible{outline-offset:4px}.work-dialog{overscroll-behavior:contain;border-radius:var(--radius);width:100%;max-width:min(880px,100vw - 32px);max-height:calc(100dvh - 48px);color:var(--text);background:0 0;border:0;margin:auto;padding:0;overflow:auto}.work-dialog::backdrop{-webkit-backdrop-filter:blur(4px);background:#3b2f2573}.work-dialog__panel{border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow-dialog);position:relative;overflow:hidden}.work-dialog__close{z-index:2;border:1px solid var(--border);width:44px;height:44px;box-shadow:var(--shadow);cursor:pointer;background:#fffcf6eb;border-radius:50%;place-items:center;margin:12px 12px -56px auto;display:grid;position:sticky;top:12px}.work-dialog__close:hover{border-color:var(--accent)}.work-dialog__media{background:var(--surface-alt);place-items:center;padding:clamp(16px,3vw,32px);display:grid}.work-dialog__media img{object-fit:contain;border-radius:var(--radius-sm);width:auto;max-width:100%;height:auto;max-height:60vh;box-shadow:var(--shadow)}.work-dialog__body{gap:16px;padding:clamp(24px,4vw,40px);display:grid}.work-dialog__body h3{font-size:clamp(1.35rem,1.15rem + .9vw,1.8rem)}.work-dialog__desc{color:var(--text-muted);white-space:pre-line}.work-dialog__link{justify-self:start;margin-top:8px}@supports not (view-transition-name:none){.work-dialog[open]{animation:dialog-in .24s var(--ease)}}@keyframes dialog-in{0%{opacity:0;transform:translateY(12px)scale(.98)}}::view-transition-group(work-image){animation-duration:.34s;animation-timing-function:var(--ease)}::view-transition-old(root){animation-duration:.24s}::view-transition-new(root){animation-duration:.24s}@media (width<=599px){.work-dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.work-dialog__media img{max-height:50vh}}:root{--bg:#faf4e8;--surface:#fffcf6;--surface-alt:#f3e9d6;--text:#3b2f25;--text-muted:#6e5e4e;--accent:#b5652f;--accent-strong:#9a4f20;--accent-text:#9a4f20;--accent-soft:#f2dcc4;--border:#e6d8c0;--on-accent:#fffcf6;--shadow:0 1px 2px #5a3c1e0f, 0 2px 8px #5a3c1e14;--shadow-hover:0 4px 10px #5a3c1e1a, 0 14px 32px #5a3c1e24;--shadow-dialog:0 24px 64px #3c281447;--font-serif:"Noto Serif TC", "Songti TC", "PMingLiU", serif;--font-sans:"PingFang TC", "Microsoft JhengHei", "Noto Sans TC", system-ui, sans-serif;--fs-hero:clamp(2rem, 1.35rem + 3.2vw, 3.6rem);--fs-h2:clamp(1.6rem, 1.3rem + 1.4vw, 2.3rem);--fs-h3:clamp(1.1rem, 1.02rem + .4vw, 1.3rem);--fs-body:1rem;--fs-small:.875rem;--fs-eyebrow:.8125rem;--gutter:16px;--container:1200px;--section-space:64px;--radius:16px;--radius-sm:10px;--header-h:64px;--ease:cubic-bezier(.2, .7, .2, 1);--dur:.22s}@media (width>=768px){:root{--gutter:32px;--section-space:96px;--header-h:72px}}*,:before,:after{box-sizing:border-box}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;overflow-x:clip}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--font-sans);font-size:var(--fs-body);-webkit-font-smoothing:antialiased;margin:0;line-height:1.75}h1,h2,h3{font-family:var(--font-serif);letter-spacing:.02em;text-wrap:balance;margin:0;font-weight:700;line-height:1.3}p{margin:0}img{max-width:100%;display:block}a{color:var(--accent-text)}button{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}.container{width:100%;max-width:calc(var(--container) + var(--gutter) * 2);padding-inline:var(--gutter);margin-inline:auto}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.section{padding-block:var(--section-space)}#top,#works,#services{scroll-margin-top:var(--header-h)}.section-head{text-align:center;margin-bottom:clamp(32px,4vw,56px)}.eyebrow{color:var(--accent-text);font-size:var(--fs-eyebrow);letter-spacing:.24em;text-transform:uppercase;margin-bottom:12px;font-weight:600;display:inline-block}.section-title{font-size:var(--fs-h2)}.section-lead,.hero__lead{text-wrap:pretty}.section-lead{max-width:36em;color:var(--text-muted);margin:14px auto 0}.btn{cursor:pointer;min-height:48px;transition:background-color var(--dur) var(--ease), border-color var(--dur) var(--ease), transform var(--dur) var(--ease);border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 24px;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:var(--accent-strong);color:var(--on-accent)}.btn-primary:hover{background:#84421a}.btn-ghost{border-color:var(--border);background:var(--surface);color:var(--text)}.btn-ghost:hover{border-color:var(--accent)}.section-state{border:1px dashed var(--border);border-radius:var(--radius);min-height:200px;color:var(--text-muted);text-align:center;place-items:center;padding:32px;display:grid}.section-state[data-state=loading]{background:linear-gradient(100deg, var(--surface) 30%, var(--surface-alt) 50%, var(--surface) 70%) 0 0 / 300% 100%;border-style:solid;animation:1.4s linear infinite shimmer}@keyframes shimmer{to{background-position:-150% 0}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important;animation-iteration-count:1!important}}.site-header{z-index:10;-webkit-backdrop-filter:saturate(1.4)blur(12px);background:#faf4e8db;border-bottom:1px solid #0000;position:sticky;top:0}.site-header:after{content:"";background:var(--border);opacity:.8;height:1px;position:absolute;inset:auto 0 0}.site-header__inner{height:var(--header-h);justify-content:space-between;align-items:center;gap:12px;display:flex}.site-header__brand{min-width:0;color:var(--text);font-family:var(--font-serif);align-items:center;gap:10px;font-weight:700;text-decoration:none;display:inline-flex}.site-header__name{letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(1.05rem,.95rem + .5vw,1.3rem);overflow:hidden}.site-header__nav{flex:none;gap:4px;margin:0;padding:0;list-style:none;display:flex}.site-header__nav a{min-height:44px;color:var(--text);white-space:nowrap;transition:background-color var(--dur) var(--ease);border-radius:999px;align-items:center;padding:0 12px;font-size:clamp(.85rem,.8rem + .25vw,.95rem);font-weight:600;text-decoration:none;display:inline-flex}.site-header__nav a:hover{background:var(--surface-alt)}@media (width<=420px){.site-header__nav a{padding:0 8px}}.hero{text-align:center;padding-block:clamp(72px,10vw,136px) clamp(56px,8vw,104px);position:relative;overflow:hidden}.hero__decor{pointer-events:none;position:absolute;inset:0}.hero__blob{filter:blur(60px);opacity:.55;border-radius:50%;position:absolute}.hero__blob--a{aspect-ratio:1;background:radial-gradient(circle,#f0c9a0,#0000 70%);width:min(460px,70vw);top:-160px;left:-80px}.hero__blob--b{aspect-ratio:1;background:radial-gradient(circle,#e9d5b0,#0000 70%);width:min(420px,70vw);top:8%;right:-140px}.hero__inner{position:relative}.hero__title{max-width:15em;font-size:var(--fs-hero);margin-inline:auto;line-height:1.25}.hero__lead{max-width:34em;color:var(--text-muted);margin:24px auto 0;font-size:clamp(1rem,.95rem + .3vw,1.125rem)}.hero__lead strong{color:var(--text);font-weight:600}.hero__actions{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:36px;display:flex}@media (width<=520px){.hero__br{display:none}}
