/* 硕儒教育站点矩阵 · 共享设计系统 v1
   基调：纸白 / 墨黑 / 藏蓝 / 一点金 · 杂志编辑排版 */
:root{
  --paper:#f7f5f0;--paper-2:#fffdf8;--ink:#14171c;--ink-2:#5c626b;
  --blue:#16418f;--blue-deep:#0c2a63;--gold:#e3a512;
  --hair:rgba(20,23,28,.14);
  --serif:"Songti SC","STSong","Noto Serif SC","SimSun",serif;
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.75;font-size:16px}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1060px;margin:0 auto;padding:0 24px}
::selection{background:var(--gold);color:var(--ink)}

/* 导航 */
.nav{position:sticky;top:0;z-index:90;background:rgba(247,245,240,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--hair)}
.nav-in{max-width:1060px;margin:0 auto;height:64px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.nav-logo img{height:36px;width:auto}
.nav-links{display:none;gap:28px;font-size:14px;letter-spacing:.06em;color:var(--ink-2)}
.nav-links a{position:relative;padding:4px 0}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold)}
.nav-tel{font-size:13px;letter-spacing:.05em;border:1px solid var(--ink);padding:7px 18px;border-radius:2px;transition:.2s;white-space:nowrap}
.nav-tel:hover{background:var(--ink);color:var(--paper)}
@media(min-width:900px){.nav-links{display:flex}}

