/*
    Dimension by HTML5 UP - Slim Build
    仅保留主页所需样式，移除未使用的 Form/Table/Button/Article/Modal 等
    从 1319 行精简至 ~300 行
*/

/* Reset */
*, *:before, *:after { box-sizing: border-box; }
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img, header, footer, nav, ul, li { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; }
header, footer, nav { display: block; }
ul { list-style: none; }

/* Basic */
body { background: #1b1f22; -webkit-text-size-adjust: none; }
@media screen and (max-width: 480px) { html, body { min-width: 320px; } }

body { color: #fff; font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-weight: 300; font-size: 1rem; line-height: 1.65; }
a { transition: color .2s, background-color .2s, border-bottom-color .2s; border-bottom: dotted 1px rgba(255,255,255,.5); text-decoration: none; color: inherit; }
a:hover { border-bottom-color: transparent; }

/* Type */
h1 { color: #fff; font-weight: 600; line-height: 1.3; letter-spacing: .5rem; font-size: 2.25rem; text-transform: uppercase; margin: 0 0 1rem 0; }
h1 a { color: inherit; text-decoration: none; }
p { margin: 0 0 2rem 0; }

@media screen and (max-width: 1680px) { html { font-size: 12pt; } }
@media screen and (max-width: 736px) { html { font-size: 11pt; } h1 { font-size: 1.75rem; line-height: 1.4; } }
@media screen and (max-width: 360px) { html { font-size: 10pt; } }

/* Image */
.logo img { border-radius: 100%; display: block; width: 100%; height: 100%; object-fit: cover; }

/* BG */
#bg {
    transform: scale(1); -webkit-backface-visibility: hidden;
    position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 1;
}
#bg:before, #bg:after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#bg:before {
    transition: background-color 2s ease-in-out;
    background-image: linear-gradient(to top, rgba(19,21,25,.5), rgba(19,21,25,.5));
    z-index: 2;
}
#bg:after {
    transform: scale(1.125); transition: transform .325s ease-in-out, filter .325s ease-in-out;
    background-image: url("../images/bg.webp"); background-position: center; background-size: cover; background-repeat: no-repeat;
    z-index: 1;
}

