@charset "utf-8";

/* ============================================================
   单页通用 — 高端精致版（极光 Hero + 金色点缀 + 悬浮白卡片）
   ============================================================ */
:root{
    --ink:#0b1020;
    --bg:#ffffff;
    --bg-soft:#f5f8fd;
    --text:#2a3142;
    --muted:#707a90;
    --line:#e7ecf5;
    --brand:#4f7cff;
    --brand-2:#7c5cff;
    --gold:#e7c27d;
    --grad:linear-gradient(120deg,#4f7cff 0%,#7c5cff 45%,#25d6c6 100%);
    --grad-gold:linear-gradient(120deg,#f0d29a,#d8a24a);
    --shadow-sm:0 8px 30px rgba(20,30,60,.06);
    --shadow-md:0 18px 50px rgba(20,30,60,.10);
    --shadow-lg:0 30px 80px rgba(20,30,60,.14);
    --radius:22px;
}

.page-page{ background:var(--bg-soft); -webkit-font-smoothing:antialiased; }

/* ============ HERO ============ */
.page-banner{
    position:relative; overflow:hidden;
    padding:152px 0 96px;
    background:radial-gradient(120% 130% at 50% -10%, #1a264f 0%, #0c1226 55%, #070b16 100%);
    color:#fff; text-align:center;
}
.page-banner-aurora{ position:absolute; inset:0; overflow:hidden; filter:blur(10px); }
.page-banner-aurora span{ position:absolute; border-radius:50%; opacity:.5; mix-blend-mode:screen; }
.page-banner-aurora .b1{ width:520px; height:520px; left:-8%; top:-14%; background:radial-gradient(circle,#4f7cff,transparent 65%); animation:pbFloat1 15s ease-in-out infinite; }
.page-banner-aurora .b2{ width:460px; height:460px; right:-6%; top:4%; background:radial-gradient(circle,#7c5cff,transparent 65%); animation:pbFloat2 18s ease-in-out infinite; }
.page-banner-aurora .b3{ width:380px; height:380px; left:28%; bottom:-20%; background:radial-gradient(circle,#25d6c6,transparent 65%); animation:pbFloat3 20s ease-in-out infinite; }
@keyframes pbFloat1{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(40px,28px) scale(1.08);} }
@keyframes pbFloat2{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(-34px,24px) scale(1.1);} }
@keyframes pbFloat3{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(28px,-26px) scale(1.06);} }
.page-banner-grid{
    position:absolute; inset:0;
    background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
    background-size:56px 56px;
    -webkit-mask-image:radial-gradient(120% 90% at 50% 28%,#000 30%,transparent 75%);
    mask-image:radial-gradient(120% 90% at 50% 28%,#000 30%,transparent 75%);
}
.page-banner-inner{ position:relative; z-index:2; }
.page-crumb{ display:inline-flex; align-items:center; gap:10px; font-size:13px; letter-spacing:.18em; color:rgba(255,255,255,.6); margin-bottom:22px; text-transform:uppercase; }
.page-crumb a{ color:rgba(255,255,255,.72); text-decoration:none; transition:.3s; }
.page-crumb a:hover{ color:#fff; }
.page-crumb span{ opacity:.5; }
.page-crumb em{ font-style:normal; color:var(--gold); }
.page-title{
    font-size:clamp(30px,4.6vw,56px); font-weight:800; letter-spacing:1px; line-height:1.25; margin:0;
    background:linear-gradient(180deg,#ffffff 25%,#c8d6ff 100%);
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.page-title-divider{ display:flex; align-items:center; justify-content:center; gap:14px; margin-top:26px; }
.page-title-divider .line{ width:64px; height:1px; background:linear-gradient(90deg,transparent,var(--gold)); }
.page-title-divider .line:last-child{ background:linear-gradient(90deg,var(--gold),transparent); }
.page-title-divider .diamond{ width:9px; height:9px; transform:rotate(45deg); background:var(--gold); box-shadow:0 0 14px rgba(231,194,125,.6); }
/* ============ 单页导航 ============ */
.about-subnav{ position:relative; z-index:4; background:var(--bg-soft); border-bottom:1px solid var(--line); }
.about-subnav-inner{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; padding:16px 24px; }
.about-subnav-link{ display:inline-flex; align-items:center; padding:9px 20px; border-radius:999px; font-size:14.5px; font-weight:600; color:var(--text); text-decoration:none; border:1px solid var(--line); transition:.3s cubic-bezier(.2,.7,.3,1); }
.about-subnav-link:hover{ color:var(--brand); border-color:var(--brand); background:#fff; transform:translateY(-1px); }
.about-subnav-link.currclass{ color:#fff; background:var(--grad); border-color:transparent; box-shadow:0 8px 20px rgba(79,124,255,.35); }
/* ============ 正文卡片 ============ */
.page-main{
    position:relative; z-index:3;
    background:var(--bg-soft);
    border-radius:44px 44px 0 0;
    margin-top:-44px;
    padding:64px 0 100px;
}
.page-article{
    position:relative;
    max-width:1680px; margin:0 auto;
    background:var(--bg);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow-lg);
    overflow:hidden;
}
.page-article::before{ content:""; display:block; height:5px; background:var(--grad-gold); }
.page-article-inner{ padding:64px 64px 56px; }

/* ============ 排版精修 ============ */
.page-content{ font-size:16px; line-height:2; color:var(--text); }
.page-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;
}
.page-content p{ margin:0 0 20px; }
.page-content img{ max-width:100%; height:auto; border-radius:14px; margin:14px 0; box-shadow:var(--shadow-sm); border:1px solid var(--line); }
.page-content a{ color:var(--brand); text-decoration:none; border-bottom:1px solid rgba(79,124,255,.3); transition:.3s cubic-bezier(.2,.7,.3,1); }
.page-content a:hover{ color:var(--brand-2); border-bottom-color:var(--brand-2); }
.page-content h2,.page-content h3,.page-content h4{ color:var(--ink); margin:34px 0 16px; line-height:1.4; font-weight:800; }
.page-content h2{ font-size:25px; padding-left:18px; position:relative; }
.page-content h2::before{ content:""; position:absolute; left:0; top:7px; bottom:7px; width:5px; border-radius:4px; background:var(--grad-gold); }
.page-content h3{ font-size:21px; }
.page-content h4{ font-size:18px; }
.page-content ul,.page-content ol{ padding-left:24px; margin:0 0 20px; }
.page-content li{ margin:8px 0; }
.page-content ul li::marker{ color:var(--gold); }
.page-content blockquote{
    margin:24px 0; padding:18px 24px;
    border-left:4px solid var(--gold);
    background:linear-gradient(90deg,rgba(231,194,125,.10),transparent);
    border-radius:0 12px 12px 0; color:#3a4256; font-style:italic;
}
.page-content strong{ color:var(--ink); }
.page-content hr{ border:none; height:1px; background:linear-gradient(90deg,transparent,var(--line),transparent); margin:36px 0; }

/* ============ 结尾点缀 ============ */
.page-end-mark{ display:flex; align-items:center; justify-content:center; gap:12px; padding:0 0 40px; }
.page-end-mark span{ width:46px; height:1px; background:linear-gradient(90deg,transparent,var(--line)); }
.page-end-mark span:last-child{ background:linear-gradient(90deg,var(--line),transparent); }
.page-end-mark i{ width:7px; height:7px; transform:rotate(45deg); background:var(--gold); opacity:.7; }

/* ============ 响应式 ============ */
@media (max-width:760px){
    .page-banner{ padding:120px 0 74px; }
    .page-main{ border-radius:32px 32px 0 0; margin-top:-32px; padding:44px 0 70px; }
    .page-article-inner{ padding:40px 22px 36px; }
    .page-content > p:first-of-type::first-letter{ font-size:2.6em; }
}