/* 首屏 */
.hero{position:relative;overflow:hidden;padding:72px 0 0;background:linear-gradient(180deg,var(--paper) 0%,var(--paper-2) 100%)}
.hero-kicker{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.3em;color:var(--ink-2)}
.hero-kicker::before{content:"";width:34px;height:1px;background:var(--gold)}
.hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(34px,7.4vw,72px);line-height:1.24;margin:24px 0 0}
.hero h1 em{font-style:normal;color:var(--blue);position:relative}
.hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:.08em;height:.32em;background:rgba(227,165,18,.28);z-index:-1}
.hero-slogan{margin-top:18px;font-family:var(--serif);font-size:clamp(15px,2.2vw,20px);letter-spacing:.26em;color:var(--gold)}
.hero-sub{margin-top:16px;max-width:680px}
.hero-sub p{font-size:15.5px;color:var(--ink-2)}
.hero-actions{margin:40px 0 56px;display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 32px;font-size:15px;letter-spacing:.08em;border-radius:2px;transition:.2s;font-weight:500}
.btn:active{transform:scale(.97)}
.btn-blue{background:var(--blue);color:#fff}
.btn-blue:hover{background:var(--blue-deep)}
.btn-line{border:1px solid var(--hair);color:var(--ink)}
.btn-line:hover{border-color:var(--ink)}
.hero-note{font-size:13px;color:var(--ink-2)}
.hero-note b{color:var(--gold)}

/* 图片横幅 */
.band{position:relative;background:var(--blue-deep)}
.band img{width:100%;height:clamp(240px,46vw,480px);object-fit:cover;display:block}
.band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,42,99,.1) 0%,rgba(12,42,99,0) 38%,rgba(12,42,99,.74) 100%)}
.band-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;max-width:1060px;margin:0 auto;padding:20px 24px 24px;display:flex;justify-content:space-between;align-items:flex-end;gap:10px 24px;flex-wrap:wrap}
.band-cap h3{font-family:var(--serif);color:#fff;font-size:clamp(16px,2.6vw,23px);font-weight:700;letter-spacing:.1em}
.band-cap h3::before{content:"";display:inline-block;width:26px;height:1px;background:var(--gold);margin-right:12px;vertical-align:middle}
.band-cap p{color:rgba(255,255,255,.6);font-size:11px;letter-spacing:.3em;text-transform:uppercase}
.bridge{height:90px;background:linear-gradient(180deg,var(--blue-deep),var(--paper))}

/* 章节 */
.sec{padding:92px 0}
.sec.alt{background:linear-gradient(180deg,var(--paper) 0%,var(--paper-2) 12%,var(--paper-2) 88%,var(--paper) 100%)}
.sec-head{margin-bottom:52px;max-width:760px}
.sec-no{font-family:var(--serif);font-size:14px;letter-spacing:.3em;color:var(--gold)}
.sec-title{font-family:var(--serif);font-size:clamp(26px,4.4vw,42px);line-height:1.35;font-weight:700;margin-top:10px}
.sec-title i{font-style:normal;color:var(--blue)}
.sec-lead{margin-top:12px;font-size:14.5px;color:var(--ink-2);border-left:2px solid var(--gold);padding-left:18px;line-height:2}

/* 通用条目网格（细线卡片） */
.grid{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(22px,5vw,60px)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c4{grid-template-columns:repeat(4,1fr)}
@media(max-width:899px){.grid.c3,.grid.c4{grid-template-columns:1fr 1fr}}
@media(max-width:599px){.grid,.grid.c3,.grid.c4{grid-template-columns:1fr}}
.item{padding:26px 0 30px;border-top:1px solid var(--hair)}
.item .no{font-family:var(--serif);font-size:15px;color:var(--gold);letter-spacing:.15em}
.item h3{font-size:clamp(16px,2.2vw,20px);font-weight:600;margin:8px 0 8px;letter-spacing:.04em}
.item h3 span,.item h3 i{font-style:normal;font-size:12px;color:var(--gold);letter-spacing:.15em;margin-left:10px}
.item p{font-size:13.5px;color:var(--ink-2)}

/* 行式列表（方法论） */
.rows{border-top:1px solid var(--hair)}
.row{display:grid;grid-template-columns:72px 1fr;gap:4px 18px;padding:24px 6px;border-bottom:1px solid var(--hair);align-items:baseline;transition:background .2s}
.row:hover{background:rgba(22,65,143,.035)}
.row .no{font-family:var(--serif);font-size:clamp(22px,3.4vw,32px);color:rgba(20,23,28,.28);line-height:1.1}
.row h3{font-size:clamp(16px,2.2vw,19px);font-weight:600;letter-spacing:.05em}
.row p{grid-column:2;font-size:14px;color:var(--ink-2);margin-top:4px}
@media(min-width:900px){.row{grid-template-columns:88px 250px 1fr}.row p{grid-column:3;margin-top:0}}
.row.final{background:linear-gradient(120deg,var(--blue),var(--blue-deep));color:#fff;border-bottom-color:var(--blue-deep)}
.row.final .no{color:var(--gold)}
.row.final h3{color:#fff}
.row.final p{color:rgba(255,255,255,.75)}

/* 流程步骤 */
.steps{display:flex;flex-wrap:wrap;border:1px solid var(--hair);background:var(--paper-2)}
.steps div{flex:1 1 160px;padding:20px 14px;border-right:1px solid var(--hair);text-align:center;position:relative}
.steps div:last-child{border-right:none}
.steps b{font-family:var(--serif);font-size:12px;color:var(--gold);letter-spacing:.22em;display:block}
.steps h4{font-size:15.5px;font-weight:600;margin-top:6px;letter-spacing:.08em}
.steps p{font-size:12px;color:var(--ink-2);margin-top:4px}
@media(max-width:649px){.steps div{flex:1 1 100%;border-right:none;border-bottom:1px solid var(--hair)}}

/* 数据卡 */
.facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--hair)}
@media(max-width:699px){.facts{grid-template-columns:1fr 1fr}}
.facts>div{padding:22px 8px 26px;border-bottom:1px solid var(--hair);border-right:1px solid var(--hair)}
.facts>div:nth-child(4n){border-right:none}
@media(max-width:699px){.facts>div:nth-child(4n){border-right:1px solid var(--hair)}.facts>div:nth-child(2n){border-right:none}}
.facts b{font-family:var(--serif);font-size:clamp(24px,3.6vw,36px);color:var(--blue);display:block;line-height:1.3;font-weight:700}
.facts b i{font-style:normal;font-size:.5em;color:var(--gold)}
.facts span{font-size:12.5px;color:var(--ink-2)}
.facts em{display:block;font-style:normal;font-size:11px;color:rgba(20,23,28,.35);margin-top:2px}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:12px}
.chips span{font-size:13.5px;padding:8px 18px;border:1px solid var(--hair);border-radius:999px;background:var(--paper-2);color:var(--ink-2)}
.chips span.hot{border-color:var(--blue);color:var(--blue)}

/* 名单墙 */
.wall{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--hair)}
.wall div{padding:20px 8px;text-align:center;border-bottom:1px solid var(--hair);border-right:1px solid var(--hair)}
.wall div:nth-child(4n){border-right:none}
.wall b{font-family:var(--serif);font-size:clamp(14px,2.2vw,19px);font-weight:700;letter-spacing:.1em;display:block}
.wall span{font-size:11px;color:var(--gold);letter-spacing:.2em}
@media(max-width:649px){.wall{grid-template-columns:repeat(2,1fr)}.wall div:nth-child(4n){border-right:1px solid var(--hair)}.wall div:nth-child(2n){border-right:none}}

