/* layout_L1.css — L1 左目录长文（长文型，新增）
*
* 结构：左固定TOC + 右正文(H2分段)
* 适配：PC 流量为主的长教程（SERP 跳转链接最强）
* Bing 价值：TOC → SERP sitelinks，长停留
*
* 依赖 seo_global.css 公共层（:root 变量 / .container / .main-content 等）
* 本文件仅定义 L1 特有的布局选择器。
*
* 引入方式：L1 站点的 在 seo_global.css 之后引入本文件：
*
*
*/
/* ── L1 整页布局：左目录 + 右正文 ── */
.l1-layout {
display: grid;
grid-template-columns: 210px 1fr;
gap: 34px;
padding: 30px 20px;
align-items: start;
}
/* ── 左侧目录导航 ── */
.l1-toc {
position: sticky;
top: 80px;
background: var(--gray-50);
border: 1px solid var(--gray-200);
border-radius: 10px;
padding: 15px;
}
.l1-toc h3 {
font-size: 11px;
font-weight: 800;
color: var(--gray-400);
text-transform: uppercase;
letter-spacing: 0.5px;
margin-bottom: 9px;
}
.l1-toc ul {
list-style: none;
padding: 0;
}
.l1-toc li {
margin-bottom: 2px;
}
.l1-toc a {
display: block;
padding: 6px 9px;
font-size: 13px;
color: var(--gray-600);
border-left: 2px solid transparent;
border-radius: 0 4px 4px 0;
text-decoration: none;
transition: color .15s, border-color .15s, background .15s;
}
.l1-toc a:hover {
color: var(--blue);
background: var(--blue-50);
}
.l1-toc a.active {
color: var(--blue);
border-left-color: var(--blue);
background: var(--blue-50);
font-weight: 600;
}
/* ── 右侧正文区 ── */
/* 继承 seo_global.css .main-content 的 h1/h2/p 等样式 */
.l1-layout .main-content {
min-width: 0;
}
/* ── 移动端响应 ── */
@media (max-width: 768px) {
.l1-layout {
grid-template-columns: 1fr;
padding: 20px 16px;
}
.l1-toc {
position: static;
margin-bottom: 18px;
}
.l1-toc h3 {
font-size: 13px;
}
.l1-toc a {
font-size: 14px;
padding: 8px 12px;
}
}