@charset "utf-8";

/* ============================================================
   单页通用 — 黑白极简 + 品牌蓝（与 about 页面统一）
   ============================================================ */
:root{
    --ink:      #0b0f17;
    --bg:       #ffffff;
    --soft:     #f6f7f9;
    --line:     #eceef2;
    --muted:    #6a7283;
    --brand:    #2f6bff;
    --grad:     linear-gradient(120deg,#2f6bff,#7c5cff);
    --shadow-sm:0 8px 30px rgba(20,30,60,.06);
    --shadow-md:0 18px 50px rgba(20,30,60,.10);
}

.page-page{
    font-family:"PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased;
}
.page-page *{ box-sizing:border-box; }
.page-page a{ text-decoration:none; }

/* 内容容器（不限宽，贴近 about 风格） */
.pg-wrap{ max-width:none; margin:0 auto; padding:0 5vw; }

/* ============ HERO · 全屏极简 ============ */
.pg-hero{
    position:relative; min-height:100vh; display:flex; align-items:center;
    background:var(--bg); overflow:hidden; text-align:center;
}
.pg-hero__grid{
    position:absolute; inset:0;
    background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
    background-size:64px 64px;
    -webkit-mask-image:radial-gradient(120% 90% at 50% 30%,#000 20%,transparent 72%);
    mask-image:radial-gradient(120% 90% at 50% 30%,#000 20%,transparent 72%);
}
.pg-hero__glow{ position:absolute; width:520px; height:520px; border-radius:50%; filter:blur(80px); opacity:.5; }
.pg-hero__glow--l{ left:-160px; top:-120px; background:radial-gradient(circle,#2f6bff,transparent 65%); }
.pg-hero__glow--r{ right:-160px; bottom:-160px; background:radial-gradient(circle,#7c5cff,transparent 65%); }
.pg-hero__inner{ position:relative; z-index:2; width:100%; padding:0 5vw; }
.pg-crumb{ display:inline-flex; align-items:center; gap:12px; font-size:13px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-bottom:26px; }
.pg-crumb a{ color:var(--muted); transition:.3s; }
.pg-crumb a:hover{ color:var(--brand); }
.pg-crumb i{ font-style:normal; opacity:.5; }
.pg-crumb em{ font-style:normal; color:var(--brand); }
.pg-hero__title{
    font-size:clamp(40px,6vw,76px); line-height:1.12; font-weight:800; letter-spacing:1px; margin:0; color:var(--ink);
    background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.pg-hero__divider{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:34px; }
.pg-hero__line{ width:70px; height:1.5px; background:var(--line); }
.pg-hero__dot{ width:7px; height:7px; transform:rotate(45deg); background:var(--brand); }

/* ============ 单页导航 ============ */
.pg-subnav{ position:relative; background:var(--soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.pg-subnav__inner{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; padding:22px 0; }
.pg-subnav__link{
    display:inline-flex; align-items:center; padding:10px 22px; border-radius:999px;
    font-size:14px; font-weight:600; color:var(--muted); border:1px solid var(--line); background:#fff; transition:.3s;
}
.pg-subnav__link:hover{ color:var(--brand); border-color:var(--brand); transform:translateY(-1px); }
.pg-subnav__link.is-active{ color:#fff; background:var(--grad); border-color:transparent; box-shadow:0 10px 24px -8px rgba(47,107,255,.5); }

/* ============ 正文卡片 ============ */
.pg-main{ padding:90px 0 120px; background:var(--bg); }
.pg-article{
    position:relative; background:var(--bg); border:1px solid var(--line);
    border-radius:18px; box-shadow:var(--shadow-md); overflow:hidden;
}
.pg-article::before{ content:""; display:block; height:4px; background:var(--grad); }
.pg-article__inner{ padding:64px 70px 60px; }

/* ============ 排版精修 ============ */
.pg-content{ font-size:16px; line-height:2; color:var(--ink); }
.pg-content > p:first-of-type::first-letter{
    font-size:3.2em; font-weight:800; float:left; line-height:.82;
    padding:6px 14px 0 0; color:var(--brand); font-family:Georgia,"Songti SC",serif;
}
.pg-content p{ margin:0 0 20px; }
.pg-content img{ max-width:100%; height:auto; border-radius:12px; margin:14px 0; box-shadow:var(--shadow-sm); border:1px solid var(--line); }
.pg-content a{ color:var(--brand); border-bottom:1px solid rgba(47,107,255,.3); transition:.3s; }
.pg-content a:hover{ color:#5a3fff; border-bottom-color:#5a3fff; }
.pg-content h2,.pg-content h3,.pg-content h4{ color:var(--ink); margin:36px 0 16px; line-height:1.4; font-weight:800; }
.pg-content h2{ font-size:25px; padding-left:18px; position:relative; }
.pg-content h2::before{ content:""; position:absolute; left:0; top:7px; bottom:7px; width:5px; border-radius:4px; background:var(--grad); }
.pg-content h3{ font-size:21px; }
.pg-content h4{ font-size:18px; }
.pg-content ul,.pg-content ol{ padding-left:24px; margin:0 0 20px; }
.pg-content li{ margin:8px 0; }
.pg-content ul li::marker{ color:var(--brand); }
.pg-content blockquote{
    margin:24px 0; padding:18px 24px; border-left:4px solid var(--brand);
    background:linear-gradient(90deg,rgba(47,107,255,.06),transparent);
    border-radius:0 12px 12px 0; color:#3a4256; font-style:italic;
}
.pg-content strong{ color:var(--ink); }
.pg-content hr{ border:none; height:1px; background:linear-gradient(90deg,transparent,var(--line),transparent); margin:40px 0; }
.pg-content table{ width:100%; border-collapse:collapse; margin:20px 0; }
.pg-content table th,.pg-content table td{ border:1px solid var(--line); padding:10px 14px; text-align:left; }
.pg-content table th{ background:var(--soft); font-weight:700; color:var(--ink); }

/* ============ 响应式 ============ */
@media (max-width:760px){
    .pg-main{ padding:56px 0 80px; }
    .pg-article__inner{ padding:40px 24px 44px; }
    .pg-subnav__inner{ padding:16px 0; }
    .pg-content > p:first-of-type::first-letter{ font-size:2.6em; }
}