/* 横向滑动（证书/截图） */
.hscroll-h{margin:48px 0 16px;display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hscroll-h h3{font-family:var(--serif);font-size:clamp(16px,2.4vw,20px);letter-spacing:.1em}
.hscroll-h p{font-size:12px;color:var(--ink-2);letter-spacing:.1em}
.hscroll{display:flex;gap:14px;overflow-x:auto;padding:6px 2px 18px;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}
.hscroll figure{flex:0 0 auto;width:clamp(150px,34vw,190px);scroll-snap-align:start}
.hscroll img{width:100%;border:1px solid var(--hair);border-radius:4px;background:#fff;box-shadow:0 6px 18px rgba(20,23,28,.07)}
.hscroll figcaption{font-size:12px;color:var(--ink-2);text-align:center;margin-top:8px;line-height:1.5}
.hscroll.wide figure{width:clamp(240px,60vw,340px)}

/* 深色区块（课程矩阵等） */
.dark{background:var(--blue-deep);color:#fff;padding:84px 0}
.dark .sec-no{color:var(--gold)}
.dark .sec-title{color:#fff}
.dark .sec-title i{color:var(--gold)}
.dark .sec-lead{color:rgba(255,255,255,.65)}
.dark .chips span{border-color:rgba(255,255,255,.25);color:rgba(255,255,255,.85);background:transparent}
.dark .cg{margin-top:30px}
.dark .cg h4{font-size:13px;letter-spacing:.25em;color:var(--gold);margin-bottom:12px;font-weight:500}

/* 提示块 */
.note{margin-top:40px;padding:22px 24px;border:1px solid var(--hair);background:var(--paper-2);font-size:13px;color:var(--ink-2);line-height:2}
.note b{color:var(--blue)}
.blue-close{margin-top:52px;padding:26px 28px;background:linear-gradient(120deg,var(--blue),var(--blue-deep));color:#fff;font-family:var(--serif);font-size:clamp(15px,2.2vw,19px);letter-spacing:.06em;line-height:1.9}
.blue-close b{color:var(--gold);font-weight:400}

/* 联系 */
.contact{background:var(--blue-deep);color:#fff;padding:96px 0}
.c-grid{display:grid;grid-template-columns:1fr;gap:52px}
@media(min-width:900px){.c-grid{grid-template-columns:1.2fr 1fr;align-items:center}}
.c-eyebrow{font-size:12px;letter-spacing:.35em;color:var(--gold);margin-bottom:20px}
.c-title{font-family:var(--serif);font-size:clamp(28px,4.6vw,46px);line-height:1.42;font-weight:700}
.c-title em{font-style:normal;color:var(--gold)}
.c-tel{display:inline-block;margin-top:34px;font-family:var(--serif);font-size:clamp(28px,5vw,42px);letter-spacing:.06em;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:8px;transition:.2s}
.c-tel:hover{border-bottom-color:var(--gold);color:var(--gold)}
.c-tel small{display:block;font-family:var(--sans);font-size:12px;letter-spacing:.3em;color:rgba(255,255,255,.5);margin-bottom:8px}
.c-info{border-top:1px solid rgba(255,255,255,.18)}
.c-info div{display:flex;justify-content:space-between;gap:20px;padding:16px 2px;border-bottom:1px solid rgba(255,255,255,.12);font-size:14px}
.c-info dt{color:rgba(255,255,255,.55);letter-spacing:.1em;flex-shrink:0}
.c-info dd{text-align:right}
.c-info dd b{color:var(--gold);font-weight:500}

/* 页脚 */
footer{background:var(--blue-deep);color:rgba(255,255,255,.55);font-size:12.5px}
.f-matrix{max-width:1060px;margin:0 auto;padding:26px 24px 6px;display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center}
.f-matrix span{color:rgba(255,255,255,.4);letter-spacing:.15em;margin-right:6px}
.f-matrix a{letter-spacing:.06em;padding:2px 0;border-bottom:1px solid transparent}
.f-matrix a:hover{color:var(--gold)}
.f-in{max-width:1060px;margin:0 auto;padding:20px 24px 32px;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-wrap:wrap;gap:8px 26px;justify-content:space-between;align-items:center;line-height:2}
.f-in a:hover{color:var(--gold)}

/* 悬浮 */
.float{position:fixed;right:18px;bottom:24px;z-index:95;background:var(--ink);color:#fff;font-size:13px;letter-spacing:.1em;padding:13px 22px;border-radius:2px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
@media(min-width:900px){.float{display:none}}

/* 入场 */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease}
.reveal.on{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}
