/* ========== 全局变量 ========== */
:root{--bg:#F7F5F0;--ink:#191919;--ink-soft:#77736D;--gold:#B79A62;--wine:#4A1717;--line:#E6E2D9;--serif-en:"Cormorant Garamond","Noto Serif SC",Georgia,serif;--serif-cn:"Noto Serif SC","Cormorant Garamond",serif;--sans:"Inter",-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;--container:1280px;--gap-xl:clamp(60px,10vw,120px);--gap-lg:clamp(40px,7vw,80px);--gap-md:clamp(24px,4vw,48px)}
*,*::before,*::after{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--sans);background:var(--bg);color:var(--ink);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:0;background:none}.container{max-width:var(--container);margin:0 auto;padding:0 clamp(20px,4vw,48px)}
/* 顶部导航 */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;padding:22px 0;background:rgba(247,245,240,0.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .4s,padding .4s}.site-header.scrolled{border-color:var(--line);padding:14px 0}.nav-row{display:flex;align-items:center;justify-content:space-between;gap:32px}.logo{font-family:var(--serif-en);font-weight:500;font-size:22px;letter-spacing:.04em;color:var(--ink)}.logo small{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.3em;font-weight:400;color:var(--ink-soft);margin-top:2px}.nav-main{display:flex;align-items:center;gap:clamp(20px,3vw,40px);list-style:none;padding:0;margin:0}.nav-main a{font-size:13px;font-weight:400;color:var(--ink);letter-spacing:.06em;position:relative;padding:6px 0;transition:color .3s}.nav-main a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right center;transition:transform .5s cubic-bezier(.22,1,.36,1)}.nav-main a:hover::after,.nav-main a.active::after{transform:scaleX(1);transform-origin:left center}.nav-lang{display:flex;gap:8px;font-size:12px;color:var(--ink-soft);letter-spacing:.1em}.nav-lang a{padding:4px 6px}.nav-lang a.active{color:var(--ink);font-weight:500}.nav-lang span{color:var(--line)}.nav-toggle{display:none;width:32px;height:32px;flex-direction:column;justify-content:center;align-items:center;gap:5px}.nav-toggle span{display:block;width:22px;height:1px;background:var(--ink);transition:all .3s}.nav-toggle.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}.nav-toggle.open span:nth-child(2){opacity:0}.nav-toggle.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
/* Only the Chinese homepage header visually merges into its hero. */
.site-header--zh-home {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom-color: transparent;
}
.site-header--zh-home.scrolled {
  background: rgba(247,245,240,.72);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom-color: transparent;
}
/* 通用Section */
section{padding:var(--gap-xl) 0;position:relative}.section-eyebrow{font-family:var(--sans);font-size:11px;letter-spacing:.3em;color:var(--gold);text-transform:uppercase;margin-bottom:20px;font-weight:500}.section-title{font-family:var(--serif-cn);font-weight:400;font-size:clamp(28px,4vw,48px);line-height:1.3;letter-spacing:.04em;color:var(--ink);margin:0 0 24px}.section-title em{font-family:var(--serif-en);font-style:italic;font-weight:300;color:var(--ink-soft);margin-left:12px}.section-desc{max-width:640px;font-size:15px;line-height:1.9;color:var(--ink-soft)}.btn{display:inline-flex;align-items:center;gap:12px;padding:14px 36px;border:1px solid var(--ink);color:var(--ink);font-size:13px;letter-spacing:.18em;font-weight:400;text-transform:uppercase;transition:all .5s cubic-bezier(.22,1,.36,1)}.btn:hover{background:var(--ink);color:var(--bg)}.btn .arr{display:inline-block;transform:translateX(0);transition:transform .5s}.btn:hover .arr{transform:translateX(6px)}
/* HERO */

