@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&family=Cinzel+Decorative:wght@400;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&display=swap');

:root{--bg:#080808;--surface:#111;--surface2:#171717;--text:#f2eee7;--muted:#aaa49a;--gold:#b4935d;--line:rgba(255,255,255,.14);--display:"Cinzel Decorative","Times New Roman",serif;--engraved:"Cinzel","Times New Roman",serif;--serif:"Cormorant Garamond","Iowan Old Style","Palatino Linotype",Palatino,"Times New Roman",serif;--sans:Inter,Helvetica,Arial,sans-serif;--max:1360px;--text-max:720px;--gutter:clamp(24px,5vw,76px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:17px;line-height:1.78;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{width:100%;display:block;object-fit:cover}.container{width:min(var(--max),calc(100% - var(--gutter)*2));margin-inline:auto}.site-header{position:fixed;inset:0 0 auto;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:22px var(--gutter);transition:.3s}.site-header.scrolled,.inner-page .site-header{background:rgba(8,8,8,.93);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--gold);color:var(--gold);font:20px/1 var(--serif)}.brand-name{font-size:11px;letter-spacing:.23em;font-weight:600}.site-nav{display:flex;gap:32px}.site-nav a,.menu-button{font-size:10px;letter-spacing:.2em;text-transform:uppercase}.site-nav a{padding-block:8px;border-bottom:1px solid transparent}.site-nav a:hover,.site-nav a.active{border-color:var(--gold);color:var(--text)}.menu-button{display:none;background:none;border:0;color:var(--text)}
.eyebrow{margin:0 0 24px;color:var(--gold);font-size:clamp(16px,1.25vw,18px);line-height:1.4;font-weight:600;letter-spacing:.2em;text-transform:uppercase}.hero-title{font-family:var(--display);font-size:clamp(54px,5.8vw,86px);font-weight:400;line-height:.98;letter-spacing:-.025em;margin:0}.hero-subtitle,.page-intro,.body-lg{font-family:var(--serif);font-size:clamp(20px,1.65vw,25px);line-height:1.62;color:#c5bfb5}.title-xl{font:500 clamp(48px,4.8vw,72px)/1.01 var(--serif);letter-spacing:-.025em;margin:0}.title-lg{font:500 clamp(38px,3.7vw,58px)/1.05 var(--serif);letter-spacing:-.015em;margin:0}.title-md{font:500 clamp(29px,2.5vw,40px)/1.14 var(--serif);margin:0}.title-sm{font:500 clamp(25px,2vw,32px)/1.15 var(--serif);margin:0}.body-md{font-size:17px;line-height:1.8;color:var(--muted)}.text-link{display:inline-block;margin-top:28px;padding-bottom:5px;border-bottom:1px solid var(--gold);font-size:10px;font-weight:600;letter-spacing:.19em;text-transform:uppercase}.section{padding-block:clamp(96px,10vw,150px)}
.home-hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;padding:0 0 clamp(72px,9vh,110px);overflow:hidden}.hero-media,.hero-slide{position:absolute;inset:0;margin:0}.hero-slide{opacity:0;visibility:hidden;transition:opacity 1.25s,visibility 1.25s}.hero-slide.active{opacity:1;visibility:visible}.hero-slide img{height:100%;object-position:center;filter:brightness(.72) saturate(.82)}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.92),rgba(0,0,0,.56) 48%,rgba(0,0,0,.28)),linear-gradient(0deg,rgba(0,0,0,.86),rgba(0,0,0,.06) 64%)}.hero-content{position:relative;z-index:2}.hero-content .hero-subtitle{max-width:580px;margin:34px 0 0}.hero-dots{position:absolute;right:var(--gutter);bottom:44px;z-index:2;display:flex;gap:10px}.dot{width:34px;height:12px;padding:0;border:0;background:linear-gradient(transparent 5px,#646464 5px,#646464 6px,transparent 6px);cursor:pointer}.dot.active{background:linear-gradient(transparent 5px,var(--gold) 5px,var(--gold) 6px,transparent 6px)}.intro-grid,.editorial-grid{display:grid;grid-template-columns:minmax(140px,240px) minmax(0,1fr);gap:clamp(35px,7vw,110px)}.intro-grid>div,.editorial-grid>div{max-width:890px}.intro-grid .body-lg{max-width:760px;margin-top:38px}.feature-project{background:var(--surface)}.feature-project>a img{height:min(72vw,860px)}.feature-copy{padding-block:65px 85px}.feature-copy .body-md{max-width:680px}.split-preview{display:grid;grid-template-columns:1fr 1fr;gap:1px}.preview-card{padding:clamp(44px,5vw,72px);background:var(--surface);min-height:380px;display:flex;flex-direction:column;align-items:flex-start}.preview-card .text-link{margin-top:auto}.page-hero{padding-top:clamp(112px,9vw,132px);padding-bottom:clamp(90px,9vw,130px)}.page-title{font:400 clamp(54px,6vw,88px)/1 var(--display);letter-spacing:-.025em;margin:0}.page-intro{max-width:var(--text-max);margin:38px 0 0}.wide-image img{height:min(72vw,900px)}.prose{max-width:var(--text-max)}.prose p{font-size:18px;line-height:1.9;color:var(--muted);margin:28px 0}.dark-panel{background:var(--surface)}.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:1px}.principles article{background:var(--surface);padding:44px;min-height:300px}.principles span{font-size:10px;color:var(--gold)}.principles h3{margin:30px 0 18px}.principles p{color:var(--muted)}
.portfolio-list{padding-bottom:140px}.portfolio-item{display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(40px,7vw,100px);align-items:center;padding-block:75px;border-top:1px solid var(--line)}.portfolio-image img{aspect-ratio:4/3}.portfolio-info p:not(.eyebrow){color:var(--muted)}.status{display:inline-block;margin-top:24px;color:#777;font-size:13px}.muted-project img{filter:saturate(.55) brightness(.72)}
.about-logo{display:flex;justify-content:center;padding-block:clamp(48px,7vw,96px)}.about-logo img{width:clamp(260px,42vw,680px);height:auto;object-fit:contain}
.process{display:grid;grid-template-columns:220px 1fr;gap:70px}.process ol{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}.process li{display:grid;grid-template-columns:60px 1fr;gap:22px;padding:32px 0;border-bottom:1px solid var(--line)}.process li>span{font-size:10px;color:var(--gold);padding-top:8px}.process li p{color:var(--muted);max-width:760px;margin:10px 0 0}.price-grid,.faq,.project-details{display:grid;grid-template-columns:220px 1fr;gap:70px}.price-list{border-top:1px solid var(--line)}.price-list>div{display:flex;align-items:baseline;justify-content:space-between;gap:30px;padding:27px 0;border-bottom:1px solid var(--line)}.price-list p{color:var(--gold);white-space:nowrap}.faq details{border-top:1px solid var(--line);padding:24px 0}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{cursor:pointer;font:400 26px var(--serif)}.faq details p{color:var(--muted);max-width:760px}.contact-cta{padding:125px 0;background:var(--surface)}.button{display:inline-flex;margin-top:40px;min-height:54px;padding:0 26px;align-items:center;background:var(--gold);color:#0a0a0a;font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:700}
.project-hero{padding:120px 0 110px;background:var(--surface)}.project-title{font:400 clamp(64px,7.5vw,112px)/.95 var(--display);letter-spacing:-.02em;margin:0}.project-meta{font-family:var(--serif);font-size:20px;color:var(--muted);margin-top:28px}.project-cover img{height:min(76vw,920px)}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-bottom:120px}.gallery img{aspect-ratio:4/3}.gallery img:first-child{grid-column:1/-1;aspect-ratio:16/8}.project-details dl{margin:0;border-top:1px solid var(--line)}.project-details dl>div{display:contents}.project-details dt,.project-details dd{padding:22px 0;border-bottom:1px solid var(--line)}.project-details dt{color:var(--muted)}.project-details dd{margin:0}.next-project{padding:120px 0;background:var(--surface)}
.daytona-gallery img,.daytona-gallery img:first-child{grid-column:auto;aspect-ratio:3/4;object-position:center}
.roger-gallery img:not(:first-child){aspect-ratio:3/4;object-position:center}
.site-footer{display:grid;grid-template-columns:1.7fr .55fr .65fr auto;gap:48px;padding:72px var(--gutter) 48px;border-top:1px solid var(--line);color:#7f7a72;font-size:11px}.footer-brand{color:var(--text);margin-bottom:20px}.footer-links{display:flex;flex-direction:column;gap:12px}.copyright{align-self:end;text-align:right}.reveal{opacity:0;transform:translateY(22px);transition:.85s}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){body{font-size:16px}.site-header{padding:17px 22px}.menu-button{display:block;position:relative;z-index:40}.site-nav{position:fixed;inset:0;background:var(--bg);flex-direction:column;align-items:center;justify-content:center;font-size:14px;transform:translateY(-100%);transition:.35s}.site-nav.open{transform:none}.hero-title{font-size:clamp(58px,15vw,78px)}.hero-content{width:calc(100% - 48px)}.hero-dots{right:24px}.intro-grid,.editorial-grid,.process,.price-grid,.faq,.project-details{grid-template-columns:1fr;gap:28px}.split-preview,.principles,.portfolio-item{grid-template-columns:1fr}.portfolio-item{gap:34px}.portfolio-info{padding-bottom:22px}.price-list>div{align-items:flex-start;flex-direction:column;gap:3px}.gallery{grid-template-columns:1fr}.gallery img:first-child{grid-column:auto;aspect-ratio:4/3}.site-footer{grid-template-columns:1fr 1fr}.copyright{text-align:left}.page-title{font-size:clamp(60px,16vw,88px)}.feature-project>a img,.wide-image img,.project-cover img{height:68vh}.principles article{min-height:0}.project-hero{padding:105px 0 80px}}
@media(max-width:520px){.site-footer{grid-template-columns:1fr}.copyright{align-self:auto}.page-hero{padding-top:104px}.title-xl{font-size:46px}.title-lg{font-size:39px}.title-md{font-size:31px}.home-hero{padding-bottom:75px}.hero-subtitle{font-size:17px}.feature-project>a img,.wide-image img,.project-cover img{height:58vh}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.hero-slide{transition:none}}

.site-footer a{transition:color .2s ease}.site-footer a:hover{color:var(--text)}
.site-footer>div:first-child>p{max-width:340px;line-height:1.8}
.footer-links a{width:max-content}
.brand img {
  width: 55px;
  height: auto;
  display: block;
}
.footer-brand .footer-logo-image {
  width: 38px;
  height: auto;
}
/* 左側小標題 */
.intro-grid .eyebrow {
  font-size: 20px;
}

/* 中間大型標題 */
.intro-grid .title-xl {
  font-size: clamp(30px, 5vw, 72px);
}

/* 下方說明文字 */
.intro-grid > div > p {
  font-size: 18px;
}
.page-hero .page-title {
  max-width: 900px;
  font-family: var(--serif);
  font-size: clamp(30px, 3.4vw, 44px);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.015em;
}
.page-hero .eyebrow {
  margin-bottom: clamp(20px, 2.5vw, 30px);
  font-family: var(--engraved);
  font-size: clamp(40px, 5vw, 66px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.015em;
  text-transform: none;
}
.project-hero .eyebrow {
  font-family: var(--sans);
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 600;
  letter-spacing: .2em;
}
.project-hero .project-title {
  font-family: var(--engraved);
  font-size: clamp(50px, 6.5vw, 90px);
  font-weight: 500;
  line-height: .98;
  letter-spacing: .005em;
}

/* Compact commission layout */
.commission-page .page-hero{padding-bottom:64px}
.commission-page .page-intro{max-width:650px;margin-top:28px}
.commission-page .section{padding-block:clamp(58px,6vw,82px)}
.commission-page .process,
.commission-page .price-grid,
.commission-page .faq{grid-template-columns:180px minmax(0,1fr);gap:clamp(34px,5vw,64px)}
.commission-page .process li{grid-template-columns:44px minmax(0,1fr);gap:16px;padding:21px 0}
.commission-page .process li>span{padding-top:5px}
.commission-page .process li .title-sm,
.commission-page .price-list .title-sm{font-size:clamp(23px,1.8vw,28px)}
.commission-page .process li p{max-width:680px;margin-top:6px;font-size:15px;line-height:1.65}
.commission-page .price-list>div{padding:19px 0}
.commission-page .price-list p{margin-block:0;font-size:15px}
.commission-page .faq details{padding:17px 0}
.commission-page .faq summary{font-size:23px}
.commission-page .faq details p{max-width:680px;margin:12px 0 4px;font-size:15px;line-height:1.65}
.commission-page .contact-cta{padding:clamp(66px,7vw,90px) 0}
.commission-page .contact-cta .title-xl{font-size:clamp(40px,4vw,58px)}
.commission-page .button{margin-top:30px}
.commission-page .commission-hero{padding-bottom:clamp(46px,5vw,68px);border-bottom:1px solid var(--line)}
.commission-overview{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:clamp(60px,9vw,140px);padding-block:clamp(54px,7vw,92px)}
.commission-copy{max-width:690px}
.commission-block+.commission-block{margin-top:clamp(34px,4vw,52px)}
.commission-block h2{margin:0 0 17px;font:600 clamp(20px,2vw,26px)/1.2 var(--serif);color:var(--text)}
.commission-block p{margin:0 0 14px;color:#d0cbc2;font-size:15px;line-height:1.72}
.commission-block strong{color:var(--text);font-weight:600}
.commission-statement{color:var(--gold)!important;font-family:var(--serif);font-size:18px!important;font-weight:600}
.commission-action{align-self:start;position:sticky;top:126px;padding:0;background:transparent}
.commission-action h2{margin:0 0 34px;font:600 clamp(27px,2.6vw,36px)/1.08 var(--serif)}
.commission-form{display:grid;gap:30px}
.commission-form label{display:block;border-bottom:1px solid rgba(255,255,255,.32)}
.commission-form label span{display:block;margin-bottom:6px;color:#c9c4ba;font-size:14px;line-height:1.4}
.commission-form label b{color:var(--gold);font-weight:500}
.commission-form input,.commission-form textarea{display:block;width:100%;padding:5px 0 12px;border:0;outline:0;resize:vertical;background:transparent;color:var(--text);font:16px/1.5 var(--sans);border-radius:0}
.commission-form input:focus,.commission-form textarea:focus{box-shadow:0 1px 0 var(--gold)}
.commission-form label:focus-within{border-color:var(--gold)}
.commission-form button{justify-self:start;min-height:46px;margin-top:6px;padding:0 19px;border:1px solid #f2eee7;background:#f2eee7;color:#090909;font:500 13px/1 var(--sans);cursor:pointer;transition:.25s}
.commission-form button:hover{background:transparent;color:var(--text)}
.commission-email{display:inline-block;margin-top:30px;padding-bottom:2px;border-bottom:1px solid var(--line);color:var(--muted);font-size:13px}
.commission-email:hover{color:var(--text)}

@media(max-width:900px){
  .commission-page .process,
  .commission-page .price-grid,
  .commission-page .faq{grid-template-columns:1fr;gap:20px}
  .commission-overview{grid-template-columns:1fr;gap:52px}
  .commission-action{position:static}
}

@media(max-width:520px){
  .commission-page .page-hero{padding-bottom:48px}
  .commission-page .section{padding-block:52px}
  .commission-page .process li{padding:18px 0}
  .commission-overview{padding-block:44px;gap:42px}
  .commission-action{padding:28px 24px}
}

.featured-works{padding-block:clamp(82px,9vw,130px)}
.featured-works>h2{margin:0 0 clamp(32px,4vw,56px);font:600 clamp(30px,3vw,44px)/1.1 var(--sans);letter-spacing:-.025em}
.featured-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(38px,5vw,72px) clamp(22px,3vw,40px)}
.featured-card{display:block}
.featured-image{overflow:hidden;background:var(--surface);aspect-ratio:16/9}
.featured-image img{height:100%;filter:brightness(.8) saturate(.78);transition:transform .7s ease,filter .5s ease}
.featured-card:hover .featured-image img{transform:scale(1.025);filter:brightness(.95) saturate(.9)}
.featured-card-copy{position:relative;padding:24px 0 8px;border-top:1px solid var(--line);margin-top:18px}
.featured-card-copy h3{margin:0;font-size:15px;line-height:1.4;font-weight:600}
.featured-card-copy p{margin:12px 0 0;color:var(--muted);font-size:14px;line-height:1.6}
.featured-card-copy span{position:absolute;top:24px;right:0;color:var(--gold);font-size:9px;letter-spacing:.16em;text-transform:uppercase;opacity:0;transform:translateX(-8px);transition:.3s}
.featured-card:hover .featured-card-copy span{opacity:1;transform:none}

@media(max-width:650px){
  .featured-grid{grid-template-columns:1fr;gap:48px}
  .featured-image{aspect-ratio:4/3}
  .featured-card-copy span{position:static;display:inline-block;margin-top:14px;opacity:1;transform:none}
}

.site-nav .language-switch{margin-left:10px;padding-inline:12px;border:1px solid var(--line);color:var(--gold)}
.site-nav .language-switch:hover{border-color:var(--gold)}

/* Traditional Chinese typography and layout */
html[lang="zh-Hant"] body{font-family:"PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif;line-height:1.75;word-break:normal}
html[lang="zh-Hant"] .site-nav{gap:26px}
html[lang="zh-Hant"] .site-nav a,
html[lang="zh-Hant"] .menu-button{letter-spacing:.12em;text-transform:none}
html[lang="zh-Hant"] .eyebrow{font-family:"PingFang TC","Microsoft JhengHei",sans-serif;letter-spacing:.14em;text-transform:none}
html[lang="zh-Hant"] .page-hero .eyebrow{font-family:"Noto Serif TC","Songti TC","Microsoft JhengHei",serif;font-size:clamp(38px,4.5vw,58px);font-weight:600;line-height:1.08;letter-spacing:.04em}
html[lang="zh-Hant"] .page-hero .page-title{max-width:780px;font-family:"Noto Serif TC","Songti TC","Microsoft JhengHei",serif;font-size:clamp(29px,3.2vw,42px);line-height:1.35;letter-spacing:.01em}
html[lang="zh-Hant"] .hero-subtitle,
html[lang="zh-Hant"] .page-intro,
html[lang="zh-Hant"] .body-lg{font-family:"Noto Serif TC","Songti TC","Microsoft JhengHei",serif;line-height:1.7;letter-spacing:.02em}
html[lang="zh-Hant"] .title-xl,
html[lang="zh-Hant"] .title-lg,
html[lang="zh-Hant"] .title-md,
html[lang="zh-Hant"] .title-sm{font-family:"Noto Serif TC","Songti TC","Microsoft JhengHei",serif;line-height:1.35;letter-spacing:.01em}
html[lang="zh-Hant"] .featured-works>h2{font-size:clamp(28px,3vw,40px);letter-spacing:.02em}
html[lang="zh-Hant"] .featured-card-copy h3{font-size:16px}
html[lang="zh-Hant"] .featured-card-copy p{min-height:1.6em}
html[lang="zh-Hant"] .commission-block h2,
html[lang="zh-Hant"] .commission-action h2{font-family:"Noto Serif TC","Songti TC","Microsoft JhengHei",serif;line-height:1.4}
html[lang="zh-Hant"] .commission-block p{line-height:1.8}

@media(max-width:900px){
  .site-nav .language-switch{margin:12px 0 0}
  html[lang="zh-Hant"] .site-nav{gap:24px}
  html[lang="zh-Hant"] .hero-content{width:calc(100% - 48px)}
}
@media(max-width:520px){
  html[lang="zh-Hant"] .page-hero .eyebrow{font-size:38px}
  html[lang="zh-Hant"] .page-hero .page-title{font-size:29px}
  html[lang="zh-Hant"] .title-xl{font-size:38px}
  html[lang="zh-Hant"] .title-lg{font-size:34px}
  html[lang="zh-Hant"] .title-md{font-size:28px}
  html[lang="zh-Hant"] .hero-subtitle{font-size:18px}
}