/* 页面专属样式：craft.html
   由内联 <style> 抽离而来，仅在 craft.html 引用，避免污染其它页面。
   加载顺序须在 pages.css 之后以保持覆盖优先级。 */

/* ===== 原 craft.html 内联 <style> 第1块 ===== */
/* 工艺引导 CTA（无底色） */
.craft-guide{padding:54px 0}
.craft-guide .craft-guide-btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:26px}
.craft-guide .btn-ghost{background:transparent;border:1.5px solid #C9A15C;color:#222}
.craft-guide .btn-ghost:hover{background:#C9A15C;color:#fff}

/* ===== 原 craft.html 内联 <style> 第2块 ===== */
/* craft 独有：工艺卡 3D 微倾 */
.craft-step{perspective:1000px}
.craft-step .card{transition:transform .5s var(--ease),box-shadow .5s}
.craft-step .card:hover{transform:rotateY(2deg) rotateX(1deg) translateY(-4px);box-shadow:0 16px 44px rgba(27,21,16,.12)}
/* 工艺图渐显遮罩 */
.craft-step .thumb{-webkit-mask-image:linear-gradient(to bottom,#000 70%,transparent 100%);mask-image:linear-gradient(to bottom,#000 70%,transparent 100%)}
/* CRAFTSMANSHIP 标题渐变 */
.craft-title{background:linear-gradient(135deg,var(--gold-3),var(--gold-2),var(--gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
/* 底部引导板块微动效 */
.guide-cta .btn-gold{position:relative;overflow:hidden}
.guide-cta .btn-gold::after{content:'';position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transition:left .6s var(--ease)}
.guide-cta .btn-gold:hover::after{left:120%}