/* header */
.site-header{
  position:fixed;left:0;top:0;right:0;
  height:var(--header-h);
  z-index:100;
  transition: background .25s ease, box-shadow .25s ease, color .25s ease;
  background:transparent;
  color:#fff;
}
.site-header.is-solid{
  background:#fff;
  color:var(--text);
  box-shadow:0 10px 30px rgba(0,0,0,.06);
}
.header-inner{
  height:100%;
  width:min(var(--wrap), calc(100% - 48px));
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.brand{display:flex;align-items:center;gap:12px}
.brand-logo{width:44px;height:44px;object-fit:contain}
.brand-text strong{display:block;font-size:16px;line-height:1}
.brand-text em{display:block;font-size:12px;opacity:.8;font-style:normal;margin-top:4px}

.nav{display:flex;gap:18px;align-items:center}
.nav-link{font-size:14px;opacity:.92;position:relative;padding:6px 2px}
.nav-link::after{
  content:""; position:absolute; left:0; bottom:-6px; height:2px; width:0;
  background:currentColor; transition:width .25s ease;
}
.nav-link:hover::after{width:100%}

.lang{display:flex;gap:10px;align-items:center;font-size:13px}
.lang a{opacity:.8}
.lang a.active{opacity:1;font-weight:700}

.icon-btn{
  width:36px;height:36px;border:1px solid rgba(255,255,255,.45);
  background:transparent;border-radius:999px;color:inherit;
}
.site-header.is-solid .icon-btn{border-color:rgba(0,0,0,.16)}

/* buttons: hover 左->右填充，离开缩回（需求） */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:46px;padding:0 18px;border-radius:2px;
  font-size:14px;letter-spacing:.5px;
  position:relative; overflow:hidden;
}
.btn-fill{
  background:transparent;
  border:1px solid rgba(255,255,255,.9);
  color:#fff;
}
.btn-fill::before{
  content:""; position:absolute; inset:0;
  background:rgba(255,255,255,.22);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .35s ease;
}
.btn-fill:hover::before{transform:scaleX(1)}
.btn-fill span, .btn-fill{z-index:1}

.btn-outline{
  border:1px solid rgba(255,255,255,.9);
  color:#fff;
}
.site-header.is-solid .btn-outline{border-color:rgba(0,0,0,.16); color:var(--text)}

/* “more” 横线 hover 缩短对齐（需求） */
.more-link{
  display:inline-flex;align-items:center;gap:12px;
  margin-top:18px; font-size:12px; letter-spacing:2px;
}
.more-line{
  display:inline-block; height:1px; width:72px; background:currentColor;
  transition:width .25s ease;
}
.more-link:hover .more-line{width:40px}

/* card hover：黑色半透明 + 字浮出（需求） */
.hover-mask .card-media{position:relative;display:block;border-radius:4px;overflow:hidden}
.hover-mask img{width:100%;height:240px;object-fit:cover;transform:scale(1);transition:transform .8s ease}
.hover-mask .mask{
  position:absolute;inset:0;background:rgba(0,0,0,0);
  display:flex;align-items:center;justify-content:center;
  transition:background .25s ease;
}
.hover-mask .mask-text{
  color:#fff; letter-spacing:2px; font-size:12px;
  transform:translateY(10px); opacity:0;
  transition:transform .25s ease, opacity .25s ease;
}
.hover-mask:hover img{transform:scale(1.06)}
.hover-mask:hover .mask{background:rgba(0,0,0,.45)}
.hover-mask:hover .mask-text{transform:translateY(0); opacity:1}

/* footer QR hover 预览 */
.site-footer{background:#6f6f72;color:#eee;margin-top:80px}
.footer-inner{
  width:min(var(--wrap), calc(100% - 48px));
  margin:0 auto; padding:34px 0;
  display:grid; grid-template-columns: 1.3fr 1fr 1fr 1fr;
  gap:24px;
}
.footer-brand{display:flex;gap:12px;align-items:center}
.footer-brand img{width:44px;height:44px;object-fit:contain}
.footer-meta{margin:14px 0 0; padding:0; list-style:none; font-size:13px; opacity:.9}
.footer-meta li{margin:6px 0}
.footer-link{display:inline-block;margin-top:10px;opacity:.9}
.qr-preview{width:150px;height:150px;background:#fff;border-radius:8px;overflow:hidden}
.qr-preview img{width:100%;height:100%;object-fit:cover}
.qr-list{display:flex;gap:10px;margin-top:12px}
.qr-dot{
  width:14px;height:14px;border-radius:999px;border:0;
  background:rgba(255,255,255,.6); cursor:pointer;
}
.qr-dot:hover{background:#fff}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.15);
  padding:14px 0; text-align:center; font-size:12px; opacity:.9
}