.hero-bg-img{position:absolute;inset:0;z-index:1;background-size:cover;background-position:center}
.hero{position:relative;min-height:100vh;display:flex;align-items:center;padding:0;overflow:hidden}.hero-media{position:absolute;inset:0;z-index:1}.hero-media .ph{position:absolute;inset:0;background:var(--bg)}.hero-media .ph::after{content:"JEWELRY PACKAGING · HERITAGE CRAFT";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--serif-en);font-style:italic;font-size:clamp(20px,3vw,36px);color:rgba(183,154,98,.15);letter-spacing:.3em;white-space:nowrap}.hero-overlay{position:absolute;inset:0;z-index:2;background:linear-gradient(135deg,rgba(247,245,240,.12) 0%,rgba(183,154,98,.08) 50%,transparent 100%)}.hero-content { position: relative; z-index: 3; width: 100%; max-width: 1400px; margin: 0 auto; padding: 60px 80px; display: flex; flex-direction: column; align-items: flex-start; overflow: visible; }.hero-eyebrow{font-size:11px;letter-spacing:.4em;color:var(--gold);margin-bottom:24px;text-transform:uppercase;font-weight:400}.hero-title{font-family:var(--serif-cn);font-size:clamp(32px,5.5vw,64px);font-weight:400;line-height:1.35;letter-spacing:.06em;color:var(--ink);max-width:800px;margin:0 0 24px}.hero-title em{font-family:var(--serif-en);font-style:italic;font-weight:300;color:var(--gold);letter-spacing:.02em;font-size:.7em}.hero-subtitle{font-size:14px;letter-spacing:.2em;color:var(--ink-soft);margin-bottom:40px;text-transform:uppercase}.hero-subtitle small{display:block;font-size:12px;letter-spacing:.1em;margin-top:6px;color:rgba(247,245,240,.4);font-style:italic;font-family:var(--serif-en)}.hero-cta{display:inline-flex;align-items:center;gap:12px;padding:14px 36px;border:1px solid var(--ink);color:var(--ink);font-size:13px;letter-spacing:.18em;font-weight:400;text-transform:uppercase;transition:all .5s cubic-bezier(.22,1,.36,1)}.hero-cta:hover{background:var(--ink);color:var(--bg)}.hero-scroll{position:absolute;bottom:clamp(30px,5vw,60px);right:clamp(20px,4vw,48px);z-index:4;display:flex;flex-direction:column;align-items:center;gap:12px;color:rgba(247,245,240,.4);font-size:10px;letter-spacing:.2em;writing-mode:vertical-rl;text-transform:uppercase;font-family:var(--sans)}.hero-scroll-line{width:1px;height:60px;background:linear-gradient(to bottom,rgba(247,245,240,.4),transparent);animation:scrollLine 2s ease-in-out infinite}@keyframes scrollLine{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* 理念 */
.philosophy{padding:var(--gap-xl) 0;text-align:center}.philosophy .section-title{margin-left:auto;margin-right:auto}.philosophy .section-desc{margin:0 auto 48px;text-align:center}.philosophy-divider{width:1px;height:80px;background:var(--line);margin:0 auto var(--gap-lg)}.philosophy-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;max-width:700px;margin:0 auto}.stat-number{font-family:var(--serif-en);font-size:clamp(40px,6vw,64px);font-weight:300;color:var(--ink);line-height:1;margin-bottom:8px}.stat-number .suffix{font-size:.5em;color:var(--gold)}.stat-label{font-size:12px;letter-spacing:.15em;color:var(--ink-soft);text-transform:uppercase}
/* 业务 */
.services{padding:var(--gap-xl) 0;background:var(--ink);color:var(--bg)}.services .section-title{color:var(--bg)}.services .section-title em{color:rgba(247,245,240,.5)}.services .section-desc{color:rgba(247,245,240,.6)}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:var(--gap-lg)}.service-card{background:rgba(247,245,240,.03);padding:clamp(32px,5vw,56px);transition:background .5s;position:relative;overflow:hidden}.service-card::before{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--gold);transform:scaleX(0);transition:transform .5s cubic-bezier(.22,1,.36,1)}.service-card:hover{background:rgba(247,245,240,.06)}.service-card:hover::before{transform:scaleX(1)}.service-icon{font-size:36px;margin-bottom:24px;display:block;color:rgba(183,154,98,.8)}.service-card h3{font-family:var(--serif-cn);font-size:clamp(20px,2.5vw,26px);font-weight:400;margin:0 0 12px;color:var(--bg)}.service-card h3 small{display:block;font-family:var(--serif-en);font-style:italic;font-weight:300;font-size:.65em;color:rgba(247,245,240,.4);margin-top:4px;letter-spacing:.04em}.service-card p{font-size:14px;line-height:1.8;color:rgba(247,245,240,.55);margin:0}
/* 精选作品 */
.works{padding:var(--gap-xl) 0}.works-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:var(--gap-lg);gap:24px}.works-header .section-title{margin-bottom:0}.works-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.work-item{position:relative;overflow:hidden;display:block;aspect-ratio:4/3;background:var(--line)}.work-item:first-child{grid-column:1/-1;aspect-ratio:16/7}.work-img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.22,1,.36,1)}.work-item:hover .work-img{transform:scale(1.04)}.work-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(13,10,8,.85) 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(20px,3vw,36px);transition:background .5s}.work-item:hover .work-overlay{background:linear-gradient(180deg,rgba(13,10,8,.2) 0%,rgba(13,10,8,.9) 100%)}.work-cat{font-size:10px;letter-spacing:.25em;color:var(--gold);text-transform:uppercase;margin-bottom:8px;font-family:var(--sans)}.work-title{font-family:var(--serif-cn);font-size:clamp(18px,2.5vw,28px);font-weight:400;color:var(--bg);margin:0 0 6px;line-height:1.3}.work-title small{display:block;font-family:var(--serif-en);font-style:italic;font-weight:300;font-size:.65em;color:rgba(247,245,240,.5);margin-top:4px}.work-arrow{position:absolute;top:clamp(16px,2.5vw,28px);right:clamp(16px,2.5vw,28px);width:40px;height:40px;border:1px solid rgba(247,245,240,.3);display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(-8px);transition:all .5s;font-size:18px;color:var(--bg)}.work-item:hover .work-arrow{opacity:1;transform:translateY(0)}
/* 东方美学 */
.culture{padding:var(--gap-xl) 0}.culture-inner{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-lg);align-items:center}.culture-visual{aspect-ratio:3/4;background:linear-gradient(135deg,#e8e4dc 0%,#d4cfc5 100%);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.culture-visual::after{content:"東";font-family:var(--serif-cn);font-size:200px;color:rgba(183,154,98,.12);font-weight:300;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.culture-features{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:var(--gap-md)}.culture-feature h4{font-family:var(--serif-cn);font-size:18px;font-weight:400;margin:0 0 8px}.culture-feature h4 small{display:block;font-family:var(--serif-en);font-style:italic;font-size:12px;color:var(--ink-soft);font-weight:300}.culture-feature p{font-size:14px;color:var(--ink-soft);line-height:1.8;margin:0}
/* 芊屿的设计方法 */
.design-approach{padding:clamp(76px,8vw,112px) 0;background:var(--bg)}
.design-approach-inner{width:min(100%,1520px);margin:0 auto;padding-inline:clamp(24px,3.2vw,48px)}
.design-approach-grid{display:grid;grid-template-columns:clamp(400px,32vw,520px) minmax(0,1fr);gap:clamp(110px,7.5vw,125px);align-items:start}
.design-approach-media{min-width:0;aspect-ratio:4/5;overflow:hidden;background:var(--line)}
.design-approach-media picture,.design-approach-media img{width:100%;height:100%;display:block}
.design-approach-media img{object-fit:cover;object-position:center center}
.design-approach-content{min-width:0}
.design-approach-eyebrow{font-family:var(--sans);font-size:11px;line-height:1.4;letter-spacing:4px;color:#80652f;text-transform:uppercase;margin:0 0 24px}
.design-approach-title{font-family:var(--serif-cn);font-size:clamp(36px,2.3vw,44px);font-weight:400;color:var(--ink);letter-spacing:.01em;line-height:1.3;margin:0 0 24px}
.design-approach-title span{display:block}
.design-approach-intro{max-width:650px;font-family:var(--serif-cn);font-size:15px;color:var(--ink-soft);line-height:2;margin:0}
.design-approach-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:clamp(32px,2.8vw,42px) clamp(28px,3vw,44px);margin-top:clamp(55px,4.2vw,70px)}
.design-approach-feature{min-width:0;display:grid;grid-template-rows:32px auto 1fr;row-gap:12px}
.design-approach-icon{width:32px;height:32px;color:var(--gold)}
.design-approach-icon svg{width:100%;height:100%;display:block;stroke:currentColor;stroke-width:1.5;vector-effect:non-scaling-stroke}
.design-approach-feature h3{font-family:var(--serif-cn);font-size:15px;font-weight:500;color:var(--ink);line-height:1.5;margin:0}
.design-approach-feature h3 span{font-family:var(--sans);font-size:10px;color:var(--ink-soft);font-weight:400;letter-spacing:.08em;margin-left:6px;white-space:nowrap}
.design-approach-feature p{font-family:var(--serif-cn);font-size:13px;color:var(--ink-soft);line-height:1.8;margin:0}
@media(max-width:1199px){
  .design-approach-inner{padding-inline:clamp(24px,4vw,42px)}
  .design-approach-grid{grid-template-columns:minmax(0,43fr) minmax(0,51fr);gap:clamp(30px,5vw,52px)}
  .design-approach-media{min-height:clamp(520px,58vw,620px);aspect-ratio:auto}
  .design-approach-title{font-size:clamp(28px,3.5vw,36px)}
  .design-approach-title span{display:inline}
  .design-approach-title span+span::before{content:" "}
  .design-approach-features{gap:28px 20px;margin-top:40px}
  .design-approach-feature h3 span{display:block;margin:2px 0 0;white-space:normal}
}
@media(max-width:768px){
  .design-approach{padding:56px 0}
  .design-approach-inner{padding-inline:20px}
  .design-approach-grid{grid-template-columns:minmax(0,1fr);gap:38px}
  .design-approach-media{width:100%;min-height:0;aspect-ratio:4/3}
  .design-approach-title{font-size:clamp(28px,8vw,38px);line-height:1.48}
  .design-approach-intro{font-size:14px;line-height:1.9}
  .design-approach-features{margin-top:36px;gap:30px 20px}
}
@media(max-width:430px){
  .design-approach-media{aspect-ratio:1/1}
  .design-approach-features{grid-template-columns:minmax(0,1fr)}
  .design-approach-feature h3 span{display:inline;margin-left:6px}
}
/* 工艺 */
.craft{padding:var(--gap-xl) 0;background:var(--ink);color:var(--bg)}.craft .section-title{color:var(--bg)}.craft .section-title em{color:rgba(247,245,240,.4)}.craft-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:var(--gap-lg)}.craft-step{background:rgba(247,245,240,.03);padding:clamp(24px,3vw,40px);position:relative}.craft-step-num{font-family:var(--serif-en);font-size:48px;font-weight:300;color:var(--gold);line-height:1;margin-bottom:20px;opacity:.6}.craft-step h3{font-family:var(--serif-cn);font-size:20px;font-weight:400;color:var(--bg);margin:0 0 12px}.craft-step h3 small{display:block;font-family:var(--serif-en);font-style:italic;font-size:11px;color:rgba(247,245,240,.35);margin-top:4px;font-weight:300}.craft-step p{font-size:13px;color:rgba(247,245,240,.5);line-height:1.8;margin:0}
/* 公司实力 */
.strength{padding:var(--gap-xl) 0}.strength-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:var(--gap-lg)}.strength-item{background:var(--line);padding:clamp(28px,4vw,48px);text-align:center}.strength-item h3{font-family:var(--serif-en);font-size:clamp(32px,4vw,52px);font-weight:300;color:var(--ink);margin:0 0 8px;line-height:1}.strength-item h3 span{color:var(--gold);font-style:italic}.strength-item p{font-size:13px;color:var(--ink-soft);letter-spacing:.05em;margin:0}
/* 联系 */
.contact{padding:var(--gap-xl) 0;background:var(--bg)}.contact-inner{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-lg);align-items:start}.contact-item{padding:20px 0;border-bottom:1px solid var(--line)}.contact-item:first-child{border-top:1px solid var(--line)}.contact-item label{font-size:11px;letter-spacing:.25em;color:var(--gold);text-transform:uppercase;display:block;margin-bottom:8px;font-family:var(--sans)}.contact-item p,.contact-item a{font-family:var(--serif-cn);font-size:18px;color:var(--ink);margin:0;line-height:1.6}.contact-item a:hover{color:var(--gold)}.contact-form{background:var(--ink);padding:clamp(32px,5vw,56px)}.contact-form h3{font-family:var(--serif-cn);font-size:24px;font-weight:400;color:var(--bg);margin:0 0 32px}.form-group{margin-bottom:20px}.form-group label{display:block;font-size:11px;letter-spacing:.2em;color:rgba(247,245,240,.5);text-transform:uppercase;margin-bottom:8px}.form-group input,.form-group textarea{width:100%;background:rgba(247,245,240,.06);border:1px solid rgba(247,245,240,.1);color:var(--bg);padding:12px 16px;font-size:14px;font-family:var(--sans);transition:border-color .3s;outline:none}.form-group input::placeholder,.form-group textarea::placeholder{color:rgba(247,245,240,.25)}.form-group input:focus,.form-group textarea:focus{border-color:var(--gold)}.form-group textarea{resize:vertical;min-height:100px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-submit{width:100%;padding:16px;background:var(--gold);color:var(--ink);font-size:13px;letter-spacing:.2em;text-transform:uppercase;font-family:var(--sans);font-weight:500;border:none;cursor:pointer;transition:background .3s}.form-submit:hover{background:var(--bg)}
/* 页脚 */
.site-footer{background:var(--ink);padding:clamp(36px,4.8vw,64px) 0 28px;color:rgba(247,245,240,.62)}.site-footer>.container{max-width:1180px}.footer-inner{display:grid;grid-template-columns:minmax(260px,1.1fr) minmax(520px,1.45fr);align-items:start;gap:clamp(56px,8vw,110px);padding-bottom:34px;border-bottom:1px solid rgba(247,245,240,.08)}.footer-brand{max-width:320px}.footer-logo{font-family:var(--serif-cn);font-size:21px;font-weight:400;letter-spacing:.08em;color:var(--bg);margin-bottom:12px}.footer-tagline{font-size:13px;color:rgba(247,245,240,.62);max-width:300px;line-height:1.9}.footer-links{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:clamp(34px,4vw,56px)}.footer-col h4{font-size:11px;letter-spacing:.25em;color:var(--gold);text-transform:uppercase;margin:0 0 16px;font-weight:400}.footer-col ul{list-style:none;padding:0;margin:0}.footer-col li{margin-bottom:10px}.footer-col a{font-size:13px;color:rgba(247,245,240,.62);transition:color .3s}.footer-col a:hover{color:var(--bg)}.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:24px;font-size:12px;color:rgba(247,245,240,.62)}
/* 响应式 */
@media(max-width:1024px){.services-grid{grid-template-columns:1fr 1fr}.craft-steps{grid-template-columns:1fr 1fr}.strength-grid{grid-template-columns:1fr 1fr}}@media(max-width:900px){.footer-inner{grid-template-columns:1fr;gap:32px}.footer-brand{max-width:420px}.footer-links{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}
@media(max-width:768px){.nav-main{display:none}.nav-toggle{display:flex}.nav-main.open{display:flex;flex-direction:column;position:fixed;top:0;left:0;right:0;bottom:0;background:var(--bg);justify-content:center;align-items:center;gap:24px;z-index:99}.nav-main.open a{font-size:24px}.works-grid{grid-template-columns:1fr}.work-item:first-child{grid-column:auto;aspect-ratio:4/3}.culture-inner{grid-template-columns:1fr}.culture-visual{aspect-ratio:16/9}.services-grid{grid-template-columns:1fr}.craft-steps{grid-template-columns:1fr}.strength-grid{grid-template-columns:1fr 1fr}.contact-inner{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr;gap:28px}.footer-links{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.philosophy-stats{grid-template-columns:1fr;gap:24px}.form-row{grid-template-columns:1fr}.works-header{flex-direction:column;align-items:flex-start}}@media(max-width:480px){.strength-grid{grid-template-columns:1fr}.culture-features{grid-template-columns:1fr}.site-footer{padding-top:36px}.footer-links{grid-template-columns:1fr 1fr;row-gap:22px}.footer-col:last-child{grid-column:1/-1}.footer-bottom{align-items:flex-start;gap:10px;flex-direction:column}}
/* 移动端遮罩+动画 */
.mobile-nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:98;opacity:0;pointer-events:none;transition:opacity .3s}.mobile-nav-overlay.show{opacity:1;pointer-events:auto}.fade-in{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}.fade-in.visible{opacity:1;transform:translateY(0)}

.hero-business{font-family:var(--serif-cn);font-size:clamp(15px,1.8vw,20px);letter-spacing:.08em;color:var(--ink-soft);margin:0 0 40px;font-weight:400}

/* Hero Final Styles - 参考图排版 */
/* 英文副标题 - 修复版 */
.hero {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.hero-bg-img {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: linear-gradient(135deg, rgba(247,245,240,0.1) 0%, rgba(247,245,240,0) 50%);
}

.hero-content { position: relative; z-index: 3; width: 100%; max-width: 1400px; margin: 0 auto; padding: 60px 80px; display: flex; flex-direction: column; align-items: flex-start; overflow: visible; }

/* 品牌区 - 左上角 */
.hero-brand {
    margin-bottom: 80px;
}

.hero-brand-cn {
    font-family: 'Noto Serif SC', serif;
    font-size: 42px;
    font-weight: 500;
    color: #191919;
    letter-spacing: 8px;
    margin: 0 0 8px 0;
}

.hero-brand-en {
    font-family: 'Cormorant Garamond', serif;
    font-size: 11px;
    font-weight: 400;
    color: #77736D;
    letter-spacing: 6px;
    text-transform: uppercase;
}

/* 主标语 */
.hero-tagline {
    margin-bottom: 30px;
}

.hero-line1,
.hero-line2 {
    font-family: 'Noto Serif SC', serif;
    font-size: 42px;
    font-weight: 400;
    color: #191919;
    line-height: 1.6;
    margin: 0;
}

.hero-line2 .highlight {
    color: #B79A62;
    font-weight: 500;
}

/* 短横线分隔符 */
.hero-divider {
    width: 60px;
    height: 1px;
    background: #B79A62;
    margin: 30px 0;
}

/* 英文副标题 */
/* 业务范围 */
.hero-business {
    margin-bottom: 50px;
}

.hero-business-cn {
    font-family: 'Noto Serif SC', serif;
    font-size: 15px;
    font-weight: 400;
    color: #191919;
    letter-spacing: 2px;
    margin: 0 0 8px 0;
}

.hero-business-en {
    font-family: 'Inter', sans-serif;
    font-size: 10px;
    font-weight: 400;
    color: #77736D;
    letter-spacing: 4px;
    text-transform: uppercase;
    margin: 0;
}

/* CTA 按钮 */
.hero-cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 14px 32px;
    border: 1px solid #191919;
    font-family: 'Noto Serif SC', serif;
    font-size: 14px;
    color: #191919;
    text-decoration: none;
    transition: all 0.3s ease;
}

.hero-cta:hover {
    background: #191919;
    color: #F7F5F0;
}

.hero-cta-arrow {
    transition: transform 0.3s ease;
}

.hero-cta:hover .hero-cta-arrow {
    transform: translateX(4px);
}

/* 移动端适配 */
@media (max-width: 768px) {
    .hero-content { position: relative; z-index: 3; width: 100%; max-width: 1400px; margin: 0 auto; padding: 60px 80px; display: flex; flex-direction: column; align-items: flex-start; overflow: visible; }
    
    .hero-brand-cn {
        font-size: 32px;
        letter-spacing: 6px;
    }
    
    .hero-line1,
    .hero-line2 {
        font-size: 26px;
    }
    
    .hero-brand {
        margin-bottom: 50px;
    }
}

/* HERO SUBTITLE FINAL FIX */
.hero-subtitle-en {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #5A5750 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    margin: 0 0 30px 0 !important;
    white-space: nowrap !important;
    display: block !important;
    width: 100% !important;
    overflow: visible !important;
}


/* 语言切换器 */
.lang-switcher {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: 30px;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
}
.lang-link {
    color: #77736D;
    text-decoration: none;
    padding: 4px 6px;
    transition: color 0.3s ease;
}
.lang-link:hover { color: #B79A62; }
.lang-link.active { color: #191919; font-weight: 500; }
.lang-separator { color: #B79A62; font-weight: 300; }
@media (max-width: 768px) {
    .lang-switcher { margin-left: 15px; font-size: 12px; }
}
/* PR #8: structural responsive fixes. Desktop rules above remain unchanged. */
body.nav-open { overflow: hidden; }
.nav-toggle { position: relative; z-index: 103; flex: 0 0 40px; }
.logo { flex: 0 1 auto; min-width: 0; }
.logo img { max-width: 100%; }
.project-grid,
.project-gallery { min-width: 0; }

@media (max-width: 768px) {
  :root { --gap-xl: clamp(48px, 14vw, 72px); --gap-lg: clamp(28px, 8vw, 44px); }
  html { scroll-padding-top: 76px; }
  body { overflow-wrap: anywhere; }
  main, section, .container, .project-page-inner, form, input, textarea, button { min-width: 0; max-width: 100%; }
  section { scroll-margin-top: 76px; }
  .container { width: 100%; padding-inline: clamp(18px, 5vw, 32px); }

  .site-header, .site-header.scrolled { padding: 10px 0; }
  .site-header .container { padding-inline: clamp(14px, 4vw, 24px); }
  .nav-row { min-height: 48px; gap: clamp(8px, 2.5vw, 16px); }
  .logo { margin-right: auto; }
  .logo img { width: auto; max-width: min(150px, 38vw); max-height: 36px !important; }
  .lang-switcher { order: 2; flex: 0 0 auto; margin-left: 0; gap: 3px; white-space: nowrap; }
  .lang-link { padding: 8px 3px; }
  .nav-toggle { order: 3; display: flex; width: 40px; height: 40px; }
  .nav-main.open {
    display: flex;
    position: fixed;
    inset: 68px 0 0;
    width: 100vw;
    height: calc(100dvh - 68px);
    padding: clamp(30px, 8vh, 72px) 24px;
    overflow-y: auto;
    background: #F7F5F0;
    justify-content: flex-start;
    gap: clamp(16px, 4vh, 30px);
    z-index: 102;
  }
  .nav-main.open a { display: flex; align-items: center; justify-content: center; min-width: 180px; min-height: 44px; padding: 8px 16px; text-align: center; font-size: clamp(19px, 5vw, 24px); position: relative; z-index: 1; pointer-events: auto; }
  /* Keep the backdrop below the header stacking context so it cannot intercept menu-link taps. */
  .mobile-nav-overlay { z-index: 99; }

  .hero { min-height: auto; }
  .hero-content { min-height: 100svh; padding: 92px clamp(20px, 6vw, 36px) 48px; justify-content: center; }
  .hero-brand { margin-bottom: clamp(30px, 9vw, 50px); }
  .hero-line1, .hero-line2 { max-width: 100%; font-size: clamp(24px, 7vw, 34px); line-height: 1.4; overflow-wrap: normal; }
  .hero-subtitle-en { white-space: normal !important; letter-spacing: clamp(1px, .8vw, 3px) !important; }
  .hero-business-en { letter-spacing: clamp(1px, .8vw, 4px); }
  .hero-cta, .btn { max-width: 100%; padding: 13px 24px; }

  .hero-duo { grid-template-columns: minmax(0, 1fr) !important; width: 100% !important; height: auto !important; }
  .hero-main { width: 100%; aspect-ratio: 4 / 3 !important; }

  .philosophy-v2 { min-height: 0 !important; background-size: cover !important; }
  .philosophy-v2 > .container { padding: 56px 20px !important; }
  .philosophy-v2 .section-title { font-size: clamp(28px, 8vw, 38px) !important; }
  .philosophy-v2 .container > div:last-child { gap: clamp(10px, 4vw, 28px) !important; }
  .philosophy-v2 .container > div:last-child > div:nth-child(odd) > div:first-child { font-size: clamp(34px, 10vw, 48px) !important; }

  .portfolio-graf { padding: 56px 0 !important; }
  .portfolio-graf .container { padding-inline: 20px; }
  .portfolio-graf .pf-head { margin-bottom: 44px; }
  .portfolio-graf .portfolio-item,
  .portfolio-graf .portfolio-item:nth-child(even) { grid-template-columns: minmax(0, 1fr); gap: 22px; margin-bottom: 64px; }
  .portfolio-graf .pf-title { font-size: clamp(30px, 8vw, 38px); }
  .portfolio-graf .pf-cn { font-size: clamp(27px, 7vw, 34px); margin-bottom: 16px; }

  .zh-aesthetics { padding: 56px 0 !important; }
  .zh-aesthetics > div { padding-inline: 20px !important; }
  .zh-aesthetics-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 32px !important; }
  .zh-aesthetics-grid h2 { font-size: clamp(28px, 8vw, 38px) !important; overflow-wrap: normal; }
  .zh-aesthetics-features { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 24px 18px !important; }

  .graf-strength { position: relative !important; top: auto !important; height: auto !important; min-height: 0 !important; overflow: visible !important; }
  .graf-strength-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
  .graf-strength-grid > div { min-width: 0; padding: 28px 16px !important; }
  .graf-strength > div { padding-block: 56px !important; }
  .graf-strength-grid { width: 100% !important; gap: 0 !important; }
  .graf-strength-grid > div { min-height: 0 !important; height: auto !important; padding: 24px 14px !important; }
  .graf-strength-grid > div > div { margin-bottom: 14px !important; }
  .graf-strength-grid > div span:first-child { font-size: clamp(50px, 15vw, 72px) !important; }
  .graf-strength-grid > div span + span { font-size: clamp(22px, 6vw, 28px) !important; }
  .graf-strength-grid > div p { font-size: 14px !important; line-height: 1.6 !important; }

  .services-grid, .craft-steps { grid-template-columns: minmax(0, 1fr); }
  .service-card, .craft-step, .strength-item { min-width: 0; }
  .culture-inner { grid-template-columns: minmax(0, 1fr); }
  .culture-content { min-width: 0; }
  .culture-features { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .craft, .services { scroll-margin-top: 68px; }

  .contact .container { width: 100% !important; min-width: 0 !important; max-width: 100% !important; padding-inline: 20px !important; box-sizing: border-box !important; }
  .contact .contact-inner { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 36px !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; }
  .contact .contact-info, .contact .contact-form, .contact .contact-form form, .contact .form-row, .contact .form-group, .contact .form-submit { width: 100% !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; }
  .contact .contact-form { padding: clamp(24px, 7vw, 36px); }
  .contact .form-row { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 0 !important; }
  .contact .form-group label { display: block !important; width: 100% !important; max-width: 100% !important; white-space: normal !important; word-break: keep-all; overflow-wrap: normal; }
  .contact .form-group input, .contact .form-group select, .contact .form-group textarea, .contact .form-submit button { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; }

  .project-archive, .project-detail { min-height: 0 !important; padding: 88px 0 44px !important; }
  .project-page-inner { width: 100%; padding-inline: clamp(12px, 4vw, 24px) !important; }
  .project-grid, .project-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: clamp(6px, 2vw, 12px) !important; }
  .project-detail a[aria-label="返回作品案例"] { display: inline-flex !important; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0 !important; margin-bottom: 8px; font-size: 26px !important; }
}

@media (max-width: 430px) {
  .zh-aesthetics-features, .culture-features, .strength-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .philosophy-stats { grid-template-columns: 1fr; }
  .footer-links { width: 100%; justify-content: space-between; gap: 24px 16px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 8px; }
}

/* Inquiry security/status helpers. */
.qianyu-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.inquiry-feedback,.inquiry-configuring{padding:14px 16px;margin:0 0 20px;border:1px solid var(--line);color:var(--ink);line-height:1.6}.inquiry-feedback--sent{border-color:#6f8f72}.inquiry-feedback--invalid,.inquiry-feedback--upload,.inquiry-feedback--failed,.inquiry-feedback--rate{border-color:#a66}.contact-details:empty{display:none}

/* Light inquiry card: override the legacy dark-form palette for both languages. */
.contact#contact { scroll-margin-top: 104px; }
.contact .contact-form {
  color: #191919;
  background: #fff;
  border: 1px solid #c5c1ba;
}
.contact .contact-form h3 { color: #191919; }
.contact .contact-form .form-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.contact .contact-form .form-group { min-width: 0; }
.contact .contact-form .form-group label {
  color: #3f3b36;
  font-weight: 500;
}
.contact .contact-form .form-group input,
.contact .contact-form .form-group select,
.contact .contact-form .form-group textarea {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  color: #191919;
  caret-color: #191919;
  background: #faf9f6;
  border: 1px solid #8a867f;
  border-radius: 4px;
  transition: background-color .2s, border-color .2s, box-shadow .2s;
}
.contact .contact-form .form-group input::placeholder,
.contact .contact-form .form-group textarea::placeholder {
  color: #69655f;
  opacity: 1;
}
.contact .contact-form .form-group input:hover,
.contact .contact-form .form-group select:hover,
.contact .contact-form .form-group textarea:hover {
  background: #fff;
  border-color: #5f5b55;
}
.contact .contact-form .form-group input:focus,
.contact .contact-form .form-group select:focus,
.contact .contact-form .form-group textarea:focus {
  background: #fff;
  border-color: #80652f;
  box-shadow: 0 0 0 3px rgba(128, 101, 47, .28);
  outline: 2px solid transparent;
}
.contact .contact-form .form-group input:user-invalid,
.contact .contact-form .form-group textarea:user-invalid {
  border-color: #a33a32;
  box-shadow: 0 0 0 3px rgba(163, 58, 50, .18);
}
.contact .contact-form .form-group input:disabled,
.contact .contact-form .form-group textarea:disabled {
  color: #625e58;
  background: #e8e5df;
  border-color: #969189;
  cursor: not-allowed;
  opacity: 1;
}
.contact .contact-form .form-submit {
  color: #fff;
  background: #191919;
  border: 1px solid #191919;
}
.contact .contact-form .form-submit:hover { color: #fff; background: #6f572b; border-color: #6f572b; }
.contact .contact-form .form-submit:focus-visible {
  outline: 3px solid #80652f;
  outline-offset: 3px;
}
.contact .contact-form .form-submit:disabled {
  color: #625e58;
  background: #e8e5df;
  border-color: #969189;
  cursor: not-allowed;
}
.contact .inquiry-feedback,
.contact .inquiry-configuring { background: #fff; }
.contact .inquiry-feedback--sent { color: #285c38; border-color: #477b55; background: #f2f8f3; }
.contact .inquiry-feedback--invalid,
.contact .inquiry-feedback--upload,
.contact .inquiry-feedback--failed,
.contact .inquiry-feedback--rate { color: #852d27; border-color: #a33a32; background: #fff5f4; }

@media (max-width: 768px) {
  .contact .contact-form .form-row { grid-template-columns: minmax(0, 1fr); }
}

/* Inquiry visual polish: a calm editorial introduction paired with a precise brief. */
.contact#contact {
  position: relative;
  display: block;
  width: 100%;
  padding: clamp(48px, 4vw, 56px) 0;
  overflow: hidden;
  background-color: #F7F5F0;
  background-image: url("https://qianyu2013.cn/wp-content/uploads/2026/09/f9852d10-8adf-4562-85c8-9dedcb52b1ef.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.contact#contact > .container { position: relative; max-width: 1200px; padding-inline: clamp(22px, 3vw, 34px); }
.contact#contact .contact-inner { grid-template-columns: minmax(0,39fr) minmax(0,61fr); gap: clamp(45px, 4.5vw, 54px); align-items: stretch; }
.contact#contact .contact-info { display: flex; flex-direction: column; min-height: 100%; padding: 2px clamp(22px, 2.4vw, 32px) 2px 0; border-right: 1px solid rgba(128,111,80,.24); }
.contact#contact .section-eyebrow { margin-bottom: 12px; color: #806f50; letter-spacing: .28em; }
.contact#contact .section-title { max-width: 420px; margin-bottom: 12px; font-size: clamp(30px, 2.2vw, 34px); line-height: 1.22; letter-spacing: .04em; }
.contact#contact .contact-sub { max-width: 330px; margin-bottom: 18px; font-size: 12px; line-height: 1.65; }
.inquiry-contact-options { display: flex; flex: 1; flex-direction: column; justify-content: space-between; gap: 14px; width: 100%; max-width: 330px; min-height: 350px; max-height: 410px; }
.inquiry-contact-option { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 11px; align-items: start; min-width: 0; padding: 0; color: #77736d; font-size: 11px; line-height: 1.45; }
.inquiry-contact-content { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding-top: 1px; }
.inquiry-contact-icon { display: grid; width: 31px; height: 31px; place-items: center; color: #806f50; background: rgba(128,111,80,.1); border: 1px solid rgba(128,111,80,.3); border-radius: 50%; }
.inquiry-contact-icon svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
.inquiry-contact-option strong,.inquiry-contact-option a { color: #292724; font-size: 12px; font-weight: 500; overflow-wrap: anywhere; }
.inquiry-contact-option a:hover { color: #80652f; }
.inquiry-contact-label { color: #806f50; font-size: 9px; letter-spacing: .16em; text-transform: uppercase; }
/* Standalone square QR: no negative-offset crop, for reliable iOS Safari rendering. */
.inquiry-wechat-crop { display: block; width: 115px; height: 115px; margin-top: 5px; background: #fff; }
.inquiry-wechat-qr { display: block; width: 115px; height: 115px; max-width: 100%; }
.inquiry-contact-option--whatsapp a { align-self: flex-start; text-decoration: underline; text-decoration-color: rgba(128,101,47,.4); text-underline-offset: 4px; }
.contact#contact .contact-form { width: 100%; max-width: 630px; justify-self: end; padding: 2px 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.contact#contact .contact-form h3 { margin-bottom: 15px; padding-bottom: 12px; border-bottom: 1px solid #dedad2; font-size: clamp(21px, 1.6vw, 23px); }
.contact#contact .contact-form .form-row { gap: 14px; }
.contact#contact .form-group { margin-bottom: 9px; }
.contact#contact .contact-form .form-group label { margin-bottom: 7px; color: #59554e; font-size: 10px; letter-spacing: .17em; }
.contact#contact .contact-form .form-group input,
.contact#contact .contact-form .form-group select,
.contact#contact .contact-form .form-group textarea { padding: 10px 12px; border-width: 0 0 1px; border-radius: 0; background: rgba(255,255,255,.24); }
.contact#contact .contact-form .form-group input:focus,
.contact#contact .contact-form .form-group select:focus,
.contact#contact .contact-form .form-group textarea:focus { background: rgba(255,255,255,.4); border-color: #80652f; box-shadow: none; }
.contact#contact .contact-form .form-group textarea { min-height: 68px; height: 68px; resize: vertical; }
.contact#contact .inquiry-upload input[type="file"] { width: 100%; padding: 6px 0; background: transparent; cursor: pointer; }
.contact#contact .inquiry-upload small { display: block; margin-top: 3px; color: #69655f; font-size: 11px; line-height: 1.45; }
.contact#contact .contact-form .form-submit { width: 100%; min-height: 44px; margin-top: 2px; padding-block: 0; }
.contact#contact .inquiry-privacy { margin: 7px 0 0; color: #69655f; font-size: 11px; line-height: 1.55; text-align: center; }
@media (max-width: 900px) {
  .contact#contact { background-position: 38% center; }
  .contact#contact .contact-inner { grid-template-columns: minmax(0,1fr); gap: 42px; }
  .contact#contact .contact-info { min-height: 0; padding: 0; border-right: 0; }
  .inquiry-contact-options { flex: none; justify-content: flex-start; min-height: 0; max-height: none; }
  .contact#contact .section-title, .contact#contact .contact-sub, .contact#contact .contact-details { max-width: 620px; }
  .contact#contact .contact-form { max-width: 520px; justify-self: start; }
  .contact#contact .contact-form .form-submit { width: 100%; }
}
@media (max-width: 520px) {
  .contact#contact { padding-block: 48px; background-position: 42% center; }
  .contact#contact > .container { padding-inline: 20px; }
  .inquiry-wechat-crop { width: 115px; height: 115px; }
}
/* Project detail: restrained editorial layout with graceful single-image handling. */
.project-detail{min-height:100vh;padding:120px 0 80px;background:var(--bg)}
.project-detail .project-page-inner{width:min(1440px,100%);margin:0 auto;padding:0 clamp(24px,4vw,64px)}
.project-back{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-bottom:clamp(40px,6vw,80px);padding:8px 12px 8px 0;color:var(--ink);font-size:13px;letter-spacing:.12em;transition:color .25s}
.project-back span[aria-hidden]{color:var(--gold);font-size:20px;line-height:1;transition:transform .25s}
.project-back:hover{color:var(--gold)}
.project-back:hover span[aria-hidden]{transform:translateX(-3px)}
.project-back:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.project-header{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:clamp(32px,7vw,100px);align-items:start;margin-bottom:clamp(44px,7vw,88px);border-top:1px solid var(--line);padding-top:clamp(24px,4vw,44px)}
.project-meta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:clamp(-20px,-2vw,-8px);color:var(--gold);font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.project-meta span:not(:last-child)::after{content:"/";margin-left:20px;color:var(--line)}
.project-title{margin:0;color:var(--ink);font-family:var(--serif-cn);font-size:clamp(34px,5vw,68px);font-weight:400;letter-spacing:.04em;line-height:1.25;overflow-wrap:anywhere}
.project-description h2{margin:0 0 16px;color:var(--gold);font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase}
.project-content{color:var(--ink-soft);font-size:15px;line-height:2}
.project-content > :first-child{margin-top:0}
.project-content > :last-child{margin-bottom:0}
.project-content img{height:auto}
.project-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,28px)}
.project-gallery--single{grid-template-columns:minmax(0,1200px);justify-content:center}
.project-gallery-item{min-width:0;margin:0;overflow:hidden;background:#EDE6D7}
.project-gallery-item img,.project-gallery-item picture{display:block;width:100%;height:auto}

@media (max-width:768px){
  .project-detail{padding:88px 0 52px!important}
  .project-detail .project-page-inner{padding-inline:clamp(18px,5vw,28px)!important}
  .project-back{margin-bottom:36px;padding-right:10px}
  .project-header{grid-template-columns:minmax(0,1fr);gap:24px;margin-bottom:40px;padding-top:24px}
  .project-meta{grid-column:auto;margin-bottom:0}
  .project-title{font-size:clamp(30px,10vw,44px)}
  .project-gallery{grid-template-columns:minmax(0,1fr)!important;gap:14px!important}
}

/* Unified project archive and product-level detail. */
.project-archive{background:var(--bg);min-height:100vh;padding:120px 0 80px}
.project-archive .project-page-inner{width:min(1440px,100%);margin:0 auto;padding:0 clamp(24px,4vw,64px)}
.project-filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:36px}
.project-filters a{padding:9px 18px;border:1px solid var(--line);color:var(--ink);font-size:13px;letter-spacing:.06em}
.project-filters a.is-active{border-color:var(--gold);background:var(--gold);color:#fff}
.project-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(8px,1.5vw,22px)}
.project-card{min-width:0}.project-card a{display:block;color:var(--ink)}
.project-card-media{display:block;aspect-ratio:3/2;overflow:hidden;background:#EDE6D7}
.project-card-media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .35s ease}
.project-card a:hover .project-card-media img{transform:scale(1.025)}
.project-card-title{display:block;padding:12px 2px 22px;font-family:var(--serif-cn);font-size:17px}
.project-empty{text-align:center;color:var(--ink-soft);padding:70px 0}
.project-detail-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,.8fr);gap:clamp(32px,5vw,80px);align-items:start}
.project-detail-layout .project-gallery{grid-template-columns:1fr;margin:0}
.project-detail-layout .project-header{display:block;position:sticky;top:110px;margin:0;padding-top:24px}
.project-detail-layout .project-meta{margin:0 0 20px}.project-detail-layout .project-title{margin-bottom:30px}
.related-projects{margin-top:clamp(64px,9vw,120px);padding-top:36px;border-top:1px solid var(--line)}
.related-projects>h2{margin:0 0 28px;font-family:var(--serif-cn);font-size:clamp(24px,3vw,36px);font-weight:400}
@media(max-width:768px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project-detail-layout{grid-template-columns:1fr}.project-detail-layout .project-header{position:static;order:-1}.project-filters{gap:8px}.project-filters a{padding:8px 12px}}

/* Homepage — fifth screen: CRAFT overview. */
.graf-craft{
  display:block;width:100%;height:auto;min-height:0;padding:0;color:#f0f1f3;
  background:#07111d;position:relative;overflow:hidden;isolation:isolate;scroll-margin-top:92px;
}
/* Keep the homepage on the viewport scrollport. `overflow-x:hidden` on body can
   create a non-scrolling sticky containing block in production browsers. */
body.qianyu-homepage{overflow-x:clip}
.craft-hero{
  position:relative;display:grid;grid-template-columns:minmax(400px,.9fr) minmax(520px,1.1fr);
  min-height:clamp(450px,28vw,545px);padding:clamp(72px,5.7vw,108px) clamp(48px,5.7vw,112px) clamp(60px,4.4vw,84px);
  background:
    radial-gradient(ellipse at 72% 48%,rgba(56,99,164,.34) 0,rgba(25,56,101,.17) 27%,transparent 60%),
    linear-gradient(112deg,#07111d 0%,#0a1729 47%,#0c1b31 74%,#07111d 100%);
}
.craft-hero::after{
  content:"";position:absolute;z-index:-1;inset:20% -8% 2% 43%;opacity:.58;filter:blur(22px);transform:rotate(-7deg);
  background:linear-gradient(168deg,transparent 28%,rgba(89,135,205,.2) 42%,rgba(31,67,119,.32) 52%,transparent 68%);
}
.craft-intro{position:relative;z-index:1;max-width:600px;align-self:center}
.craft-eyebrow{display:flex;align-items:center;gap:24px;margin:0 0 28px;color:#c9a675;font:500 11px/1.4 var(--sans);letter-spacing:.46em}
.craft-eyebrow::after{content:"";display:block;width:82px;height:1px;background:rgba(201,166,117,.72)}
.graf-craft .graf-craft-title{margin:0;color:#f0f1f3;font-family:var(--serif-cn);font-size:clamp(37px,2.85vw,56px);font-weight:300;line-height:1.32;letter-spacing:.035em}
.graf-craft .graf-craft-title span{display:block}
.graf-craft .graf-craft-title span:last-child{color:#c99d70}
.craft-lead{margin:28px 0 0;color:rgba(239,241,244,.76);font-family:var(--serif-cn);font-size:clamp(14px,1vw,17px);line-height:2;letter-spacing:.04em}
.craft-manifesto{display:flex;align-items:flex-start;gap:20px;margin:27px 0 0;color:#c7a171;font:500 10px/2 var(--sans);letter-spacing:.38em}
.craft-manifesto::before{content:"";flex:0 0 82px;height:1px;margin-top:10px;background:rgba(201,166,117,.75)}
.craft-manifesto span{display:block}
.craft-hero-visual{position:relative;min-width:0;align-self:stretch}
.craft-hero-image{
  position:absolute;inset:-24px clamp(-81px,-4.1vw,-35px) -24px -48px;width:calc(100% + 48px + clamp(35px,4.1vw,81px));height:calc(100% + 48px);
  object-fit:cover;object-position:50% 50%;opacity:.96;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 15%,#000 91%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent 0,#000 15%,#000 91%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%);mask-composite:intersect;
}
.craft-hero-statement{position:absolute;right:0;bottom:3%;margin:0;color:rgba(234,237,242,.66);font:400 10px/2.25 var(--sans);letter-spacing:.48em;text-align:left}
.graf-craft-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;background:#07111d;border-top:1px solid rgba(197,164,117,.14)}
.craft-process{min-width:0;margin:0;border-right:1px solid rgba(207,218,232,.14);background:linear-gradient(180deg,#0b1725 0%,#07111d 100%)}
.craft-process:last-child{border-right:0}
.craft-process-media{height:clamp(220px,16.5vw,326px);overflow:hidden;background:#0b1725}
.craft-process-media img{display:block;width:100%;height:100%;object-fit:cover}
.craft-process:nth-child(1) img{object-position:52% 45%}
.craft-process:nth-child(2) img{object-position:52% 48%}
.craft-process:nth-child(3) img{object-position:48% 45%}
.craft-process:nth-child(4) img{object-position:50% 48%}
.craft-process-copy{min-height:245px;padding:30px clamp(26px,2.6vw,52px) 40px}
.craft-process-kicker{display:flex;align-items:center;gap:18px;margin:0 0 10px;color:rgba(240,241,243,.84);font:500 9px/1 var(--sans);letter-spacing:.4em}
.craft-process-kicker::after{content:"";width:38px;height:1px;background:rgba(201,166,117,.7)}
.craft-process-num{color:#f3f3f1;font:300 42px/1 var(--serif-en);letter-spacing:0}
.craft-process-copy h3{display:inline-block;margin:0 0 14px;padding-bottom:3px;border-bottom:1px solid #b68d61;color:#f0f1f3;font-family:var(--serif-cn);font-size:21px;font-weight:300;line-height:1.4;letter-spacing:.08em}
.craft-process-copy>p:last-child{margin:0;color:rgba(230,233,237,.7);font-family:var(--serif-cn);font-size:13px;line-height:1.9;letter-spacing:.025em}
@media(max-width:1100px){
  .craft-hero{grid-template-columns:minmax(380px,1fr) minmax(360px,.9fr);padding-inline:clamp(36px,5vw,64px)}
  .craft-hero-image{inset:-26px clamp(-54px,-4.25vw,-31px) -26px -42px;width:calc(100% + 42px + clamp(31px,4.25vw,54px));height:calc(100% + 52px)}
  .graf-craft-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .craft-process:nth-child(2){border-right:0}.craft-process:nth-child(-n+2){border-bottom:1px solid rgba(207,218,232,.14)}
  .craft-process-media{height:clamp(240px,29vw,330px)}
}


/* Homepage — sixth screen: ABOUT QIANYU. */
.about-qianyu{display:flex;width:100%;min-height:clamp(680px,100vh,920px);padding:0;background:#e9e0d3;position:relative;overflow:hidden;align-items:center}
.about-qianyu-media{position:absolute;inset:0;margin:0}
.about-qianyu-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,243,236,.98) 0%,rgba(247,243,236,.94) 25%,rgba(247,243,236,.54) 42%,rgba(247,243,236,.06) 62%,transparent 78%)}
.about-qianyu-media img{width:100%;height:100%;object-fit:cover;object-position:center center}
.about-qianyu-content{position:relative;z-index:1;width:min(38%,560px);margin-left:clamp(64px,6.5vw,120px);padding:clamp(74px,7vh,104px) 0;color:#242321}
.about-qianyu-eyebrow{display:flex;align-items:center;gap:22px;margin:0 0 40px;font-family:var(--serif-cn);font-size:14px;letter-spacing:.08em}
.about-qianyu-eyebrow::after{content:"";width:32px;height:1px;background:rgba(36,35,33,.55)}
.about-qianyu h2{margin:0 0 26px;font-family:var(--serif-cn);font-size:clamp(31px,2.3vw,44px);font-weight:300;line-height:1.45;letter-spacing:.035em}
.about-qianyu h2 span{display:block}
.about-qianyu-intro{margin:0;color:#5f5b55;font-family:var(--serif-cn);font-size:15px;line-height:2;letter-spacing:.025em}
.about-qianyu-emphasis{margin:31px 0 30px;padding-top:27px;position:relative;font-family:var(--serif-cn);font-size:19px;line-height:1.6;letter-spacing:.04em}
.about-qianyu-emphasis::before{content:"";position:absolute;top:0;left:0;width:32px;height:1px;background:rgba(36,35,33,.55)}
.about-qianyu-link{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-width:150px;padding:13px 23px;background:#20201f;border:1px solid #20201f;color:#f7f5f0;font-size:13px;letter-spacing:.08em;transition:background-color .25s,border-color .25s}
.about-qianyu-link:hover{background:#6f572b;border-color:#6f572b}
.about-qianyu-link:focus-visible{outline:2px solid #80652f;outline-offset:4px}
@media(max-width:900px){
  .about-qianyu-content{width:min(48%,500px);margin-left:clamp(40px,5.5vw,60px)}
  .about-qianyu-media::after{background:linear-gradient(90deg,rgba(247,243,236,.98) 0%,rgba(247,243,236,.9) 36%,rgba(247,243,236,.3) 68%,transparent 90%)}
  .about-qianyu h2{font-size:clamp(28px,4vw,37px)}
}
@media(max-width:768px){
  .about-qianyu{display:flex!important;min-height:680px!important;padding:0!important;overflow:hidden!important;align-items:flex-end}
  .about-qianyu>.about-qianyu-media{padding:0!important}
  .about-qianyu-media img{object-position:62% center}
  .about-qianyu-media::after{background:linear-gradient(180deg,rgba(247,243,236,.08) 0%,rgba(247,243,236,.4) 38%,rgba(247,243,236,.96) 66%,#f7f3ec 100%)}
  .about-qianyu>.about-qianyu-content{width:100%;margin:0;padding:220px 20px 54px!important}
  .about-qianyu h2{margin-bottom:22px!important;font-size:clamp(30px,8vw,39px)!important}
  .about-qianyu-intro br{display:none}
}

/* Homepage — desktop transition from CRAFT to ABOUT QIANYU. */
.home-panel-stack{position:relative;z-index:1;height:auto;overflow:visible;isolation:isolate}
.home-panel-stack>.graf-craft{position:-webkit-sticky;position:sticky;bottom:0;z-index:1;align-self:end}
.home-panel-stack>.about-qianyu{position:relative;z-index:2;scroll-margin-top:0}
/* Homepage CRAFT artwork — full-bleed, no side gutters. */
.graf-craft[data-craft-layout="artwork"]{
  width:100vw;
  max-width:none;
  margin:0;
  padding:0!important;
  background:#f4f0e9;
  overflow:hidden!important;
}
.graf-craft[data-craft-layout="artwork"]>.craft-artwork-fullbleed{
  width:100vw;
  max-width:none;
  margin:0;
  padding:0!important;
  line-height:0;
  overflow:hidden;
}
.graf-craft[data-craft-layout="artwork"] .qianyu-fullscreen-picture{
  display:block;
  width:100vw;
  max-width:none;
  margin:0;
  padding:0;
}
.graf-craft[data-craft-layout="artwork"] .craft-artwork-image{
  display:block;
  width:100vw!important;
  max-width:none!important;
  height:auto!important;
  margin:0!important;
  object-fit:cover;
  object-position:center top;
}
@media(max-width:768px){
  .graf-craft[data-craft-layout="artwork"]{
    padding:0!important;
  }
  .graf-craft[data-craft-layout="artwork"]>.craft-artwork-fullbleed{
    padding:0!important;
  }
}


/* Standalone craftsmanship page — artwork only, full-bleed below the site header. */
body.page-template-default .craftsmanship-page,
body.page-template-page-craftsmanship .craftsmanship-page,
body.page-craftsmanship .craftsmanship-page{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  overflow:hidden;
  background:#f4f0e9;
}
.craftsmanship-artwork{
  width:100vw;
  max-width:none;
  margin:0;
  padding:0;
  line-height:0;
  overflow:hidden;
}
.craftsmanship-artwork .qianyu-fullscreen-picture{
  display:block;
  width:100vw;
  max-width:none;
  margin:0;
  padding:0;
}
.craftsmanship-artwork-image{
  display:block;
  width:100vw!important;
  max-width:none!important;
  height:auto!important;
  margin:0!important;
  object-fit:cover;
  object-position:center top;
}


/* Standalone craftsmanship page: merge the navigation into the artwork. */
.site-header--craftsmanship{
  background:linear-gradient(180deg,rgba(22,16,11,.42) 0%,rgba(22,16,11,.18) 58%,rgba(22,16,11,0) 100%);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom-color:transparent;
  box-shadow:none;
}
.site-header--craftsmanship .nav-main a,
.site-header--craftsmanship .nav-lang,
.site-header--craftsmanship .nav-lang a,
.site-header--craftsmanship .lang-link{
  color:rgba(255,252,245,.92);
  text-shadow:0 1px 12px rgba(18,12,8,.28);
}
.site-header--craftsmanship .nav-lang span,
.site-header--craftsmanship .lang-separator{
  color:rgba(217,186,132,.72);
}
.site-header--craftsmanship .nav-main a::after{
  background:#d5ae70;
}
.site-header--craftsmanship .nav-toggle span{
  background:rgba(255,252,245,.94);
}

/* Once the user leaves the dark top artwork, return to the standard readable header. */
.site-header--craftsmanship.scrolled{
  background:rgba(247,245,240,.9);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:0!important;
  box-shadow:none!important;
}
.site-header--craftsmanship.scrolled .nav-main a,
.site-header--craftsmanship.scrolled .nav-lang,
.site-header--craftsmanship.scrolled .nav-lang a,
.site-header--craftsmanship.scrolled .lang-link{
  color:var(--ink);
  text-shadow:none;
}
.site-header--craftsmanship.scrolled .nav-lang span,
.site-header--craftsmanship.scrolled .lang-separator{
  color:var(--line);
}
.site-header--craftsmanship.scrolled .nav-toggle span{
  background:var(--ink);
}

@media(max-width:768px){
  .site-header--craftsmanship .nav-main.open{
    background:#f7f5f0;
  }
  .site-header--craftsmanship .nav-main.open a{
    color:var(--ink);
    text-shadow:none;
  }
}

.site-header--craftsmanship,
.site-header--craftsmanship.scrolled{
  border-bottom:0!important;
  box-shadow:none!important;
  outline:0!important;
}
