@charset "UTF-8";

/* ==== style.css ==== */
:root{--paper:#f6f4ee;--ink:#343d33;--muted:#777b70;--line:#d8d9cd;--serif:Georgia,"Noto Serif TC","PMingLiU",serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Microsoft JhengHei",Arial,sans-serif;line-height:1.8}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}img{display:block;width:100%;object-fit:cover}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #9f744e;outline-offset:6px}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:400}h2{font-family:var(--serif);font-size:clamp(26px,3vw,42px);line-height:1.5;letter-spacing:.08em}.wrap{width:88%;max-width:1360px;margin:auto}.eyebrow{font-size:11px;letter-spacing:.2em;font-weight:600;margin-bottom:22px}.header{height:106px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;background:var(--paper);position:sticky;top:0;z-index:10;border-bottom:1px solid var(--line)}.brand{display:flex;gap:15px;align-items:center}.brand-symbol{font:50px Georgia;border-left:1px solid var(--ink);line-height:1;padding-left:9px;position:relative}.brand-symbol span{position:absolute;font-size:35px;left:17px;top:5px}.brand strong{font-size:26px;font-weight:400;letter-spacing:.23em;display:block;line-height:1.3}.brand small{font-size:10px;letter-spacing:.2em}.header nav{display:flex;align-items:center;gap:38px;font-size:13px;letter-spacing:.1em}.nav-cta{border:1px solid var(--ink);padding:10px 20px}.nav-cta span{margin-left:30px}.menu-toggle{display:none}.hero{display:grid;grid-template-columns:41% 59%;min-height:650px;height:calc(100svh - 106px);max-height:850px}.hero-copy{padding:68px 12% 35px 14.6%;display:flex;flex-direction:column;justify-content:center}.hero h1{font:clamp(38px,4.3vw,68px)/1.5 var(--serif);letter-spacing:.08em;white-space:nowrap}.accent{color:#8d927f}.hero-description{font-size:13px;line-height:2.2;margin:30px 0 35px;color:#6c7367}.button{display:inline-flex;justify-content:space-between;align-items:center;gap:55px;padding:16px 24px;font-size:13px;width:max-content;border:1px solid transparent;transition:background .2s}.dark{background:var(--ink);color:white}.dark:hover{background:#555e4e}.light{background:var(--paper);color:var(--ink)}.light:hover{background:#d9ddcb}.hero-foot{display:flex;justify-content:space-between;gap:14px;font-size:9px;letter-spacing:.12em;margin-top:auto;padding-top:65px}.hero-image{position:relative;overflow:hidden}.hero-image>img{height:100%;object-position:55% center}.hero-image:after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#20291f77);pointer-events:none}.image-caption{position:absolute;bottom:37px;left:35px;right:35px;display:flex;justify-content:space-between;gap:20px;color:white;z-index:1;font-size:11px;letter-spacing:.1em}.scroll-cue{position:absolute;top:30px;right:30px;width:45px;height:45px;border:1px solid #ffffffaa;border-radius:50%;display:grid;place-items:center;color:white;font-size:24px}.intro{text-align:center;padding:105px 0 100px;border-bottom:1px solid var(--line)}.intro>p:last-child{font-size:14px;color:var(--muted);line-height:2.1;margin-top:25px}.projects{padding:90px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px}.section-head>p{font-size:13px;color:var(--muted)}.filters{display:flex;gap:30px;margin:38px 0 30px;border-bottom:1px solid var(--line)}.filters button{border:0;background:none;padding:10px 0 14px;font-size:13px;color:var(--muted);border-bottom:2px solid transparent}.filters .active{color:var(--ink);border-color:var(--ink)}sup{font-size:9px;margin-left:8px}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px 35px}.project-card{border:0;background:none;text-align:left;padding:0}.project-card[hidden]{display:none}.project-photo{position:relative;overflow:hidden}.project-photo img{height:480px;transition:transform .6s}.project-card:nth-child(even){padding-top:70px}.project-card:hover img{transform:scale(1.04)}.project-open{position:absolute;bottom:20px;right:20px;background:var(--paper);border-radius:50%;width:45px;height:45px;display:grid;place-items:center;font-size:22px}.project-caption{display:flex;justify-content:space-between;align-items:center;margin-top:18px}.project-caption small{font-size:9px;letter-spacing:.16em;color:var(--muted)}.project-caption h3{font:23px var(--serif);letter-spacing:.08em;margin-top:8px}.project-number{font:22px Georgia;color:#939a87}.collection-note{font-size:11px;color:var(--muted);margin-top:30px}.about{display:grid;grid-template-columns:1fr 1fr;background:#e8e9e0}.about-image{overflow:hidden}.about-image img{height:100%;min-height:590px;object-position:25% center}.about-copy{padding:80px 12%;display:flex;flex-direction:column;justify-content:center}.about-copy>p:not(.eyebrow){font-size:14px;color:#656e5f;line-height:2;margin-top:25px}.text-link{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid currentColor;padding-bottom:10px;width:max-content;gap:30px;font-size:13px}.about .text-link{margin-top:30px}.about-signature{font:italic 22px Georgia;color:#818975;margin-top:50px}.services{padding:100px 0}.service-list{margin-top:45px;border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}.service-list summary{display:flex;align-items:center;gap:30px;padding:25px 0}.service-no{font:17px Georgia;color:#929988;width:50px}.service-list h3{font:24px var(--serif);letter-spacing:.04em}.service-en{margin-left:auto;font-size:10px;letter-spacing:.12em;color:var(--muted)}.plus{font-size:25px;width:25px;text-align:center;transition:transform .2s}details[open] .plus{transform:rotate(45deg)}.service-list details>p{max-width:760px;padding:0 40px 25px 80px;font-size:14px;color:var(--muted)}.process{padding:20px 0 90px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:35px;margin-top:45px}.steps article{border-top:1px solid var(--line);padding-top:20px}.steps span{font:32px Georgia;color:#939a87}.steps h3{font-size:18px;margin:15px 0}.steps p{font-size:13px;color:var(--muted)}.faq{border-top:1px solid var(--line);padding:70px 0 100px;display:grid;grid-template-columns:1fr 1.1fr;gap:50px}.faq h2{font-size:28px}.faq summary{padding:20px 0;display:flex;justify-content:space-between;gap:20px;font-size:14px}.faq details p{font-size:13px;color:var(--muted);padding-bottom:20px}.contact{background:var(--ink);color:var(--paper);padding:85px 0}.contact-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:100px}.contact h2{font-size:clamp(32px,4vw,52px)}.contact .eyebrow{color:#bec6af}.contact h2+p{color:#bcc3b4;margin:20px 0 30px;font-size:14px}.contact-info{border-left:1px solid #ffffff33;padding-left:60px}.contact-info>div+div{margin-top:35px}.contact-info small{display:block;letter-spacing:.18em;font-size:10px;margin-bottom:10px;color:#bcc3b4}.phone{font:clamp(25px,3vw,40px) Georgia;letter-spacing:.06em}.contact-info .text-link{margin-top:10px}.visit-note{font-size:12px;color:#bcc3b4;margin-top:35px}.footer{display:flex;align-items:center;justify-content:space-between;padding:35px 0;gap:30px}.footer-brand{font:25px Georgia;letter-spacing:.15em}.footer-brand span{display:block;font:9px "Microsoft JhengHei",sans-serif;letter-spacing:.1em;margin-top:5px}.footer p,.footer>a:last-child{font-size:10px;color:var(--muted)}.skip{position:fixed;top:-80px;left:20px;padding:10px;background:var(--ink);color:white;z-index:30}.skip:focus{top:10px}dialog{border:0;padding:0;max-width:1000px;width:90%;max-height:90svh;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#1c211dcc}dialog>img{height:55svh;object-fit:contain;background:#e5e5dc}.dialog-close{position:sticky;top:15px;float:right;right:15px;margin:15px 15px -60px 0;z-index:2;border:0;border-radius:50%;width:40px;height:40px;background:var(--paper);font-size:25px}.dialog-copy{padding:30px 40px}.dialog-copy .eyebrow{margin-bottom:10px}.dialog-copy p:not(.eyebrow){font-size:13px;color:var(--muted);margin:15px 0}.dialog-nav{display:flex;align-items:center;justify-content:space-between;padding:15px 40px;border-top:1px solid var(--line);font-size:12px}.dialog-nav button{border:0;background:none;padding:10px}body.modal-open{overflow:hidden}
@media(min-width:1600px){.hero-copy{padding-left:max(14.6%,calc((100vw - 1360px)/2))}}@media(max-width:1100px){.header nav{gap:22px}.hero{min-height:560px}.hero-copy{padding-top:45px;padding-right:8%}.hero h1{font-size:43px}.hero-foot{flex-direction:column;padding-top:35px}.project-photo img{height:390px}.about-copy{padding:60px 9%}.service-en{display:none}.contact-grid{gap:50px}}
@media(max-width:760px){html{scroll-padding-top:80px}.header{height:80px;padding:0 6%}.brand strong{font-size:21px}.brand-symbol{font-size:40px}.brand small{font-size:8px}.menu-toggle{display:flex;gap:15px;border:0;background:none;font-size:12px;padding:12px 0}.header nav{display:none;position:absolute;top:80px;left:0;right:0;padding:25px 6% 35px;background:var(--paper);border-bottom:1px solid var(--line)}.header nav.is-open{display:flex;flex-direction:column;align-items:stretch;gap:0}.header nav>a{padding:14px 0}.header nav .nav-cta{padding:12px 18px;margin-top:15px;display:flex;justify-content:space-between}.hero{grid-template-columns:1fr;height:auto;max-height:none;min-height:0}.hero-copy{padding:50px 6% 30px}.hero .eyebrow{margin-bottom:20px}.hero h1{font-size:43px}.hero-description{margin:22px 0 25px}.hero-foot{flex-direction:row;padding-top:35px;font-size:8px}.hero-image{height:440px}.image-caption{left:20px;right:20px;bottom:22px;font-size:9px}.intro{padding:65px 0}.intro h2{font-size:25px}.intro>p:last-child{font-size:12px}.projects{padding:60px 0}.section-head{display:block}.section-head>p{margin-top:20px}.project-grid{gap:30px 16px}.project-photo img{height:280px}.project-card:nth-child(even){padding-top:35px}.project-caption h3{font-size:17px}.project-caption small{font-size:7px;letter-spacing:.06em}.project-number{display:none}.project-open{width:32px;height:32px;bottom:10px;right:10px;font-size:17px}.filters{gap:24px}.filters button{font-size:12px}.collection-note{font-size:9px}.about{grid-template-columns:1fr}.about-image img{height:380px;min-height:0}.about-copy{padding:50px 6%}.about-signature{margin-top:35px}.services{padding:60px 0}.service-list summary{gap:15px}.service-no{width:25px;font-size:14px}.service-list h3{font-size:19px}.plus{margin-left:auto}.service-list details>p{padding-left:40px;padding-right:5px;font-size:12px}.steps{grid-template-columns:1fr 1fr;gap:30px 25px}.process{padding-bottom:60px}.faq{grid-template-columns:1fr;gap:25px;padding:50px 0 65px}.faq h2{font-size:25px}.contact{padding:60px 0}.contact-grid{grid-template-columns:1fr;gap:45px}.contact-info{border-left:0;border-top:1px solid #ffffff33;padding:30px 0 0}.phone{font-size:32px}.footer{flex-wrap:wrap;gap:20px}.footer p{order:3;width:100%}.dialog-copy{padding:25px}.dialog-copy h2{font-size:25px}.dialog-nav{padding:10px 20px}dialog>img{height:45svh}}
@media(max-width:420px){.project-grid{grid-template-columns:1fr}.project-card:nth-child(even){padding-top:0}.project-photo img{height:350px}.hero h1{font-size:38px}.hero-image{height:330px}.image-caption span:last-child{display:none}.filters{gap:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

.page-heading{padding:75px 0 65px}.page-heading h1{font:clamp(30px,4vw,55px)/1.5 var(--serif);letter-spacing:.06em}.breadcrumb{font-size:11px;color:var(--muted);margin-top:25px}.footer-links{display:flex;justify-content:center;gap:40px;padding:30px 6%;border-bottom:1px solid var(--line);font-size:12px}.header nav{gap:25px}@media(max-width:760px){.page-heading{padding:45px 0}.footer-links{gap:20px;font-size:10px}}
/* Official DILINA logo: preserve the full artwork and original colors. */
.header{height:140px;background:#343d33;color:#f6f4ee;border-bottom-color:#ffffff25}
.brand{flex-shrink:0}.brand-logo{width:96px;height:112px;object-fit:contain}
.header .nav-cta{border-color:#d5b777}.header nav>a:hover{color:#d5b777}
html{scroll-padding-top:150px}.hero{height:calc(100svh - 140px)}
.footer-brand{display:block;background:#343d33;padding:12px 20px;line-height:0}
.footer-brand img{width:90px;height:104px;object-fit:contain}
@media(max-width:760px){.header{height:108px}.brand-logo{width:72px;height:84px}.header nav{top:108px;background:#343d33;color:#f6f4ee;border-bottom-color:#ffffff25}html{scroll-padding-top:118px}.hero{height:auto}.footer-brand img{width:72px;height:84px}}
/* Consistent editorial alignment across all pages. */
.intro{text-align:left;display:grid;grid-template-columns:1fr 1fr;column-gap:60px;align-items:start}
.intro .eyebrow{grid-column:1 / -1}.intro h2{max-width:650px}.intro>p:last-child{margin-top:0}
.section-head{align-items:start}.section-head>p{padding-top:43px;max-width:360px}
.footer-links{width:88%;max-width:1360px;margin:auto;justify-content:flex-start;padding:30px 0}
.footer{align-items:flex-start}.footer p{margin-right:auto}.hero-copy{padding-left:14.634%;padding-right:8%}
.hero-foot{justify-content:flex-start;gap:24px}.hero-image>img{object-position:center}
.image-caption{align-items:flex-start}.contact-grid{grid-template-columns:1fr 1fr;gap:60px}
.faq{grid-template-columns:1fr 1fr;gap:60px}
@media(min-width:1600px){.hero-copy{padding-left:14.634%}}
@media(max-width:1100px){.intro,.contact-grid,.faq{gap:35px}.hero-foot{gap:10px}}
@media(max-width:760px){.intro{display:block}.intro>p:last-child{margin-top:22px}.section-head>p{padding-top:0}.hero-copy{padding:50px 6% 30px}.hero-foot{justify-content:space-between}.contact-grid,.faq{grid-template-columns:1fr;gap:35px}.footer-links{padding:25px 0;gap:20px;flex-wrap:wrap}}
/* Brand palette drawn from the supplied black, white and gold logo. */
:root{--paper:#faf8f3;--ink:#24211d;--muted:#756e63;--line:#ded5c5;--gold:#b88a27;--gold-light:#e1c778}
body{background:var(--paper);color:var(--ink)}
.header{background:#171614;color:#faf8f3;border-bottom:1px solid #a47d32}
.header .nav-cta{border-color:var(--gold-light);color:var(--gold-light)}
.header nav>a:hover{color:var(--gold-light)}
.accent{color:var(--gold)}.eyebrow{color:#967024}.header .eyebrow{color:var(--gold-light)}
.hero-description,.intro>p:last-child,.section-head>p,.steps p,.service-list details>p,.faq details p,.collection-note{color:var(--muted)}
.dark{background:#24211d;color:#fff9ec}.dark:hover{background:#574323}
.light{background:#f7edda;color:#24211d}.light:hover{background:#e1c778}
.nav-cta,.button{transition:background .2s,color .2s}
.project-number,.service-no,.steps span{color:var(--gold)}
.filters .active{border-color:var(--gold);color:#34291c}
.project-open{background:#faf8f3;color:#795716}
.about{background:#eee7d9}.about-copy>p:not(.eyebrow){color:#6a6154}
.about-signature{color:#967024}.text-link{border-bottom-color:#b88a2766}
.contact{background:#1e1b17;color:#faf8f3;border-top:3px solid var(--gold)}
.contact .eyebrow,.contact-info small{color:var(--gold-light)}
.contact h2+p,.visit-note{color:#c8bca7}.contact-info{border-color:#b88a2755}
.footer-brand{background:#171614}.footer p,.footer>a:last-child{color:var(--muted)}
.scroll-cue{border-color:#f4e7cbaa;color:#fff9eb}
.hero-image:after{background:linear-gradient(transparent,#211a1377)}
.image-caption{color:#fff9eb}dialog>img{background:#eae2d3}dialog::backdrop{background:#17120ddd}
.skip{background:#24211d;color:#fff9ec}
@media(max-width:760px){.header nav{background:#171614;color:#faf8f3;border-bottom-color:#b88a2766}.contact-info{border-top-color:#b88a2755}}
/* Restrained neutral palette; gold stays within the official artwork. */
:root{--paper:#faf9f6;--ink:#282725;--muted:#797773;--line:#e2dfd8;--gold:#a39479;--gold-light:#c7bcaa}
body{background:var(--paper)}
.header{background:#faf9f6;color:#282725;border-bottom:1px solid var(--line)}
.brand{background:#22211f;padding:9px 16px}.brand-logo{height:94px;width:82px}
.header .nav-cta{border-color:#bdb9b1;color:#282725}.header nav>a:hover{color:#77736b}
.accent{color:#77736b}.eyebrow{color:#77736b}
.dark{background:#282725;color:#faf9f6}.dark:hover{background:#4a4844}
.light{background:#faf9f6;color:#282725}.light:hover{background:#e5e2dc}
.project-number,.service-no,.steps span{color:#949087}
.filters .active{border-color:#55524c;color:#282725}.project-open{background:#faf9f6;color:#282725}
.about{background:#eeece7}.about-copy>p:not(.eyebrow){color:#74716b}.about-signature{color:#8b867c}
.text-link{border-bottom-color:#b7b1a6}
.contact{background:#282725;color:#faf9f6;border-top:0}
.contact .eyebrow,.contact-info small{color:#bcb7ad}.contact h2+p,.visit-note{color:#c2bfb8}
.contact-info{border-color:#ffffff25}.footer-brand{background:#22211f}
.hero-image:after{background:linear-gradient(transparent,#211f1b77)}
.image-caption,.scroll-cue{color:#faf9f6}dialog>img{background:#eeece7}dialog::backdrop{background:#211f1bdd}
@media(max-width:760px){.brand{padding:5px 10px}.brand-logo{height:78px;width:68px}.header nav{background:#faf9f6;color:#282725;border-bottom-color:var(--line)}.contact-info{border-top-color:#ffffff25}}

/* ==== responsive.css ==== */
/* Shared centered canvas, with left-aligned content inside it. */
:root{--canvas:1440px;--gutter:40px}
.header{height:128px;padding-inline:max(var(--gutter),calc((100% - var(--canvas))/2 + var(--gutter)))}
.brand,.footer-brand{background:transparent;padding:0}
.brand-logo{width:88px;height:102px;object-fit:contain}
.wrap{width:calc(100% - 2 * var(--gutter));max-width:calc(var(--canvas) - 2 * var(--gutter))}
.hero{width:100%;max-width:var(--canvas);margin-inline:auto;height:auto;min-height:650px;grid-template-columns:44% 56%}
.hero-copy{padding:72px var(--gutter);min-width:0}
.hero h1{font-size:clamp(38px,4vw,58px);white-space:normal}
.hero-image{min-width:0;min-height:650px}
.hero-foot{padding-top:55px;flex-direction:row;flex-wrap:wrap}
.about{max-width:var(--canvas);margin-inline:auto}
.about-copy{padding:72px 60px}
.contact-grid{gap:60px}.contact-info{padding-left:45px}
.footer-links{width:calc(100% - 2 * var(--gutter));max-width:calc(var(--canvas) - 2 * var(--gutter))}
.header nav{gap:26px}.header nav>a{white-space:nowrap}
html{scroll-padding-top:140px}
@media(min-width:1600px){.hero-copy{padding:72px var(--gutter)}}
@media(max-width:1100px){:root{--gutter:32px}.hero{min-height:580px}.hero-image{min-height:580px}.hero-copy{padding:55px var(--gutter)}.hero h1{font-size:42px}.header nav{gap:18px}.about-copy{padding:55px 35px}.hero-description br{display:none}}
@media(max-width:900px){.header nav{gap:13px;font-size:12px}.nav-cta{padding:9px 13px}.nav-cta span{margin-left:14px}.hero h1{font-size:36px}.hero-foot{font-size:8px}.contact-grid{gap:30px}.contact-info{padding-left:25px}}
@media(max-width:760px){:root{--gutter:24px}.header{height:100px;padding-inline:var(--gutter)}.brand-logo{width:66px;height:78px}.header nav{top:100px;padding:20px var(--gutter) 28px;gap:0}.hero{display:flex;flex-direction:column;min-height:0}.hero-copy{padding:45px var(--gutter) 30px}.hero h1{font-size:clamp(36px,8vw,48px)}.hero-image{height:420px;min-height:0}.hero-foot{padding-top:32px}.about-copy{padding:45px var(--gutter)}.contact-grid,.faq{grid-template-columns:1fr;gap:35px}.contact-info{padding:30px 0 0}.footer-links{gap:20px}.footer{flex-wrap:wrap}html{scroll-padding-top:112px}}
@media(max-width:420px){:root{--gutter:20px}.hero-image{height:340px}.button{gap:35px}.image-caption{left:20px;right:20px}.footer-links{gap:15px}.project-photo img{height:340px}}
/* Compact, centered footer. */
.site-footer{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:46px 24px 28px;gap:25px;background:var(--paper)}
.site-footer .footer-brand{display:block;background:none;padding:0;line-height:0}
.site-footer .footer-brand img{width:82px;height:95px;object-fit:contain}
.site-footer .footer-links{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;width:auto;max-width:100%;margin:0;padding:0;gap:30px;border:0;font-size:12px}
.footer-copyright{margin:0;font-size:10px;letter-spacing:.04em;color:var(--muted)}
@media(max-width:760px){.site-footer{padding:35px 20px 24px;gap:22px}.site-footer .footer-links{gap:16px;font-size:11px}.site-footer .footer-brand img{width:72px;height:84px}.footer-copyright{font-size:9px}}

/* ==== editorial.css ==== */
/* A quiet architectural rhythm: larger imagery, considered typography. */
:root{--paper:#f8f7f3;--ink:#292824;--muted:#77756f;--line:#dedbd3}
body{font-size:15px;line-height:1.9;-webkit-font-smoothing:antialiased}
.header{height:116px;border-bottom-color:#dedbd388}.brand-logo{width:76px;height:90px}
.header nav{font-size:13px;gap:30px;letter-spacing:.09em}
.header nav a:not(.nav-cta){padding:8px 0;position:relative}
.header nav a[aria-current="page"]:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#9c9079}
.nav-cta{border-radius:30px;padding:11px 23px}.nav-cta span{margin-left:20px}
.eyebrow{font-size:10px;letter-spacing:.23em;display:flex;gap:18px;align-items:center;color:#8b8272;font-weight:400}
.eyebrow:before{content:"";height:1px;width:35px;background:#b4aa97;flex-shrink:0}
h1,h2{letter-spacing:.025em}.hero{grid-template-columns:45% 55%;min-height:680px}
.hero h1{font-size:clamp(38px,4vw,58px);line-height:1.65;letter-spacing:.025em}
.hero-copy{padding-top:65px;padding-bottom:55px}.hero-description{font-size:14px;line-height:2.2;max-width:400px}
.hero-foot{margin-top:45px;padding-top:20px;border-top:1px solid var(--line);font-size:11px;letter-spacing:.14em;max-width:400px}
.button{border-radius:2px;min-height:54px;font-size:13px;padding:14px 25px;gap:45px}
.intro{padding:100px 0}.intro h2{font-size:33px}.intro>p:last-child{line-height:2.2;font-size:14px}
.projects{padding:90px 0 105px}.section-head h2{font-size:38px}.section-head>p{font-size:14px;line-height:2}
.project-caption{margin-top:22px}.project-caption h3{font-size:25px}.project-photo img{height:510px}.project-open{border-radius:0;width:42px;height:42px;background:#f8f7f3eb}
.about{background:#eeece5}.about-copy h2{font-size:38px}.about-copy>p:not(.eyebrow){font-size:14px;line-height:2.2}
.service-list summary{padding:29px 0}.process{padding-top:15px}.steps h3{font-weight:400}.steps p{line-height:2}
.page-heading{padding:88px 0 70px}.page-heading h1{font-size:clamp(34px,4vw,55px);line-height:1.55;letter-spacing:.025em}
.breadcrumb{color:#aaa49a;font-size:10px}.page-lead{margin-top:28px;font-size:14px;line-height:2.2;color:var(--muted);max-width:550px}
.contact-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;padding:20px 0 90px;align-items:center}
.contact-photo{position:relative}.contact-photo img{height:590px;object-position:45% center}.contact-photo p{position:absolute;bottom:20px;left:25px;font-size:9px;letter-spacing:.2em;color:white}
.contact-details h2{font-size:34px;margin-bottom:35px}.contact-row{padding:24px 0;border-bottom:1px solid var(--line)}
.contact-row>span{display:block;font-size:10px;letter-spacing:.2em;color:#8b8272;margin-bottom:10px}.contact-row>a{display:block;font-size:16px}.contact-row .contact-phone{font:35px Georgia;letter-spacing:.04em;line-height:1.6}.contact-row small{float:right;font-size:18px}
.contact-note{margin:25px 0;font-size:12px;color:var(--muted)}
.studio-map{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:60px 0;border-top:1px solid var(--line);align-items:center}.studio-map h2{font-size:29px}.studio-map>div>p:last-child{font-size:13px;color:var(--muted);margin-top:18px}
.map-entry{background:#eceae3;min-height:235px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px}.map-mark{font-size:32px;color:#8b8272}.map-entry p{font-size:14px}.map-entry .text-link{font-size:12px}
.before-meet{padding:70px 0 85px;border-top:1px solid var(--line)}.before-meet h2{font-size:32px}.before-meet>p:not(.eyebrow){font-size:14px;color:var(--muted);margin-top:18px}.before-meet>div{display:flex;gap:40px;margin-top:30px}
.site-footer{border-top:1px solid var(--line);background:#f2f0ea}.site-footer .footer-links{font-size:12px;letter-spacing:.08em}
@media(max-width:1100px){.header nav{gap:18px}.contact-layout{gap:45px}.contact-photo img{height:500px}.project-photo img{height:420px}.about-copy h2{font-size:31px}.hero{min-height:590px}.hero-image{min-height:590px}}
@media(max-width:900px){.header nav{gap:12px;font-size:11px}.header .nav-cta{padding:9px 14px}.header .nav-cta span{margin-left:10px}.hero h1{font-size:36px}.contact-details h2{font-size:27px}.contact-row .contact-phone{font-size:29px}.contact-layout{gap:30px}.intro h2{font-size:28px}}
@media(max-width:760px){.header{height:100px}.brand-logo{width:66px;height:78px}.header nav{top:100px;gap:0;font-size:14px}.header nav>a:not(.nav-cta){padding:13px 0}.header nav a[aria-current="page"]:after{right:auto;width:24px;bottom:9px}.header nav .nav-cta{border-radius:2px;padding:12px 18px}.hero{min-height:0}.hero h1{font-size:40px}.hero-copy{padding-top:40px;padding-bottom:35px}.hero-description{font-size:13px}.hero-foot{margin-top:32px}.hero-image{min-height:0}.intro{padding:60px 0}.intro h2{font-size:26px}.section-head h2{font-size:29px}.project-photo img{height:350px}.project-caption h3{font-size:22px}.projects{padding:60px 0}.about-copy h2{font-size:30px}.page-heading{padding:55px 0 45px}.page-heading h1{font-size:35px}.page-lead{font-size:13px}.page-lead br{display:none}.contact-layout{grid-template-columns:1fr;gap:35px;padding:0 0 55px}.contact-photo img{height:390px}.contact-details h2{font-size:29px;margin-bottom:15px}.studio-map{grid-template-columns:1fr;gap:30px;padding:40px 0}.studio-map h2{font-size:26px}.before-meet{padding:45px 0 60px}.before-meet h2{font-size:26px}.before-meet>div{flex-wrap:wrap;gap:25px}.map-entry{min-height:210px}}
@media(max-width:420px){.hero h1{font-size:36px}.contact-photo img{height:320px}.page-heading h1{font-size:31px}.project-photo img{height:340px}}
.map-load{border:1px solid #b7b1a6;background:transparent;padding:8px 24px;font-size:12px}.map-notice{font-size:10px;color:var(--muted)}.map-entry{min-height:280px}.map-loaded{display:block}.map-loaded iframe{width:100%;height:300px;border:0;display:block}

/* ==== elegance.css ==== */
/* Quiet elegance: warm stone, fine rules, soft depth and generous imagery. */
:root{--paper:#f5f1e9;--ink:#34302b;--muted:#82796e;--line:#d8cfc1;--serif:Georgia,"Noto Serif TC","PMingLiU",serif}
body{background:radial-gradient(ellipse at 15% 5%,#fffdf8 0,transparent 45%),var(--paper)}
.header{background:#f9f6efeF;border-bottom:1px solid #d4c9b8;box-shadow:0 6px 28px #51463104}
.header .nav-cta{border-color:#ad9b7f;background:#f0e9dc;color:#504438}
.header nav>a:hover{color:#9a8060}.eyebrow{color:#998367;letter-spacing:.25em}.eyebrow:before{background:#b6a183;width:45px}
.hero{position:relative;grid-template-columns:46% 54%;padding:40px 40px 55px;gap:0;min-height:740px;align-items:center;background:linear-gradient(120deg,#f8f4eb,#eee7da)}
.hero-copy{padding:45px 42px 45px 0;position:relative;z-index:2}
.hero h1{font-size:clamp(40px,4vw,59px);line-height:1.55;letter-spacing:.045em;color:#39312a}
.accent{color:#998064}.hero-description{color:#85786a;font-size:14px;line-height:2.3;margin:30px 0 35px}
.hero-image{min-height:0;height:620px;overflow:visible;position:relative;box-shadow:12px 20px 45px #50402b18}
.hero-image>img{height:100%;border-radius:160px 0 0 0;object-position:45% center}
.hero-image:before{content:"";position:absolute;inset:15px -14px -15px 15px;border:1px solid #ad98785c;border-radius:160px 0 0 0;pointer-events:none;z-index:0}
.hero-image:after{border-radius:0;background:linear-gradient(transparent,#34271d77);inset:60% 0 0}
.scroll-cue{display:none}.image-caption{font-size:10px;left:27px;right:27px;bottom:26px}.image-caption span:last-child{font-size:8px}
.hero-foot{color:#99876e;border-top-color:#c8b89e80;letter-spacing:.15em;font-size:11px}
.dark{background:#4a3d31;color:#fffaf1;box-shadow:0 8px 20px #57442c15}.dark:hover{background:#695443}.button{border-radius:0;font-size:12px;letter-spacing:.1em;padding:16px 28px}
.intro{position:relative;padding:100px 0 105px;column-gap:85px;border-bottom-color:#cfc1ae}
.intro h2{font-size:35px;line-height:1.8;color:#534537}.intro>p:last-child{font-size:14px;line-height:2.4;color:#8a7b6b;padding-top:6px}
.intro:after{content:"◇";position:absolute;bottom:-18px;left:calc(50% - 22px);width:44px;background:var(--paper);text-align:center;color:#b8a080;font:29px Georgia}
.projects{padding:110px 0}.section-head h2{font-size:40px;letter-spacing:.08em;color:#514335}.section-head>p{color:#8b7c6b}.filters{border-bottom-color:#d8c9b5;gap:34px}.filters .active{color:#69533c;border-color:#a88d68}
.project-grid{gap:65px 45px}.project-photo{padding:10px;background:#eee6d8;border:1px solid #caba9f55;box-shadow:0 12px 35px #57432b09}.project-photo img{height:510px}.project-card:nth-child(even){padding-top:90px}.project-open{background:#fcf9f1eF;bottom:26px;right:26px;color:#8b7355}.project-caption{padding:0 8px}.project-caption small{color:#a18a6a}.project-caption h3{font-size:26px;color:#584734;line-height:1.5}.project-number{font:italic 30px Georgia;color:#b9a17e}
.about{position:relative;background:#e6ddd0;border-top:1px solid #c9b79d;border-bottom:1px solid #c9b79d}
.about-image{padding:35px 0 35px 35px}.about-image img{min-height:590px;border-radius:0 160px 0 0;box-shadow:0 14px 30px #4d392b16}.about-copy{padding:75px 60px}.about-copy h2{color:#554331;line-height:1.75}.about-copy>p:not(.eyebrow){color:#867461;line-height:2.3}.about-signature{font:italic 27px Georgia;color:#a18765;border-top:1px solid #baa48477;padding-top:30px}.text-link{color:#7a6045;border-bottom-color:#b49b78}
.services{padding:110px 0}.service-list{border-top-color:#baa587}.service-list summary{padding:31px 0}.service-list h3{color:#66503a;font-size:25px}.service-no{color:#b39a75;font:italic 22px Georgia}.service-en{color:#a58e70}.service-list details{border-bottom-color:#d4c5af}.service-list details[open]{background:#ebe3d344}.service-list details>p{color:#8a7967;line-height:2.2;padding-top:4px}
.process h2,.faq h2{color:#5a4733}.steps article{border-top-color:#c3ad8d;padding:25px 15px 0 0}.steps span{font:italic 38px Georgia;color:#b49a73}.steps h3{color:#70583e}.steps p{color:#8e7c68}.faq{border-top-color:#c8b394}.faq summary{color:#78614a}.faq details{border-color:#d8c8b1}
.contact{background:linear-gradient(115deg,#494037,#2e2924);position:relative;border-top:1px solid #b8a084;border-bottom:1px solid #b8a084;padding:95px 0}.contact h2{font-size:49px;line-height:1.6;color:#ede3d3}.contact .eyebrow{color:#c5b394}.contact .eyebrow:before{background:#a68d6a}.contact .text-link{color:#ddd0ba}.contact-info small{color:#b7a17f}.contact .light{background:#e8ddca;border:1px solid #d8c7ab;color:#584632;box-shadow:none}.contact .light:hover{background:#f4e9d7}
.page-heading{padding:90px 0 80px;border-bottom:1px solid #dfd3c1;margin-bottom:35px}.page-heading h1{color:#5b4734;font-size:clamp(36px,4vw,59px);line-height:1.65}.page-lead{color:#8a7660;line-height:2.4}.breadcrumb{color:#aa967c}.page-heading .eyebrow{margin-bottom:28px}
.contact-layout{gap:75px;padding-top:20px}.contact-photo{padding:12px;border:1px solid #c5b09366;background:#e9dfd0;box-shadow:0 20px 40px #58432b0c}.contact-photo img{border-radius:120px 0 0 0}.contact-photo p{bottom:35px;left:35px;background:#43352765;padding:5px 10px}.contact-details h2{color:#67503a;font-size:35px;line-height:1.7}.contact-row{border-bottom-color:#d7c6ad}.contact-row>span{color:#a08662}.contact-row .contact-phone{color:#655039}.contact-note{color:#9a876e}
.studio-map{border-top-color:#c7b08e}.studio-map h2,.before-meet h2{color:#655039}.map-entry{background:linear-gradient(135deg,#e7ddcc,#f1e9dc);border:1px solid #cbb899;box-shadow:inset 0 0 0 8px #f5eee4}.map-load{border-color:#b59b77;color:#7b6041}.map-mark{color:#ad8e62}.before-meet{border-top-color:#cbb99c}.site-footer{background:#ece5d9;border-top:1px solid #d1bea1;padding-top:50px;padding-bottom:35px}.site-footer .footer-links{color:#8b7253}.footer-copyright{color:#a08c72}
@media(max-width:1100px){.hero{padding:30px 32px 45px;min-height:620px}.hero-copy{padding-right:28px}.hero h1{font-size:43px}.hero-image{height:540px}.project-photo img{height:420px}.about-copy{padding:55px 35px}.about-copy h2{font-size:31px}.contact h2{font-size:38px}.contact-layout{gap:40px}}
@media(max-width:900px){.hero h1{font-size:36px}.hero-image{height:510px}.hero-description{font-size:13px}.intro h2{font-size:28px}.contact-details h2{font-size:28px}.about-image{padding:25px 0 25px 25px}}
@media(max-width:760px){.hero{padding:0 var(--gutter) 38px;min-height:0;background:linear-gradient(135deg,#f8f4eb,#eee7da)}.hero-copy{padding:40px 0 30px;width:100%}.hero h1{font-size:40px}.hero-image{width:100%;height:420px;margin-right:10px;box-shadow:8px 12px 25px #50402b18}.hero-image>img,.hero-image:before{border-top-left-radius:110px}.hero-image:before{inset:10px -10px -10px 10px}.hero-foot{margin-top:28px;padding-top:18px}.image-caption{left:22px;right:22px}.intro{padding:65px 0 70px}.intro h2{font-size:28px}.intro>p:last-child{font-size:13px;padding:0}.projects{padding:75px 0}.section-head h2{font-size:30px}.project-grid{gap:40px 20px}.project-photo{padding:7px}.project-photo img{height:330px}.project-card:nth-child(even){padding-top:0}.project-caption h3{font-size:23px}.project-caption small{font-size:9px}.project-open{bottom:20px;right:20px}.about-image{padding:25px 24px 0}.about-image img{height:360px;min-height:0;border-top-right-radius:110px}.about-copy{padding:45px 24px}.about-copy h2{font-size:31px}.about-signature{font-size:23px}.services{padding:70px 0}.service-list h3{font-size:20px}.service-list summary{padding:25px 0}.service-no{font-size:18px}.contact{padding:65px 0}.contact h2{font-size:35px}.page-heading{padding:55px 0 45px;margin-bottom:25px}.page-heading h1{font-size:35px}.contact-layout{gap:35px}.contact-photo{padding:8px}.contact-photo img{height:350px;border-top-left-radius:90px}.contact-photo p{bottom:25px;left:25px;font-size:8px}.contact-details h2{font-size:29px}.site-footer{padding-top:38px;padding-bottom:28px}}
@media(max-width:420px){.hero h1{font-size:36px}.hero-image{height:355px}.project-photo img{height:320px}.page-heading h1{font-size:32px}.contact-photo img{height:310px}}
/* Full-width section backgrounds, centered constrained content. */
.hero{display:block;width:100%;max-width:none;margin:0;padding:0;min-height:0;height:auto}
.hero-inner{width:100%;max-width:var(--canvas);margin-inline:auto;display:grid;grid-template-columns:46% 54%;align-items:center;padding:40px 40px 55px;min-height:740px}
.about{display:block;width:100%;max-width:none;margin:0}
.about-inner{width:100%;max-width:var(--canvas);margin-inline:auto;display:grid;grid-template-columns:1fr 1fr}
@media(max-width:1100px){.hero{padding:0;min-height:0}.hero-inner{padding:30px 32px 45px;min-height:620px}}
@media(max-width:760px){.hero{display:block;padding:0}.hero-inner{display:flex;flex-direction:column;align-items:stretch;padding:0 var(--gutter) 38px;min-height:0}.about-inner{grid-template-columns:1fr}}
/* Keep each introduction together rather than scattering text across the canvas. */
.intro{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;padding:66px 0 62px;border-bottom:0}
.intro .eyebrow{justify-content:center;margin-bottom:21px}
.intro h2{max-width:900px;font-size:34px;line-height:1.7;letter-spacing:.045em}
.intro>p:last-child{max-width:640px;margin-top:22px;padding:0;font-size:14px;line-height:2.25;color:#837463}
.intro:after{display:none}
.projects{padding-top:48px}
.projects .section-head{display:block}
.projects .section-head .eyebrow{margin-bottom:16px}
.projects .section-head h2{font-size:36px;line-height:1.6}
.projects .section-head>p{max-width:640px;padding-top:0;margin-top:14px;font-size:14px;line-height:2;color:#8b7c6b}
.projects .section-head>p br{display:none}
.projects .filters{margin-top:25px;margin-bottom:28px;padding:0;gap:30px}
.projects .filters button{padding-top:8px;padding-bottom:11px}
@media(max-width:1100px){.intro h2{font-size:30px}}
@media(max-width:760px){.intro{padding:46px 0 42px}.intro .eyebrow{font-size:8px;letter-spacing:.18em;margin-bottom:18px}.intro h2{font-size:26px;max-width:310px;line-height:1.75}.intro>p:last-child{margin-top:18px;font-size:13px;max-width:350px}.projects{padding-top:30px}.projects .section-head h2{font-size:29px}.projects .section-head>p{font-size:13px;margin-top:12px}.projects .filters{margin-top:20px;gap:24px}}

/* ==== experience.css ==== */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.brand-loading{position:fixed;inset:0;z-index:100;background:#f5f0e6;display:grid;place-items:center;overflow:hidden;visibility:hidden;opacity:0;pointer-events:none}
.is-loading .brand-loading{visibility:visible;opacity:1;pointer-events:auto}
.is-loading{overflow:hidden}
.loading-center{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:35px}
.loading-center img{width:150px;height:174px;object-fit:contain;animation:logo-arrive 1.1s cubic-bezier(.2,.7,.2,1) both}
.loading-line{height:1px;width:150px;background:#cbb89b;position:relative;overflow:hidden}
.loading-line:after{content:"";position:absolute;inset:0;background:#8f7350;transform-origin:left;animation:loading-progress 1.6s ease-in-out both}
.loading-halo{position:absolute;width:min(85vw,720px);height:min(85vw,720px);border:1px solid #b59c762b;border-radius:50%;box-shadow:0 0 120px #b4986514,inset 0 0 100px #fff9ed;animation:halo-breathe 3s ease-in-out infinite}
.loading-halo:before,.loading-halo:after{content:"";position:absolute;inset:30px;border:1px solid #b59c7624;border-radius:50%}.loading-halo:after{inset:60px}
.loading-frame{position:absolute;inset:35px;border:1px solid #bea78444}
.loading-corner{position:absolute;width:70px;height:70px;border-color:#a98c61;opacity:.6}.corner-one{left:35px;top:35px;border-left:1px solid;border-top:1px solid}.corner-two{right:35px;bottom:35px;border-right:1px solid;border-bottom:1px solid}
.loading-exit .brand-loading{visibility:visible;opacity:1;pointer-events:none;animation:loading-curtain .85s cubic-bezier(.7,0,.2,1) forwards}
.project-grid{gap:45px}.project-card{display:block}.project-photo{padding:9px;background:#ebe1d1;border-color:#c0a68266;box-shadow:0 18px 50px #69503212;transition:box-shadow .6s,transform .6s}
.project-photo img{height:540px;transition:transform 1.1s cubic-bezier(.2,.65,.2,1),filter .8s}
.project-card:nth-child(even){padding-top:100px}.project-card:hover .project-photo{box-shadow:0 25px 60px #69503226;transform:translateY(-5px)}
.project-card:hover img{transform:scale(1.045)}
.project-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 25%,#fff9e523 45%,transparent 65%);transform:translateX(-110%);pointer-events:none;transition:transform 1.2s}
.project-card:hover .project-photo:after{transform:translateX(110%)}
.project-open{border:1px solid #ffffff88;background:#faf6eddd;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s}.project-card:hover .project-open,.project-card:focus-visible .project-open{opacity:1;transform:translateY(0)}
.reveal-ready{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.65,.2,1)}.reveal-ready.is-visible{opacity:1;transform:none}
.hero-image>img{animation:photo-arrive 1.6s ease both}.hero-copy{animation:logo-arrive 1.2s ease both}
#project-dialog{background:#24201b;box-shadow:0 25px 100px #0005;width:min(1150px,94%)}#project-dialog>img{height:75svh;max-height:850px;background:#24201b}.dialog-nav{border-color:#ffffff20;color:#e9dfcf}.dialog-close{background:#f7f0e2;color:#4c3a27}.dialog-nav button:hover{color:#bba17e}
@keyframes logo-arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes loading-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes halo-breathe{0%,100%{transform:scale(.97);opacity:.5}50%{transform:scale(1.02);opacity:1}}
@keyframes loading-curtain{to{opacity:0;transform:translateY(-5%);visibility:hidden}}
@keyframes photo-arrive{from{opacity:.45;filter:brightness(1.15)}to{opacity:1;filter:brightness(1)}}
@media(max-width:1100px){.project-photo img{height:430px}}
@media(max-width:760px){.project-grid{gap:30px 18px}.project-card:nth-child(even){padding-top:0}.project-photo img{height:340px}.project-open{opacity:1;transform:none;width:32px;height:32px}.loading-frame{inset:20px}.corner-one{left:20px;top:20px}.corner-two{right:20px;bottom:20px}.loading-center img{width:125px;height:145px}#project-dialog>img{height:68svh}}
@media(prefers-reduced-motion:reduce){.brand-loading,.loading-center img,.hero-copy,.hero-image>img{animation:none!important}.loading-exit .brand-loading{visibility:hidden;opacity:0}.reveal-ready{opacity:1;transform:none}.project-card:hover .project-photo{transform:none}}
.is-loading .hero-copy,.is-loading .hero-image>img{animation-play-state:paused}
.header{background:#f9f6ef}
.loading-center img{animation-duration:.35s}
/* Cinematic brand opening: dark velvet, restrained light, two-part curtain. */
.brand-loading{background:transparent;display:grid;place-items:center}
.loading-curtain{position:absolute;top:0;bottom:0;width:50.1%;background:#171614;z-index:0;will-change:transform}
.curtain-left{left:0;background:radial-gradient(ellipse at 100% 50%,#343029 0,#211e1a 40%,#141311 90%)}
.curtain-right{right:0;background:radial-gradient(ellipse at 0 50%,#343029 0,#211e1a 40%,#141311 90%)}
.loading-stage{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:34px;width:260px;animation:stage-arrive 1.1s cubic-bezier(.2,.7,.2,1) both}
.loading-logo-wrap{position:relative;overflow:hidden;padding:8px 14px}
.loading-logo-wrap img{width:148px;height:172px;object-fit:contain;filter:saturate(.55);display:block}
.loading-glint{position:absolute;inset:-20%;background:linear-gradient(115deg,transparent 35%,#fff4d922 49%,transparent 62%);transform:translateX(-130%);animation:logo-glint 1.8s ease-in-out .35s both;pointer-events:none}
.loading-rule{display:block;width:1px;height:60px;background:linear-gradient(transparent,#bcaa8844);transform-origin:center}
.rule-bottom{background:linear-gradient(#bcaa8844,transparent)}
.loading-line{width:110px;height:1px;background:#ffffff12}
.loading-line:after{background:#b8a17d;animation-duration:2s}
.loading-exit .brand-loading{animation:none;opacity:1;transform:none;visibility:visible}
.loading-exit .loading-stage{animation:stage-depart .55s ease both}
.loading-exit .curtain-left{animation:curtain-left-open 1.1s cubic-bezier(.76,0,.24,1) .18s forwards}
.loading-exit .curtain-right{animation:curtain-right-open 1.1s cubic-bezier(.76,0,.24,1) .18s forwards}
@keyframes stage-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes stage-depart{to{opacity:0;transform:translateY(-8px);filter:blur(3px)}}
@keyframes logo-glint{to{transform:translateX(130%)}}
@keyframes curtain-left-open{to{transform:translateX(-100%)}}
@keyframes curtain-right-open{to{transform:translateX(100%)}}
@media(max-width:760px){.loading-stage{gap:26px}.loading-logo-wrap img{width:130px;height:150px}.loading-rule{height:45px}}
@media(prefers-reduced-motion:reduce){.loading-stage,.loading-glint,.loading-curtain{animation:none!important}.loading-exit .brand-loading{visibility:hidden;opacity:0}}
.loading-stage{animation-duration:.45s}
/* Fashion editorial opening: oversized type, cold ivory and a clean logo reveal. */
.brand-loading{background:#f3f2ee;color:#292825;isolation:isolate}
.fashion-word{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font:400 clamp(160px,28vw,600px)/.9 Didot,"Bodoni MT",Georgia,serif;letter-spacing:-.075em;white-space:nowrap;color:#e7e5df;z-index:0;user-select:none;animation:fashion-type 2.4s cubic-bezier(.2,.7,.2,1) both}
.fashion-light{position:absolute;inset:-30%;z-index:1;background:linear-gradient(110deg,transparent 30%,#ffffffa6 46%,transparent 63%);transform:translateX(-50%);animation:fashion-light-pass 2.4s ease both;pointer-events:none}
.fashion-top,.fashion-bottom{position:absolute;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;font:9px Arial,sans-serif;letter-spacing:.24em;color:#7d7a73;z-index:3}
.fashion-top{top:40px}.fashion-top>span:first-child{font-size:12px;color:#3b3934;letter-spacing:.3em}.fashion-bottom{bottom:40px;gap:30px}
.fashion-center{position:relative;z-index:2;background:#f3f2ee;padding:36px 50px;box-shadow:0 0 90px 50px #f3f2ee;animation:fashion-logo 1.15s cubic-bezier(.15,.7,.15,1) both}
.fashion-center img{width:190px;height:220px;object-fit:contain;filter:saturate(.45)}
.fashion-track{width:160px;height:1px;background:#cbc8c0;overflow:hidden}.fashion-track>span{display:block;width:100%;height:100%;background:#393732;transform-origin:left;animation:loading-progress 2.1s cubic-bezier(.2,.6,.2,1) both}
.loading-exit .brand-loading{visibility:visible;opacity:1;transform:none;animation:fashion-exit .9s cubic-bezier(.5,0,.2,1) forwards}
.loading-exit .fashion-center{animation:fashion-logo-exit .8s ease forwards}
.loading-exit .fashion-word{animation:fashion-word-exit .9s ease forwards}
@keyframes fashion-type{from{opacity:0;letter-spacing:.015em;transform:translate(-50%,-47%)}to{opacity:1;letter-spacing:-.075em;transform:translate(-50%,-50%)}}
@keyframes fashion-light-pass{from{transform:translateX(-45%)}to{transform:translateX(45%)}}
@keyframes fashion-logo{from{opacity:0;filter:blur(8px);transform:translateY(10px)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes fashion-exit{to{opacity:0;visibility:hidden}}
@keyframes fashion-logo-exit{to{opacity:0;filter:blur(4px);transform:scale(1.04)}}
@keyframes fashion-word-exit{to{opacity:0;letter-spacing:.03em}}
@media(max-width:760px){.fashion-word{font-size:42vw;transform:translate(-50%,-50%) rotate(-90deg);animation:none;letter-spacing:-.07em}.fashion-top,.fashion-bottom{left:24px;right:24px;font-size:7px;letter-spacing:.16em}.fashion-top{top:28px}.fashion-bottom{bottom:28px;flex-wrap:wrap;row-gap:22px}.fashion-track{order:3;width:100%}.fashion-center{padding:25px;box-shadow:0 0 65px 35px #f3f2ee}.fashion-center img{width:155px;height:180px}}
@media(prefers-reduced-motion:reduce){.fashion-word,.fashion-light,.fashion-center,.fashion-track>span{animation:none!important}.loading-exit .brand-loading{visibility:hidden;opacity:0}}
.fashion-center{animation-duration:.35s}
/* Refined proportion and a staggered brand signature. */
.fashion-center{display:flex;flex-direction:column;align-items:center;gap:28px;padding:30px 44px;box-shadow:0 0 75px 35px #f3f2ee}
.fashion-center img{width:150px;height:174px}
.fashion-kicker{font:8px Arial,sans-serif;letter-spacing:.32em;color:#959087;animation:fashion-detail-in .8s ease .2s both}
.fashion-signature{font:13px/1.8 var(--serif);letter-spacing:.18em;color:#8b8173;animation:fashion-detail-in .8s ease .7s both}
.fashion-top{animation:fashion-detail-in .7s ease .1s both}
.fashion-bottom{animation:fashion-detail-in .7s ease .35s both}
.fashion-word{color:#e3e1da}
.fashion-center:after{content:"";position:absolute;bottom:-22px;left:50%;width:1px;height:25px;background:linear-gradient(#b6a58c77,transparent);animation:fashion-detail-in .8s ease 1s both}
@keyframes fashion-detail-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(max-width:760px){.fashion-center{gap:24px;padding:24px 28px}.fashion-center img{width:120px;height:139px}.fashion-kicker{font-size:7px}.fashion-signature{font-size:11px;letter-spacing:.13em}}
@media(prefers-reduced-motion:reduce){.fashion-kicker,.fashion-signature,.fashion-top,.fashion-bottom,.fashion-center:after{animation:none!important}}
/* Diagonal curves and formal, tabular phone typography. */
.hero-image>img,.hero-image:before{border-radius:160px 0 160px 0}.hero-image:after{border-radius:0 0 160px 0}
.about-image img{border-radius:0 160px 0 160px}.contact-photo img{border-radius:120px 0 120px 0}
.phone,.contact-row .contact-phone{font-family:"Segoe UI",Arial,"Microsoft JhengHei",sans-serif;font-weight:400;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1;font-style:normal;letter-spacing:.025em;line-height:1.5;font-size:clamp(25px,2.5vw,36px);white-space:nowrap}
.image-caption{bottom:34px;right:65px}.image-caption span:last-child{max-width:160px;text-align:right}
.floating-tools{position:fixed;right:24px;bottom:28px;z-index:25;display:flex;flex-direction:column;align-items:center;gap:10px}
.floating-tools>a,.floating-tools>button{border:1px solid #c6b69c;background:#f9f5eceF;color:#6a553d;width:58px;min-height:58px;padding:9px 5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:29px;box-shadow:0 4px 18px #47331a0c;transition:transform .25s,background .25s;font:9px Arial,sans-serif;letter-spacing:.05em}
.floating-tools .float-top{background:#29251f;color:#e9ddc9;border-color:#625744;min-height:91px}
.float-top img{width:37px;height:43px;object-fit:contain}.float-top span{font-size:7px;letter-spacing:.08em}
.floating-tools svg{width:22px;height:22px}.floating-tools>a:hover,.floating-tools>button:not(:disabled):hover{transform:translateY(-3px);background:#e9dfce}.floating-tools .float-top:hover{background:#43392c}
.floating-tools>button:disabled{cursor:default;opacity:.5}.modal-open .floating-tools{visibility:hidden}.is-loading .floating-tools,.loading-exit .floating-tools{visibility:hidden}
@media(max-width:1100px){.hero-image>img,.hero-image:before{border-radius:130px 0 130px 0}.hero-image:after{border-radius:0 0 130px 0}.phone,.contact-row .contact-phone{font-size:29px}}
@media(max-width:760px){.hero-image>img,.hero-image:before{border-radius:100px 0 100px 0}.hero-image:after{border-radius:0 0 100px 0}.about-image img{border-radius:0 100px 0 100px}.contact-photo img{border-radius:90px 0 90px 0}.phone,.contact-row .contact-phone{font-size:28px}.image-caption{right:45px;bottom:30px}.floating-tools{right:10px;bottom:16px;gap:7px}.floating-tools>a,.floating-tools>button{width:44px;min-height:44px;padding:7px 3px;font-size:8px}.floating-tools .float-top{min-height:72px}.float-top img{width:29px;height:34px}.float-top span{font-size:6px}.floating-tools svg{width:18px;height:18px}}
/* Use the supplied character artwork for GO TOP, without a badge background. */
.floating-tools .float-top{position:relative;width:76px;height:124px;min-height:124px;padding:0;border:0;border-radius:0;background:transparent;color:#80684a;box-shadow:none;overflow:hidden}
.float-top img{position:absolute;left:50%;top:58px;transform:translate(-50%,-50%);width:140px;height:200px;max-width:none;object-fit:contain;pointer-events:none}
.float-top span{position:absolute;bottom:3px;left:0;right:0;text-align:center;font-size:8px;letter-spacing:.12em}
.floating-tools .float-top:hover{background:transparent;transform:translateY(-4px)}
@media(max-width:760px){.floating-tools .float-top{width:58px;height:97px;min-height:97px}.float-top img{width:110px;height:157px;top:45px}.float-top span{font-size:7px;bottom:0}}
/* Unframed contact icons; character GO TOP follows the contact actions. */
.floating-tools{gap:13px}
.floating-tools .float-phone,.floating-tools .float-line{border:0;border-radius:0;background:transparent;box-shadow:none;width:48px;min-height:48px;padding:4px;gap:5px}
.floating-tools .float-phone{color:#65503a}.floating-tools .float-phone svg{width:30px;height:30px;stroke-width:1.5}
.floating-tools .float-line svg{width:35px;height:35px}
.floating-tools .float-line:disabled{opacity:1}
.floating-tools .float-phone:hover,.floating-tools .float-line:not(:disabled):hover{background:transparent;transform:translateY(-2px)}
.floating-tools .float-top{margin-top:0}
@media(max-width:760px){.floating-tools{gap:9px}.floating-tools .float-phone,.floating-tools .float-line{width:40px;min-height:40px;padding:3px}.floating-tools .float-phone svg{width:25px;height:25px}.floating-tools .float-line svg{width:29px;height:29px}}
.mobile-menu-heading,.mobile-menu-footer{display:none}
@media(max-width:760px){
body.menu-open{overflow:hidden}.menu-open .floating-tools{visibility:hidden}
.header:has(.is-open){z-index:60;background:#f7f3ea;border-bottom-color:transparent}
.menu-toggle{position:relative;z-index:62;align-items:center;min-width:65px;justify-content:space-between}
.menu-toggle[aria-expanded="true"] .menu-glyph{font-size:26px;line-height:1}
.header #navigation{display:flex;position:fixed;inset:100px 0 0;height:calc(100dvh - 100px);overflow-y:auto;overscroll-behavior:contain;background:radial-gradient(ellipse at 100% 100%,#e6dccb 0,transparent 60%),#f7f3ea;padding:24px 32px max(26px,env(safe-area-inset-bottom));border:0;flex-direction:column;gap:0;align-items:stretch;visibility:hidden;opacity:0;transform:translateY(-12px);pointer-events:none;transition:opacity .35s,transform .45s,visibility .35s}
.header #navigation.is-open{visibility:visible;opacity:1;transform:none;pointer-events:auto}
.mobile-menu-heading{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;border-bottom:1px solid #cdbfa9;margin-bottom:12px;color:#a58c69;font:8px Arial,sans-serif;letter-spacing:.16em}
.mobile-menu-heading>span:first-child{font:14px Georgia;letter-spacing:.25em;color:#7d6445}
.header #navigation>a:not(.nav-cta){font:26px/1.4 var(--serif);letter-spacing:.09em;padding:17px 0 17px 33px;border-bottom:1px solid #ded3c255;position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#554431;flex-shrink:0}
.header #navigation>a:not(.nav-cta):before{content:attr(data-no);position:absolute;left:0;top:24px;font:italic 11px Georgia;letter-spacing:0;color:#b29b79}
.header #navigation>a:not(.nav-cta):after{content:attr(data-en);position:static;width:auto;height:auto;background:none;font:8px Arial,sans-serif;letter-spacing:.12em;color:#a59173;text-align:right}
.header #navigation>a[aria-current="page"]{color:#a17b48}
.header #navigation .nav-cta{margin-top:22px;background:#514232;color:#f4eadb;border:0;font-size:13px;padding:14px 20px;border-radius:0;flex-shrink:0}
.mobile-menu-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:23px;margin-top:auto;flex-shrink:0}
.mobile-menu-footer>span{font:7px Arial,sans-serif;letter-spacing:.12em;color:#9a866b;max-width:130px}
.mobile-menu-footer>a{font:13px Arial,sans-serif;letter-spacing:.06em;color:#755d3e;white-space:nowrap}
#navigation.is-open>a{animation:menu-item-arrive .5s ease both}#navigation.is-open>a:nth-of-type(2){animation-delay:.04s}#navigation.is-open>a:nth-of-type(3){animation-delay:.08s}#navigation.is-open>a:nth-of-type(4){animation-delay:.12s}#navigation.is-open>a:nth-of-type(5){animation-delay:.16s}#navigation.is-open>a:nth-of-type(6){animation-delay:.2s}
}
@media(max-width:760px) and (max-height:720px){.header #navigation{padding-top:15px;padding-inline:25px}.mobile-menu-heading{padding-bottom:12px;margin-bottom:5px}.header #navigation>a:not(.nav-cta){font-size:23px;padding-top:12px;padding-bottom:12px}.header #navigation>a:not(.nav-cta):before{top:18px}.header #navigation .nav-cta{margin-top:16px;padding:12px 18px}.mobile-menu-footer{padding-top:18px}}
@keyframes menu-item-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#navigation.is-open>a{animation:none!important}}
.menu-toggle .menu-label{display:none}
@media(max-width:760px){.menu-toggle{min-width:44px;min-height:44px;justify-content:center;padding:8px}.menu-glyph{font-size:20px}.menu-toggle[aria-expanded="true"] .menu-glyph{font-size:28px}}
/* Mobile galleries show the whole photograph, one at a time. */
@media(max-width:760px){
.project-grid{grid-template-columns:minmax(0,1fr);gap:28px}
.project-card,.project-card:nth-child(even){padding:0;width:100%;min-width:0}
.project-photo{padding:5px;border:1px solid #caba9f55;box-shadow:0 8px 24px #6950320a;overflow:hidden}
.project-photo img{height:auto;width:100%;aspect-ratio:auto;object-fit:contain;display:block}
.project-open{width:34px;height:34px;right:14px;bottom:14px;font-size:17px;background:#faf6eddf}
.project-card:hover .project-photo{transform:none}.project-card:hover img{transform:none}
.projects{padding-bottom:65px}
}
#dialog-image{touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none}
.photo-swiped{animation:swipe-photo-in .28s ease both}
@keyframes swipe-photo-in{from{opacity:.5;transform:scale(.985)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.photo-swiped{animation:none!important}}
/* Mixed portrait and landscape photos share a stable, uncropped viewing area. */
#project-dialog{position:fixed;overflow:hidden;max-height:calc(100dvh - 32px)}
#project-dialog[open]{display:flex;flex-direction:column}
#project-dialog .dialog-close{position:absolute;top:12px;right:12px;margin:0;flex:none}
#project-dialog>#dialog-image{display:block;width:100%;height:min(75dvh,850px);max-height:calc(100dvh - 112px);object-fit:contain;object-position:center;flex:none}
#project-dialog .dialog-nav{flex:none;min-height:64px}
@media(max-width:760px){
 #project-dialog{width:100%;max-width:100%;margin:auto;border-radius:0;max-height:100dvh}
 #project-dialog>#dialog-image{height:calc(100dvh - 76px);max-height:none;object-fit:contain}
 #project-dialog .dialog-nav{min-height:76px;padding:10px 20px}
}
.collection-title span{display:inline}
@media(max-width:760px){
 .page-heading .collection-title{font-size:clamp(27px,6.6vw,38px);line-height:1.6;letter-spacing:.035em}
 .collection-title span{display:block;white-space:nowrap}
}
/* Keep floating controls transparent after touch and pointer interaction. */
.floating-tools>a.float-phone:hover,.floating-tools>button.float-line:not(:disabled):hover,.floating-tools>button.float-top:not(:disabled):hover,
.floating-tools .float-top:active,.floating-tools .float-top:focus{background:transparent;box-shadow:none;border:0}
.floating-tools a:focus:not(:focus-visible),.floating-tools button:focus:not(:focus-visible){outline:none}
/* Consistent landscape covers on every screen size. */
.project-grid .project-card:nth-child(even){padding-top:0}
.project-grid .project-photo img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;object-position:center}
/* Let the loading logo sit directly on the full-screen background. */
.brand-loading .fashion-center{background:transparent;border:0;box-shadow:none}
.studio-map .map-loaded{padding:0;overflow:hidden;min-width:0}
.studio-map .map-loaded iframe{display:block;width:100%;height:450px;border:0}
@media(max-width:760px){.studio-map .map-loaded iframe{height:340px}}
/* Disable the image long-press callout while preserving touch navigation. */
img{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}
/* Balance the home contact section on wide desktop screens. */
#contact.contact{padding:76px 0}
#contact.contact .contact-grid{max-width:1200px;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
#contact.contact h2{font-size:clamp(36px,3.4vw,48px);line-height:1.5}
#contact.contact .contact-info{padding:8px 0 8px 64px;border-left:1px solid #ffffff24}
#contact.contact .contact-info small{font-size:11px;letter-spacing:.16em;margin-bottom:14px}
#contact.contact .phone{font-size:clamp(30px,3.1vw,42px);line-height:1.25;letter-spacing:.015em}
#contact.contact .contact-info>div+div{margin-top:30px}
#contact.contact .contact-info>div>p{font-size:17px;line-height:1.7}
#contact.contact .contact-info .text-link{font-size:13px;margin-top:14px}
#contact.contact .visit-note{font-size:13px;margin-top:28px;line-height:1.9}
@media(max-width:1000px) and (min-width:761px){#contact.contact .contact-grid{gap:36px}#contact.contact .contact-info{padding-left:36px}}
@media(max-width:760px){
 #contact.contact{padding:58px 0}
 #contact.contact .contact-grid{grid-template-columns:1fr;gap:34px}
 #contact.contact h2{font-size:34px}
 #contact.contact .contact-info{padding:30px 0 0;border-left:0;border-top:1px solid #ffffff24}
 #contact.contact .phone{font-size:30px}
 #contact.contact .contact-info>div>p{font-size:15px}
}
.brand-story{background:#f8f5ef;padding:88px 0 96px}
.brand-story-inner{display:grid;grid-template-columns:1fr 1.65fr;gap:88px;max-width:1200px;align-items:start}
.brand-story-heading{border-top:1px solid #c9b99f;padding-top:30px}
.brand-story-heading .eyebrow{font-size:10px;letter-spacing:.18em}
.brand-story-heading h2{font-size:36px;color:#5b4734}
.brand-story-motto{margin-top:24px;font-family:var(--serif);font-size:21px;line-height:1.9;color:#97816a;letter-spacing:.045em}
.brand-story-text{min-width:0;padding-top:26px;color:#766655;font-size:15px;line-height:2.25;letter-spacing:.035em}
.brand-story-text p+p{margin-top:24px}
.brand-story-text .brand-story-lead{font-family:var(--serif);font-size:23px;line-height:1.8;color:#5b4734;margin-bottom:28px}
@media(max-width:760px){.brand-story{padding:54px 0 62px}.brand-story-inner{grid-template-columns:1fr;gap:26px}.brand-story-heading{padding-top:24px}.brand-story-heading h2{font-size:30px}.brand-story-motto{font-size:19px;margin-top:16px}.brand-story-text{padding-top:0;font-size:14px;line-height:2.1}.brand-story-text .brand-story-lead{font-size:21px;margin-bottom:22px}.brand-story-text p+p{margin-top:20px}}

/* ==== 正式站調整（iOS 與手機版） ============================================
   1. 圖示：舊站的 ↗ ☰ × ← → ↓ + 在 iOS 會被換成 emoji 或大小跑掉，
      已全部改成內嵌 SVG（Infrastructure/Icons.cs），這裡統一大小。
   2. 字型：iOS 沒有 Noto Serif TC / 新細明體，標題會掉成黑體，
      改由 Google Fonts 載入 Noto Serif TC，各平台一致。
   3. 手機版：右下角快捷鈕加底、避開瀏海與 Home 條，捲到頁尾自動收起，
      不再蓋住頁尾連結；選單 / 燈箱開啟時鎖住背景捲動。
   ========================================================================== */
:root{--serif:Georgia,"Noto Serif TC","Songti TC","PMingLiU",serif}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-family:"Microsoft JhengHei","PingFang TC","Heiti TC",Arial,sans-serif}

/* ── SVG 圖示 ── */
.ico{display:inline-block;width:1em;height:1em;flex:none;vertical-align:-.12em;overflow:visible;pointer-events:none}
.ico-arrow{width:.95em;height:.95em}
.button>span,.text-link>span,.nav-cta>span{display:inline-flex;align-items:center;line-height:1}
.button .ico-arrow,.text-link .ico-arrow,.nav-cta .ico-arrow{width:1.05em;height:1.05em}
.project-open .ico{width:.8em;height:.8em}
.scroll-cue .ico{width:.8em;height:.8em}
.contact-row small .ico{width:1em;height:1em;vertical-align:-.1em}
.plus .ico{width:.72em;height:.72em;vertical-align:-.08em}
.faq summary>span{flex:none}
.faq summary>span .ico{width:1.05em;height:1.05em;vertical-align:-.15em}
.dialog-close{display:inline-grid;place-items:center;line-height:1}
.dialog-close .ico{width:.8em;height:.8em}
.dialog-nav button{display:inline-flex;align-items:center;gap:8px}
.dialog-nav .ico{width:1.2em;height:1.2em}

/* 選單鈕：關閉時顯示三條線，開啟時顯示 × */
.menu-glyph{display:inline-grid;place-items:center;line-height:1}
.menu-glyph .ico{grid-area:1/1;width:1.05em;height:1.05em}
.menu-glyph .ico-close{display:none}
.menu-toggle[aria-expanded="true"] .menu-glyph .ico-menu{display:none}
.menu-toggle[aria-expanded="true"] .menu-glyph .ico-close{display:block;width:.8em;height:.8em}

/* 選單或燈箱開啟時，背景不要跟著捲（iOS 需同時鎖 html） */
body.menu-open,body.modal-open{overflow:hidden}

/* 錯誤頁 */
.error-page{min-height:55vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px}
.error-page .button{margin-top:28px}

/* 快捷工具：捲到頁尾時收起，避免蓋住頁尾 */
.floating-tools{transition:opacity .35s ease,transform .35s ease}
.floating-tools.is-tucked{opacity:0;transform:translateY(16px);pointer-events:none}

@media(max-width:760px){
  .floating-tools{right:max(10px,env(safe-area-inset-right));bottom:calc(14px + env(safe-area-inset-bottom));gap:10px}
  /* 電話、LINE 改成有底色的圓鈕，在深色區塊上也看得到；文字標籤收起讓畫面乾淨 */
  .floating-tools .float-phone,.floating-tools .float-line{width:44px;min-height:44px;height:44px;padding:0;border-radius:50%;background:#fbf8f2f2;box-shadow:0 3px 14px #3b2a1626,0 0 0 1px #d9cbb4;gap:0}
  .floating-tools .float-phone>span,.floating-tools .float-line>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .floating-tools .float-phone svg{width:20px;height:20px}
  .floating-tools .float-line svg{width:30px;height:30px}
  .floating-tools>a.float-phone:hover,.floating-tools>button.float-line:not(:disabled):hover{background:#fbf8f2f2}
  .floating-tools .float-top{width:54px;height:88px;min-height:88px}
  .float-top img{width:100px;height:142px;top:41px}

  .site-footer{padding-bottom:calc(28px + env(safe-area-inset-bottom))}
}

/* ── 首頁 hero：Massimo Vignelli 引言 ── */
.hero h1.hero-quote{font-family:"EB Garamond",Garamond,Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(28px,2.65vw,42px);line-height:1.32;letter-spacing:0;white-space:normal;color:#39312a}
.hero-quote__line{display:block}
.hero-quote__line--indent{padding-left:1.15em}
.hero-quote .accent{white-space:nowrap}
.hero-quote__by{margin:18px 0 0;text-align:right;font:17px/1.4 "EB Garamond",Garamond,Georgia,serif;letter-spacing:.02em;color:#8b7355}
.hero .hero-statement{font-size:14px;line-height:2.25;letter-spacing:.18em;margin:30px 0 35px;max-width:none}
.hero .hero-statement br{display:inline}
@media(max-width:1100px){.hero h1.hero-quote{font-size:32px}}
@media(max-width:900px){.hero h1.hero-quote{font-size:28px}.hero .hero-statement{letter-spacing:.12em}}

/* 手機版 hero：圖片在上、文字在下 */
@media(max-width:760px){
  .hero-inner .hero-image{order:-1;margin-top:22px}
  .hero-inner .hero-copy{padding-top:34px}
  .hero h1.hero-quote{font-size:clamp(25px,7.4vw,32px);line-height:1.35}
  .hero-quote__line--indent{padding-left:.8em}
  .hero-quote__by{font-size:15px;margin-top:12px}
  .hero .hero-statement{font-size:13px;letter-spacing:.1em;line-height:2.1;margin:24px 0 28px}
}
@media(max-width:360px){.hero .hero-statement{letter-spacing:.04em}}

/* ==== 接待門市（/showroom） ============================================== */
.showroom-feature{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(40px,7vw,110px);align-items:center;padding-top:10px;padding-bottom:110px}
.showroom-cover{position:relative;display:block;padding:0;border:0;background:none;cursor:zoom-in;margin:0 14px 14px 0}
.showroom-cover:before{content:"";position:absolute;inset:14px -14px -14px 14px;border:1px solid #ad98785c;border-radius:160px 0 160px 0;pointer-events:none}
.showroom-cover img{position:relative;width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;border-radius:160px 0 160px 0;box-shadow:12px 20px 45px #50402b1f}
.showroom-cover__tag{position:absolute;left:26px;bottom:30px;font:10px Arial,sans-serif;letter-spacing:.24em;color:#faf6ee;text-shadow:0 1px 8px #0006}
.showroom-copy h2{margin:0 0 28px}
.showroom-copy>p{color:var(--muted);font-size:14px;line-height:2.2;margin:0 0 16px;max-width:470px}
.showroom-facts{margin:34px 0 0;padding:22px 0 0;border-top:1px solid var(--line);display:grid;gap:14px;max-width:470px}
.showroom-facts div{display:grid;grid-template-columns:96px 1fr;align-items:baseline}
.showroom-facts dt{font:10px Arial,sans-serif;letter-spacing:.2em;color:#a08c72}
.showroom-facts dd{margin:0;font-size:15px;letter-spacing:.06em;color:#4f4132}
.showroom-copy .showroom-note{font-size:12px;margin-top:22px}
.showroom-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px 34px;margin-top:30px}

.showroom-pillars{background:#2b2620;color:#eadfcd}
.showroom-pillars ul{list-style:none;margin:0 auto;padding:46px 0;display:grid;grid-template-columns:repeat(4,1fr)}
.showroom-pillars li{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;position:relative}
.showroom-pillars li+li:before{content:"";position:absolute;left:0;top:50%;width:7px;height:7px;border:1px solid #c2a679;transform:translate(-50%,-50%) rotate(45deg)}
.showroom-pillars__zh{font:21px/1.4 var(--serif);letter-spacing:.24em;padding-left:.24em}
.showroom-pillars__en{font:9px Arial,sans-serif;letter-spacing:.2em;color:#b79f7c}

.showroom-gallery{padding-top:110px;padding-bottom:120px}

@media(max-width:1100px){
  .showroom-feature{gap:50px;padding-bottom:90px}
  .showroom-cover img,.showroom-cover:before{border-radius:130px 0 130px 0}
}
@media(max-width:900px){
  .showroom-feature{grid-template-columns:1fr;gap:46px}
  .showroom-cover{max-width:520px}
  .showroom-pillars ul{grid-template-columns:repeat(2,1fr);row-gap:34px}
  .showroom-pillars li:nth-child(3):before{display:none}
}
@media(max-width:760px){
  .showroom-feature{padding-bottom:70px;gap:38px}
  .showroom-cover{margin-right:10px}
  .showroom-cover img,.showroom-cover:before{border-radius:100px 0 100px 0}
  .showroom-cover:before{inset:10px -10px -10px 10px}
  .showroom-copy>p{font-size:13px}
  .showroom-facts div{grid-template-columns:78px 1fr}
  .showroom-facts dd{font-size:14px}
  .showroom-pillars ul{padding:36px 0}
  .showroom-pillars__zh{font-size:18px}
  .showroom-gallery{padding-top:70px;padding-bottom:80px}
}

/* 接待門市：服務流程清單、材料介紹 */
.step-list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:4px;font-size:13px;line-height:1.9;color:var(--muted)}
.step-list li:before{content:"";display:inline-block;width:5px;height:5px;margin:0 10px 2px 0;border:1px solid #c2a679;transform:rotate(45deg)}
.step-list li:has(.text-link):before{display:none}
.step-list .text-link{margin-top:6px;font-size:12px}
.contact-plain{font-size:inherit}
.materials{padding-top:20px;padding-bottom:120px}
.materials-list{border-top:1px solid var(--line)}
.materials-item{display:grid;grid-template-columns:minmax(160px,1fr) 3fr;gap:30px;padding:28px 0;border-bottom:1px solid var(--line)}
.materials-item h3{margin:0;font:22px/1.4 var(--serif);letter-spacing:.08em;color:#5a4733;display:flex;flex-direction:column;gap:6px}
.materials-item h3 small{font:9px Arial,sans-serif;letter-spacing:.2em;color:#a08c72}
.materials-item ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:14px;line-height:1.9;color:var(--muted)}
@media(max-width:760px){
  .materials{padding-bottom:80px}
  .materials-item{grid-template-columns:1fr;gap:12px;padding:22px 0}
  .materials-item h3{font-size:19px;flex-direction:row;align-items:baseline;gap:12px}
  .materials-item ul{font-size:13px}
}
.steps .step-list .text-link>span{font:inherit;font-size:12px;color:inherit;letter-spacing:0;margin:0;display:inline-flex}
@media(max-width:760px){.steps article h3{font-size:17px}}

/* ==== 手機版整體調整（≤760px）：全部置中、節奏一致、不再有東西蓋住內文 ==== */
.mobile-dock{display:none}
@media(max-width:760px){
  :root{--m-gutter:22px}
  body{padding-bottom:calc(62px + env(safe-area-inset-bottom))}

  /* 頁首：縮短高度，選單從新高度往下展開 */
  .header{height:72px}
  .brand-logo{width:48px;height:56px}
  .header nav{top:72px}
  .header #navigation{inset:72px 0 0;height:calc(100dvh - 72px);padding-top:18px}

  /* 底部快捷列 */
  .mobile-dock{display:grid;grid-template-columns:1fr 1fr 1.25fr;position:fixed;left:0;right:0;bottom:0;z-index:40;padding-bottom:env(safe-area-inset-bottom);background:#fbf8f2f5;border-top:1px solid #d9cbb4;box-shadow:0 -6px 24px #3b2a1612;-webkit-backdrop-filter:saturate(1.2) blur(10px);backdrop-filter:saturate(1.2) blur(10px)}
  .mobile-dock a{height:62px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:11px;letter-spacing:.12em;color:#5a4733}
  .mobile-dock a+a{border-left:1px solid #e3d8c6}
  .mobile-dock .ico{width:20px;height:20px}
  .mobile-dock a.is-primary{background:#4b3d2f;color:#f6efe3;border-left:0}
  .menu-open .mobile-dock,.modal-open .mobile-dock,.is-loading .mobile-dock{visibility:hidden}

  /* 浮動工具：電話 / LINE 已移到底部快捷列；吉祥物回頂部捲動後才出現 */
  .floating-tools{bottom:calc(74px + env(safe-area-inset-bottom));right:10px}
  .floating-tools .float-phone,.floating-tools .float-line{display:none}
  .floating-tools .float-top{width:50px;height:80px;min-height:80px;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .35s,transform .35s}
  .floating-tools.show-top .float-top{opacity:1;transform:none;pointer-events:auto}
  .float-top img{width:92px;height:130px;top:37px}
  .float-top span{font-size:6px}

  /* 版心與段落節奏 */
  .wrap{width:auto;margin-inline:var(--m-gutter)}
  .eyebrow{justify-content:center;text-align:center;gap:14px;font-size:10px;letter-spacing:.22em;margin-bottom:16px}
  .eyebrow:before,.eyebrow:after{content:"";width:28px;height:1px;background:#bfa988;flex-shrink:0}
  h2{font-size:25px!important;line-height:1.55!important;letter-spacing:.06em}
  main p{font-size:14px;line-height:1.95}

  /* 全部置中 */
  .hero-copy,.intro,.section-head,.section-head>div,.about-copy,.page-heading,.brand-story-heading,.brand-story-text,
  .showroom-copy,.process,.steps article,.materials-item,.contact-grid>div,.contact-info,.contact-details,.studio-map>div:first-child,.faq>div:first-child,.error-page{text-align:center}
  .section-head{display:block}
  .section-head>p{margin:12px auto 0;max-width:30em}
  .section-head>p br,.projects .section-head>p br{display:none}

  /* 首頁 hero */
  .hero-copy{align-items:center;padding:30px 0 6px}
  .hero h1.hero-quote{font-size:clamp(24px,6.6vw,30px);line-height:1.4;text-align:center}
  .hero-quote__line--indent{padding-left:0}
  .hero-quote__by{text-align:center;margin-top:10px}
  .hero .hero-statement{margin:20px auto 26px;letter-spacing:.08em}
  .hero-foot{justify-content:center;width:100%;margin-top:28px}
  .hero-inner .hero-image{height:300px;margin-top:18px}

  /* 按鈕：手機一律置中、等寬 */
  .button{width:min(100%,320px);justify-content:space-between;margin-inline:auto;min-height:52px}
  .text-link{margin-inline:auto}
  .about .text-link,.contact-info .text-link{margin-left:auto;margin-right:auto}

  /* 頁面標題 */
  .page-heading{padding:36px 0 30px;margin-bottom:10px}
  .page-heading h1{font-size:28px!important;line-height:1.6}
  .page-heading .eyebrow{margin-bottom:16px}
  .page-heading .breadcrumb{margin-top:10px}
  .page-lead{margin-inline:auto}
  .page-lead br{display:none}
  .collection-title span{display:block}

  /* 首頁各段 */
  .intro{padding:52px 0 46px}
  .intro h2{max-width:13em;margin-inline:auto}
  .projects{padding:52px 0 56px}
  .project-grid{grid-template-columns:1fr;gap:18px}
  .project-photo img{height:240px}
  .about-copy{padding:40px 0 48px;margin-inline:var(--m-gutter)}
  .about-copy p{text-align:center}
  .about-signature{text-align:center;display:block}
  .about-image{margin-inline:var(--m-gutter)}
  .services{padding:52px 0}
  .service-list summary{padding:20px 0;gap:12px}
  .service-list details>p{padding:0 0 18px;text-align:center}
  .service-en{display:none}

  /* 關於我們 */
  .brand-story{padding:48px 0 54px}
  .brand-story-motto br{display:none}
  .brand-story-text .brand-story-lead{font-size:19px;line-height:1.75}

  /* 深色聯絡區 */
  #contact.contact{padding:52px 0}
  #contact.contact .contact-grid{gap:30px}
  #contact.contact .contact-info{padding-top:28px}
  #contact.contact .contact-info>div+div{margin-top:24px}
  .contact-grid p br{display:none}

  /* 聯絡我們頁 */
  .contact-layout{gap:30px}
  .contact-details h2{margin-bottom:8px}
  .contact-row{text-align:center}
  .contact-row small{float:none;margin-left:6px}
  .contact-row .contact-plain,.contact-row>a{display:block;font-size:16px;color:#4f4132}
  .contact-row .contact-phone{font-size:28px}
  .contact-note{text-align:center}
  .contact-details .button{margin-top:22px}
  .studio-map{padding-top:40px}

  /* 接待門市 */
  .showroom-feature{padding-bottom:56px;gap:30px}
  .showroom-cover{margin:0 auto}
  .showroom-cover__tag{left:0;right:0;text-align:center}
  .showroom-copy>p{margin-inline:auto}
  .showroom-facts{margin:26px auto 0;justify-items:center}
  .showroom-facts div{grid-template-columns:1fr;gap:4px;text-align:center}
  .showroom-actions{flex-direction:column;gap:18px}
  .showroom-pillars ul{grid-template-columns:1fr 1fr;padding:0;row-gap:0}
  .showroom-pillars li{padding:24px 6px}
  .showroom-pillars li:before{display:none!important}
  .showroom-pillars li:nth-child(odd){border-right:1px solid #ffffff1c}
  .showroom-pillars li:nth-child(-n+2){border-bottom:1px solid #ffffff1c}
  .showroom-pillars__zh{font-size:18px}
  .showroom-gallery{padding-top:56px;padding-bottom:60px}
  .process{padding-top:10px}
  .steps{grid-template-columns:1fr 1fr;gap:28px 16px}
  .step-list{justify-items:center}
  .step-list li:before{display:none}
  .materials-item{grid-template-columns:1fr;gap:10px;justify-items:center}
  .materials-item h3{flex-direction:column;align-items:center;gap:4px}
  .materials-item ul{justify-items:center}

  /* 頁尾 */
  .site-footer .footer-links{gap:10px 18px;max-width:300px}
}

/* 服務項目：內容都很短，直接全部列出，不再用收合 */
.service-list .service-item{display:grid;grid-template-columns:64px minmax(0,1fr) minmax(0,1.35fr);align-items:baseline;gap:24px;padding:30px 0;border-bottom:1px solid var(--line)}
.service-list .service-item:first-child{border-top:1px solid var(--line)}
.service-item .service-no{font:italic 20px Georgia,serif;color:#b29b79}
.service-item__title{display:flex;flex-direction:column;gap:6px}
.service-item__title h3{margin:0;font:22px/1.5 var(--serif);letter-spacing:.06em;color:#4f4132}
.service-item .service-en{display:block;font:9px Arial,sans-serif;letter-spacing:.2em;color:#a08c72}
.service-item>p{margin:0;font-size:14px;line-height:1.95;color:var(--muted)}
@media(max-width:900px) and (min-width:761px){.service-list .service-item{grid-template-columns:52px 1fr;}.service-item>p{grid-column:2}}
@media(max-width:760px){
  .service-list .service-item{grid-template-columns:1fr;justify-items:center;text-align:center;gap:6px;padding:24px 0}
  .service-item .service-no{font-size:17px}
  .service-item__title{align-items:center;gap:4px}
  .service-item__title h3{font-size:19px}
  .service-item .service-en{display:block}
  .service-item>p{font-size:14px;margin-top:6px;max-width:22em}
}
.service-item .service-en{margin:0!important;padding:0;text-align:left;align-self:flex-start}
/* 避免最後一行只剩一兩個字 */
main p,main h2,main h3{text-wrap:pretty}
@media(max-width:760px){
  .service-item .service-en{text-align:center;align-self:center}
  main p,main h2{text-wrap:balance}
}
.showroom-copy .showroom-lead{font:20px/1.6 var(--serif);letter-spacing:.16em;color:#8b6a43;margin:-6px 0 0}
@media(max-width:760px){.showroom-copy .showroom-lead{font-size:18px}}

/* ==== 首頁服務項目：原站的五格交錯色塊 ==================================== */
.services-band{padding:96px 0 0}
.services-band__head{margin-bottom:46px}
.services-band__head>p{max-width:30em}
.services-band__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr)}
.services-band__item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:84px 34px 96px;background:#a8937a;color:#4a3d2f;min-height:440px}
.services-band__item:nth-child(even){background:#ebe3d5}
.services-band__icon{display:block;width:78px;height:62px;color:#fbf7ef;margin-bottom:34px}
.services-band__item:nth-child(even) .services-band__icon{color:#6a5845}
.services-band__icon svg{width:100%;height:100%;overflow:visible}
.services-band__item h3{margin:0;font:22px/1.5 var(--serif);letter-spacing:.32em;padding-left:.32em;color:#3f4a42}
.services-band__en{margin-top:6px;font:9px Arial,sans-serif;letter-spacing:.22em;color:#8e7a60}
.services-band__item p{margin:26px 0 0;max-width:12.5em;font-size:14px;line-height:2.1;letter-spacing:.18em;color:#6b5a47;text-wrap:balance}
.services-band__item:nth-child(odd) p{color:#fbf7ef}
.services-band__item:nth-child(odd) .services-band__en{color:#f3ebdd}
@media(max-width:1100px){
  .services-band__item{padding:64px 18px 72px;min-height:380px}
  .services-band__item h3{font-size:19px;letter-spacing:.22em;padding-left:.22em}
  .services-band__item p{font-size:13px;letter-spacing:.1em}
}
@media(max-width:900px){
  .services-band__grid{grid-template-columns:repeat(2,1fr)}
  .services-band__item{min-height:0}
  .services-band__item:last-child{grid-column:1/-1}
  /* 兩欄時讓色塊呈棋盤交錯 */
  .services-band__item:nth-child(n){background:#ebe3d5}
  .services-band__item:nth-child(1),.services-band__item:nth-child(4),.services-band__item:nth-child(5){background:#a8937a}
  .services-band__item .services-band__icon{color:#6a5845}
  .services-band__item:nth-child(1) .services-band__icon,.services-band__item:nth-child(4) .services-band__icon,.services-band__item:nth-child(5) .services-band__icon{color:#fbf7ef}
  .services-band__item:nth-child(n) p{color:#6b5a47}
  .services-band__item:nth-child(1) p,.services-band__item:nth-child(4) p,.services-band__item:nth-child(5) p{color:#fbf7ef}
  .services-band__item:nth-child(n) .services-band__en{color:#8e7a60}
  .services-band__item:nth-child(1) .services-band__en,.services-band__item:nth-child(4) .services-band__en,.services-band__item:nth-child(5) .services-band__en{color:#f3ebdd}
}
@media(max-width:760px){
  .services-band{padding-top:56px}
  .services-band__head{margin-bottom:30px}
  .services-band__item{padding:36px 14px 40px}
  .services-band__icon{width:52px;height:42px;margin-bottom:18px}
  .services-band__item h3{font-size:18px;letter-spacing:.2em;padding-left:.2em}
  .services-band__en{font-size:8px;letter-spacing:.14em}
  .services-band__item p{margin-top:12px;font-size:13px;line-height:1.95;letter-spacing:.06em;max-width:11em}
  .services-band__item:last-child p{max-width:17em}
}

/* ==== 影音專訪（/media） ================================================== */
.media-feature{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:clamp(32px,4.5vw,64px);align-items:center;padding-top:10px;padding-bottom:96px}
.media-player{position:relative;aspect-ratio:16/9;background:#1f1b17;overflow:hidden;box-shadow:0 22px 50px #3b2a1622}
.media-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.media-poster{position:absolute;inset:0;padding:0;border:0;background:#1f1b17;cursor:pointer;display:block;width:100%}
.media-poster img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.65,.2,1),filter .6s}
.media-poster:hover img{transform:scale(1.03);filter:brightness(.92)}
.media-play{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;display:grid;place-items:center;background:#fbf7efe6;color:#4b3d2f;box-shadow:0 10px 30px #0004;transition:transform .3s}
.media-play svg{width:30px;height:30px;margin-left:4px}
.media-poster:hover .media-play{transform:scale(1.07)}
.media-info h2{margin:0 0 14px;font-size:clamp(22px,2.2vw,30px)!important;line-height:1.55!important}
.media-meta{display:flex;align-items:center;gap:12px;margin:0 0 20px;font-size:13px;letter-spacing:.1em;color:#a08c72}
.media-dot{width:4px;height:4px;border-radius:50%;background:#c2a679}
.media-desc{margin:0 0 28px;font-size:14px;line-height:2.05;color:var(--muted)}
.media-credit{margin:22px 0 0;font-size:11px;letter-spacing:.12em;color:#b0a08a}

.media-list{padding-top:20px;padding-bottom:110px;border-top:1px solid var(--line)}
.media-list .section-head{padding-top:70px;margin-bottom:38px}
.media-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 28px}
.media-card{display:flex;flex-direction:column;gap:6px;padding:0;border:0;background:none;text-align:left;cursor:pointer;color:inherit}
.media-card__thumb{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#e9e1d3;margin-bottom:10px}
.media-card__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.65,.2,1)}
.media-card:hover .media-card__thumb img,.media-card:focus-visible .media-card__thumb img{transform:scale(1.05)}
.media-card__time{position:absolute;right:10px;bottom:10px;padding:3px 8px;font:11px/1.4 Arial,sans-serif;letter-spacing:.06em;color:#fff;background:#1f1b17cc}
.media-card__now{position:absolute;left:10px;top:10px;padding:4px 10px;font-size:11px;letter-spacing:.14em;color:#fbf7ef;background:#8b6a43;opacity:0;transition:opacity .3s}
.media-card.is-current .media-card__now{opacity:1}
.media-card.is-current .media-card__thumb{outline:2px solid #8b6a43;outline-offset:4px}
.media-card__cat{font:10px Arial,sans-serif;letter-spacing:.22em;color:#a08c72}
.media-card__title{font:17px/1.6 var(--serif);letter-spacing:.04em;color:#4f4132;text-wrap:pretty}

@media(max-width:1000px){
  .media-feature{grid-template-columns:1fr;gap:30px}
  .media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .media-feature{padding-bottom:56px;gap:24px}
  .media-player{margin-inline:calc(var(--m-gutter) * -1)}
  .media-play{width:64px;height:64px;margin:-32px 0 0 -32px}
  .media-play svg{width:24px;height:24px}
  .media-info{text-align:center}
  .media-meta{justify-content:center}
  .media-info .text-link{margin-inline:auto}
  .media-list .section-head{padding-top:46px;margin-bottom:24px}
  .media-list{padding-bottom:64px}
  .media-grid{gap:26px 12px}
  .media-card{text-align:center;align-items:center}
  .media-card__thumb{width:100%;margin-bottom:6px}
  .media-card.is-current .media-card__thumb{outline-offset:2px}
  .media-card__title{font-size:14px;line-height:1.55}
  .media-card__cat{font-size:9px}
  .media-card__time{right:6px;bottom:6px;font-size:10px;padding:2px 6px}
  .media-card__now{left:6px;top:6px;font-size:10px;padding:3px 7px}
}

/* 接待門市：右側文字置中，用細框卡片撐起版面，和左邊大圖平衡 */
@media(min-width:901px){
  .showroom-feature{align-items:stretch}
  .showroom-copy{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
    padding:64px 48px;margin:0 0 14px;background:linear-gradient(160deg,#fbf8f2,#f1eadf);border:1px solid #ddd0bc;box-shadow:0 20px 50px #50402b10}
  .showroom-copy:before{content:"";position:absolute;inset:12px;border:1px solid #e6dbca;pointer-events:none}
  .showroom-copy .eyebrow{justify-content:center}
  .showroom-copy .eyebrow:after{content:"";height:1px;width:35px;background:#b4aa97;flex-shrink:0}
  .showroom-copy h2{margin-bottom:22px}
  .showroom-copy .showroom-lead{margin:0}
  .showroom-facts{margin:34px auto 0;width:min(100%,380px);justify-items:center}
  .showroom-facts div{grid-template-columns:1fr;gap:6px;text-align:center}
  .showroom-actions{justify-content:center}
}

/* ==== 接待門市照片：單張大圖 + 縮圖列 ====================================== */
.gallery{margin-top:30px}
.gallery-stage{position:relative;aspect-ratio:16/10;max-height:680px;width:100%;background:#e9e1d3;overflow:hidden;box-shadow:inset 0 0 0 1px #d9cbb4}
.gallery-slide{position:absolute;inset:0;margin:0;display:grid;place-items:center;padding:28px;opacity:0;transition:opacity .9s ease;pointer-events:none}
.gallery-slide.is-active{opacity:1}
.gallery-slide img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 18px 40px #3b2a1626}
.gallery-zoom{position:absolute;inset:0;z-index:1;border:0;background:transparent;cursor:zoom-in}
.gallery-arrow{position:absolute;top:50%;z-index:2;width:54px;height:54px;margin-top:-27px;display:grid;place-items:center;border:0;border-radius:50%;background:#fbf8f2e6;color:#4b3d2f;font-size:20px;box-shadow:0 6px 20px #3b2a1622;transition:background .25s,color .25s,transform .25s}
.gallery-arrow:hover{background:#4b3d2f;color:#fbf7ef}
.gallery-arrow:active{transform:scale(.94)}
.gallery-arrow.is-prev{left:22px}
.gallery-arrow.is-next{right:22px}
.gallery-count{position:absolute;right:22px;bottom:18px;z-index:2;padding:6px 12px;font:12px/1 Georgia,serif;letter-spacing:.14em;color:#6b5a47;background:#fbf8f2d9}
.gallery-count b{font-weight:400;font-size:15px;color:#3f342a}
.gallery-thumbs{display:flex;gap:10px;margin-top:14px;overflow-x:auto;scrollbar-width:none;padding:4px 2px;scroll-behavior:smooth}
.gallery-thumbs::-webkit-scrollbar{display:none}
.gallery-thumb{flex:1 0 88px;max-width:140px;aspect-ratio:1;padding:0;border:0;background:#e9e1d3;cursor:pointer;opacity:.55;outline:1px solid transparent;outline-offset:2px;transition:opacity .25s,outline-color .25s}
.gallery-thumb img{width:100%;height:100%;object-fit:cover}
.gallery-thumb:hover{opacity:.85}
.gallery-thumb.is-current{opacity:1;outline-color:#8b6a43}
@media(max-width:760px){
  .gallery{margin:20px calc(var(--m-gutter) * -1) 0}
  .gallery-stage{aspect-ratio:4/5;max-height:none}
  .gallery-slide{padding:16px}
  .gallery-arrow{width:40px;height:40px;margin-top:-20px;font-size:16px}
  .gallery-arrow.is-prev{left:10px}
  .gallery-arrow.is-next{right:10px}
  .gallery-count{right:50%;transform:translateX(50%);bottom:12px}
  .gallery-thumbs{padding:4px var(--m-gutter);gap:8px}
  .gallery-thumb{flex:0 0 64px}
}

/* ==== 全站段落標題置中（桌機也一致）======================================= */
.section-head,.section-head>div{display:block;text-align:center}
.section-head>p{margin:14px auto 0;max-width:34em;text-align:center}
.section-head>p br{display:none}
.section-head .eyebrow,.process>.eyebrow,.page-heading .eyebrow,.showroom-gallery>.eyebrow{justify-content:center}
.section-head .eyebrow:after,.process>.eyebrow:after,.page-heading .eyebrow:after,.showroom-gallery>.eyebrow:after{content:"";height:1px;width:35px;background:#b4aa97;flex-shrink:0}
.page-heading{text-align:center}
.page-heading .page-lead{margin-inline:auto}
.collection-title span{display:block}

/* 服務流程：標題與四個步驟都置中 */
.process{text-align:center}
.process>h2{margin-bottom:46px}
.steps article{text-align:center}
.step-list{justify-items:center}
.step-list li:before{display:none}
.steps .step-list .text-link{margin-inline:auto}

/* 材料介紹：改成置中卡片，不再左右切分 */
.materials-list{border-top:0;display:flex;flex-wrap:wrap;justify-content:center;gap:22px}
.materials-item{flex:0 1 calc((100% - 44px)/3);display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;padding:40px 28px 36px;
  border:1px solid #ddd0bc;border-bottom:1px solid #ddd0bc;background:linear-gradient(160deg,#fbf8f2,#f2ebdf)}
.materials-item h3{flex-direction:column;align-items:center;gap:6px}
.materials-item h3:after{content:"";width:26px;height:1px;background:#c2a679;margin-top:10px}
.materials-item ul{justify-items:center;gap:8px}
@media(max-width:1000px){.materials-item{flex-basis:calc((100% - 22px)/2)}}
@media(max-width:760px){
  .materials-list{gap:12px}
  .materials-item{flex-basis:100%;padding:28px 18px 26px;gap:12px}
  .materials-item h3{flex-direction:column}
}

.materials .section-head{margin-bottom:40px}
@media(max-width:760px){.gallery-stage{aspect-ratio:1/1}.materials .section-head{margin-bottom:24px}}
/* 影音頁：右側影片資訊也置中 */
.media-info{text-align:center}
.media-info .eyebrow{justify-content:center}
.media-info .eyebrow:after{content:"";height:1px;width:35px;background:#b4aa97;flex-shrink:0}
.media-meta{justify-content:center}
.media-info .text-link{margin-inline:auto}
.process-cta{display:flex;justify-content:center;margin-top:52px}
@media(max-width:760px){.process-cta{margin-top:34px}}