/* Wrapper */
#wrapper {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    position: relative; min-height: 100vh; width: 100%; padding: 4rem 2rem; z-index: 3;
}
@media screen and (max-width: 1680px) { #wrapper { padding: 3rem 2rem; } }
@media screen and (max-width: 736px)  { #wrapper { padding: 2rem 1rem; } }
@media screen and (max-width: 480px)  { #wrapper { padding: 1rem; } }

/* Header */
#header {
    display: flex; flex-direction: column; align-items: center;
    transition: transform .325s ease-in-out, filter .325s ease-in-out, opacity .325s ease-in-out;
    max-width: 100%; text-align: center;
}
#header > * { transition: opacity .325s ease-in-out; position: relative; margin-top: 3.5rem; }
#header > *:before { content: ''; display: block; position: absolute; top: calc(-3.5rem - 1px); left: calc(50% - 1px); width: 1px; height: calc(3.5rem + 1px); background: #fff; }
#header > :first-child { margin-top: 0; }
#header > :first-child:before { display: none; }

#header .logo { width: 5.5rem; height: 5.5rem; line-height: 5.5rem; border-radius: 100%; overflow: hidden; }

#header .content { border: solid #fff; border-width: 1px 0; max-width: 100%; }
#header .content .inner { transition: max-height .75s ease, padding .75s ease, opacity .325s ease-in-out .25s; padding: 3rem 2rem; max-height: 40rem; overflow: hidden; }
#header .content .inner > :last-child { margin-bottom: 0; }
#header .content p { text-transform: uppercase; letter-spacing: .2rem; font-size: .8rem; line-height: 2; }

#header nav ul { display: flex; margin-bottom: 0; list-style: none; padding-left: 0; border: solid 1px #fff; border-radius: 4px; }
#header nav ul li { padding-left: 0; border-left: solid 1px #fff; }
#header nav ul li:first-child { border-left: 0; }
#header nav ul li a { display: block; min-width: 7.5rem; height: 2.75rem; line-height: 2.75rem; padding: 0 1.25rem 0 1.45rem; text-transform: uppercase; letter-spacing: .2rem; font-size: .8rem; border-bottom: 0; }
#header nav ul li a:hover { background-color: rgba(255,255,255,.075); }
#header nav ul li a:active { background-color: rgba(255,255,255,.175); }

#header nav.use-middle:after { content: ''; display: block; position: absolute; top: 0; left: calc(50% - 1px); width: 1px; height: 100%; background: #fff; }
#header nav.use-middle ul li.is-middle { border-left: 0; }

@media screen and (max-width: 736px) {
    #header > * { margin-top: 2rem; }
    #header > *:before { top: calc(-2rem - 1px); height: calc(2rem + 1px); }
    #header .content .inner { padding: 2.5rem 1rem; }
    #header .content p { line-height: 1.875; }
}
@media screen and (max-width: 480px) {
    #header { padding: 1.5rem 0; }
    #header .content .inner { padding: 2.5rem 0; }
    #header nav ul { flex-direction: column; min-width: 10rem; max-width: 100%; }
    #header nav ul li { border-left: 0; border-top: solid 1px #fff; }
    #header nav ul li:first-child { border-top: 0; }
    #header nav ul li a { height: 3rem; line-height: 3rem; min-width: 0; width: 100%; }
    #header nav.use-middle:after { display: none; }
}

/* Footer */
#footer { transition: transform .325s ease-in-out, filter .325s ease-in-out, opacity .325s ease-in-out; width: 100%; max-width: 100%; margin-top: 2rem; text-align: center; }
#footer .copyright { letter-spacing: .2rem; font-size: .6rem; opacity: .75; margin-bottom: 0; text-transform: uppercase; }
#busuanzi_value_site_pv { display: inline; }

/* Social Icons */
.social-icons { display: flex; justify-content: center; align-items: center; gap: 1.5rem; margin-top: 2.5rem; }
#header .social-icons:before { display: none; }
.social-icons a { display: flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border: solid 1px rgba(255,255,255,.35); border-radius: 50%; transition: border-color .2s, background-color .2s, transform .2s; border-bottom: none; }
.social-icons a:hover { border-color: #fff; background-color: rgba(255,255,255,.075); transform: scale(1.1); }
.social-icons a svg { width: 1.3rem; height: 1.3rem; }
@media screen and (max-width: 480px) {
    .social-icons { gap: 1.2rem; margin-top: 2rem; }
}

/* WeChat QR Modal */
.wechat-modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99999; background: rgba(0,0,0,.7); justify-content: center; align-items: center; }
.wechat-modal.active { display: flex; }
.wechat-modal-content { position: relative; background: #fff; border-radius: 8px; padding: 1.5rem; text-align: center; max-width: 280px; }
.wechat-modal-content img { width: 240px; height: 240px; object-fit: cover; border-radius: 4px; display: block; margin: 0 auto .75rem; }
.wechat-modal-content p { color: #333; font-size: .9rem; margin: 0; }
.wechat-modal-close { position: absolute; top: -10px; right: -10px; width: 28px; height: 28px; background: #fff; border: none; border-radius: 50%; cursor: pointer; font-size: 16px; line-height: 28px; text-align: center; box-shadow: 0 2px 6px rgba(0,0,0,.3); color: #666; }

/* Loading — 原版 Dimension 动画：加载时禁用所有 transition，黑色遮罩 + 内容隐藏 */
body.is-loading *, body.is-loading *:before, body.is-loading *:after {
    animation: none !important;
    transition: none !important;
}
body.is-loading #bg:before { background-color: #000000; }
body.is-loading #header { filter: blur(0.125rem); }
body.is-loading #header > * { opacity: 0; }
body.is-loading #header .content .inner { max-height: 0; padding-top: 0; padding-bottom: 0; opacity: 0; }
body.is-loading #footer { opacity: 0; }

/* Pop-Text — 点击弹字特效 */
.pop-text {
    position: absolute; z-index: 99999; font-weight: bold; font-size: 14px;
    pointer-events: none; color: #ff6651;
    animation: popRise 1.5s ease-out forwards;
}
@keyframes popRise {
    0%   { opacity: 1; transform: translateY(0); }
    100% { opacity: 0; transform: translateY(-160px); }
}
