@charset "utf-8";
/* ==========================================================================
   全站品牌视觉统一层（作用域：body.page，即除首页外的所有页面）
   视觉基准与首页一致：hzxdwh.cn —— 墨绿 #17362d / 米白纸感 #f4f6f1 / 浅绿 #b8f07f
   加载顺序：style.css → docs.css → brand.css
   所有规则以 body.page 提权，覆盖模板遗留的紫色与内联样式
   ========================================================================== */

/* ============================ 1. 设计令牌与基础 ============================ */
body.page {
    --deep: #17362d;
    --deep-2: #122e26;
    --deeper: #0b1f19;
    --paper: #f4f6f1;
    --ink: #17231f;
    --muted: #5c6d64;
    --accent: #b8f07f;
    --accent-ink: #10261c;
    --line: rgba(23, 35, 31, .12);
    --line-w: rgba(255, 255, 255, .14);
    --maxw: 1240px;
    --gutter: 40px;

    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
        "Microsoft YaHei", sans-serif;
    font-size: 15px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

body.page a { color: inherit; }

body.page img { max-width: 100%; }

/* ============================ 2. 头部 ============================ */
body.page .hd {
    background: var(--deep);
}

/* 首页 .hd-wrap 是 border-box（总宽 1240），内页若为 content-box 会变成 1240+80，
   整块比首页宽 80px、左边缘偏 40px。统一为 border-box 才能与首页栅格对齐。 */
body.page .hd-wrap {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    width: auto;
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 13px var(--gutter);
}

body.page .hd-logo { display: block; color: inherit; }

body.page .hd-logo img {
    display: block;
    width: auto;
    height: 46px;
    max-width: none;
}

body.page .hd-nav {
    display: flex;
    gap: 38px;
    margin-left: auto;
}

body.page .hd-nav a {
    display: block;
    padding: 7px 0;
    font-size: 14.5px;
    color: rgba(255, 255, 255, .62);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: color .2s, border-color .2s;
}

body.page .hd-nav a:hover { color: #fff; }

body.page .hd-nav a.active {
    color: #fff;
    border-bottom-color: var(--accent);
}

/* ============================ 3. 页面标题区 ============================ */
body.page .page-head {
    background: var(--paper);
    padding: 74px 0 0;
}

body.page .page-head-wrap {
    box-sizing: border-box;
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 0 var(--gutter);
}

body.page .kicker {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 18px;
    font-size: 11.5px;
    letter-spacing: .24em;
    color: rgba(23, 35, 31, .42);
    text-transform: uppercase;
}

body.page .kicker::before {
    content: "";
    width: 26px;
    height: 1px;
    background: rgba(23, 35, 31, .3);
}

/* 面板显隐（会员中心 / 注册页 JS 依赖此类名，勿删） */
body.page .hidden { display: none !important; }

body.page .page-head h1 {
    margin: 0;
    font-size: 46px;
    line-height: 1.22;
    font-weight: 700;
    letter-spacing: -.015em;
    color: var(--ink);
}

/* 详情页的标题直接挂在正文里，用同一套字号 */
body.page .case-title {
    margin: 0 0 14px;
    font-size: 42px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -.015em;
    color: var(--ink);
    text-align: left;
}

/* ============================ 4. 内容容器 ============================ */
body.page .about,
body.page .main_bg,
body.page .doc-page {
    background: var(--paper);
    padding-bottom: 96px;
}

body.page .wrap {
    box-sizing: border-box;
    width: auto;
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 44px var(--gutter) 0;
}

body.page .row-fluid { padding: 0; }

body.page .section-title { display: none; }

/* ============================ 5. 正文排版 ============================ */
body.page h2 {
    color: var(--ink);
    font-weight: 700;
    letter-spacing: -.01em;
}

body.page h3 {
    color: var(--ink);
    font-weight: 600;
}

body.page p { color: var(--muted); }

/* ---------- 关于我们 ---------- */
body.page .row_side-left,
body.page .row_side-right {
    font-family: inherit;
}

body.page .row_side-left img {
    border-radius: 10px;
    margin: 0 0 1.4em;
}

body.page .row_side-right h3,
body.page .row_side-left h3 {
    font-family: inherit;
    font-size: 26px;
    color: var(--ink);
    margin-bottom: .7em;
}

body.page .row_side-left p,
body.page .row_side-right p {
    font-family: inherit;
    font-size: 15px;
    line-height: 2;
    color: var(--muted);
}

body.page .biz-list {
    margin: 1.4em 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--line);
}

body.page .biz-list li {
    padding: 16px 0;
    border-bottom: 1px solid var(--line);
    font-size: 14.5px;
    line-height: 1.9;
    color: var(--muted);
}

body.page .biz-list li b {
    display: inline-block;
    min-width: 7.5em;
    margin-right: 6px;
    font-weight: 600;
    color: var(--ink);
}

body.page .biz-list li:last-child { border-bottom: 0; }

/* 关于页左右比例：信息面板收窄，正文给足宽度 */
body.page .about-grid .row_side-left { width: 34%; }
body.page .about-grid .row_side-right { width: 60%; }

/* 左侧品牌信息面板（替代模板 stock 图） */
body.page .about-facts {
    padding: 38px 36px 40px;
    background: var(--deep);
    border-radius: 12px;
}

body.page .facts-kicker {
    margin: 0 0 24px;
    font-size: 11.5px;
    letter-spacing: .24em;
    color: rgba(255, 255, 255, .42);
}

body.page .about-facts ul {
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--line-w);
}

body.page .about-facts li {
    display: grid;
    grid-template-columns: 84px 1fr;
    gap: 16px;
    align-items: baseline;
    padding: 20px 0;
    border-bottom: 1px solid var(--line-w);
}

body.page .about-facts li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

body.page .about-facts b {
    font-size: 18px;
    font-weight: 600;
    color: var(--accent);
    letter-spacing: .01em;
}

body.page .about-facts span {
    font-size: 13.5px;
    line-height: 1.9;
    color: rgba(255, 255, 255, .64);
}

/* 中文默认逐字断行，会把「动漫后期」断成「动漫后 / 期」。
   给词组加 nowrap，让折行只落在顿号处。 */
body.page .about-facts i.nb {
    font-style: normal;
    white-space: nowrap;
}

/* ============================ 6. 作品案例列表 ============================ */
body.page .blog { padding: 0; }

body.page .case-lead {
    max-width: 760px;
    margin: 0 0 52px;
    font-size: 15px;
    line-height: 2;
    color: var(--muted);
    text-align: left;
}

body.page .middle-grids {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 34px;
}

body.page .middle-grids .images_1_of_4 {
    width: auto !important;
    float: none;
    margin: 0 !important;
    text-align: left;
}

body.page .middle-grids .images_1_of_4 img {
    display: block;
    width: 100% !important;
    height: auto;
    margin: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    box-shadow: 0 10px 26px rgba(23, 35, 31, .1);
    transition: transform .5s cubic-bezier(.2, .7, .3, 1), box-shadow .3s;
}

body.page .middle-grids .images_1_of_4:hover img {
    transform: translateY(-3px);
    box-shadow: 0 16px 34px rgba(23, 35, 31, .16);
}

body.page .middle-grids .images_1_of_4 h3 {
    margin: 22px 0 10px;
    padding: 0;
    font-family: inherit;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--ink);
}

body.page .middle-grids .images_1_of_4 p {
    margin: 0;
    padding: 0;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.9;
    color: var(--muted);
}

body.page .case-name { min-height: 0; }

body.page .middle-grids .images_1_of_4 > a:first-child { display: none; }

/* ============================ 7. 联系我们 ============================ */
body.page .contact-card {
    padding: 0;
    margin: 0;
    background: none;
    border: 0;
}

body.page .contact-card h4 {
    margin: 0 0 20px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0;
    color: var(--ink);
    text-transform: none;
}

body.page .contact-card dl {
    margin: 0;
    border-top: 1px solid var(--line);
}

body.page .contact-card dt {
    float: left;
    width: 5.5em;
    font-weight: 400;
    font-size: 13px;
    line-height: 2.5em;
    color: var(--muted);
}

body.page .contact-card dd {
    margin-left: 5.5em;
    font-size: 15.5px;
    line-height: 2.5em;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
    word-break: break-all;
}

body.page .contact-card dd a {
    color: var(--ink);
    text-decoration: none;
    border-bottom: 1px solid rgba(23, 35, 31, .2);
}

body.page .contact-card dd a:hover { border-bottom-color: var(--ink); }

body.page .step-list {
    counter-reset: st;
    list-style: none;
    margin: 26px 0 0;
    padding: 0;
    border-top: 1px solid var(--line);
}

body.page .step-list li {
    counter-increment: st;
    position: relative;
    padding: 20px 0 20px 3.2em;
    font-size: 15px;
    line-height: 1.95;
    color: var(--muted);
    border-bottom: 1px solid var(--line);
}

body.page .step-list li:before {
    content: counter(st, decimal-leading-zero);
    position: absolute;
    left: 0;
    top: 21px;
    width: auto;
    height: auto;
    background: none;
    color: rgba(23, 35, 31, .35);
    font-size: 12px;
    letter-spacing: .1em;
    line-height: 1.6;
}

/* ============================ 8. 表单（会员中心 / 注册） ============================ */
body.page .panel {
    max-width: 460px;
    margin: 0;
}

body.page .panel h3 {
    margin: 0 0 26px;
    padding-bottom: 20px;
    font-size: 22px;
    font-weight: 600;
    color: var(--ink);
    text-align: left;
    border-bottom: 1px solid var(--line);
}

body.page .panel label {
    display: block;
    margin: 20px 0 8px;
    font-size: 13px;
    color: var(--muted);
    letter-spacing: .02em;
}

body.page .panel input[type=text],
body.page .panel input[type=password],
body.page .panel input[type=email] {
    width: 100%;
    box-sizing: border-box;
    padding: 13px 15px;
    font-size: 14.5px;
    color: var(--ink);
    background: #fff;
    border: 1px solid rgba(23, 35, 31, .18);
    border-radius: 6px;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
}

body.page .panel input[type=text]:focus,
body.page .panel input[type=password]:focus,
body.page .panel input[type=email]:focus {
    border-color: var(--deep);
    box-shadow: 0 0 0 3px rgba(23, 54, 45, .1);
}

body.page .panel input[type=submit] {
    width: 100%;
    margin-top: 26px;
    padding: 0;
    height: 50px;
    font-size: 15px;
    font-weight: 600;
    color: var(--accent-ink);
    background: var(--accent);
    border: 0;
    border-radius: 6px;
    cursor: pointer;
    transition: background .2s, transform .2s;
}

body.page .panel input[type=submit]:hover { background: #c8f894; transform: translateY(-1px); }

body.page .panel input[type=submit]:disabled { opacity: .55; cursor: not-allowed; transform: none; }

/* 模板遗留的 #loginForm / #signupForm 规则（宽度 93.6%、8px 内边距）优先级高于类选择器，
   会把这些表单挤压成 281px。以下用同级 id 提权，把尺寸拉回正常。 */
body.page #loginForm,
body.page #signupForm,
body.page #nickForm,
body.page #pwdForm { width: auto; }

body.page #loginForm input:not([type=submit]),
body.page #signupForm input:not([type=submit]),
body.page #nickForm input:not([type=submit]),
body.page #pwdForm input:not([type=submit]) {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 13px 15px;
    font-family: inherit;
    font-size: 14.5px;
    color: var(--ink);
    background: #fff;
    border: 1px solid rgba(23, 35, 31, .18);
    border-radius: 6px;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
}

body.page #loginForm input:not([type=submit]):focus,
body.page #signupForm input:not([type=submit]):focus,
body.page #nickForm input:not([type=submit]):focus,
body.page #pwdForm input:not([type=submit]):focus {
    border-color: var(--deep);
    box-shadow: 0 0 0 3px rgba(23, 54, 45, .1);
}

body.page #loginForm input[type=submit],
body.page #signupForm input[type=submit],
body.page #nickForm input[type=submit],
body.page #pwdForm input[type=submit] {
    display: block;
    width: 100%;
    height: 50px;
    margin: 26px 0 0;
    padding: 0;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    color: var(--accent-ink);
    background: var(--accent);
    border: 0;
    border-radius: 6px;
    cursor: pointer;
    transition: background .2s, transform .2s;
}

body.page #loginForm input[type=submit]:hover,
body.page #signupForm input[type=submit]:hover,
body.page #nickForm input[type=submit]:hover,
body.page #pwdForm input[type=submit]:hover { background: #c8f894; transform: translateY(-1px); }

body.page .form-tip {
    display: none;
    margin-top: 14px;
    padding: 11px 14px;
    font-size: 13.5px;
    border-radius: 6px;
}

body.page .form-tip-ok { background: #e6f3e7; color: #1f6b3c; }

body.page .form-tip-err { background: #fbe9e9; color: #a8272e; }

body.page .panel-extra {
    margin-top: 22px;
    font-size: 13.5px;
    color: var(--muted);
    text-align: left;
}

body.page .panel-extra a {
    color: var(--ink);
    text-decoration: none;
    border-bottom: 1px solid rgba(23, 35, 31, .3);
}

body.page .panel-extra a:hover { border-bottom-color: var(--ink); }

body.page .btn-ghost {
    display: inline-flex;
    align-items: center;
    height: 44px;
    padding: 0 22px;
    font-size: 14px;
    color: var(--ink);
    background: transparent;
    border: 1px solid rgba(23, 35, 31, .24);
    border-radius: 6px;
    cursor: pointer;
    transition: border-color .2s, background .2s;
}

body.page .btn-ghost:hover {
    border-color: var(--ink);
    background: rgba(23, 35, 31, .04);
}

body.page .privacy {
    margin-top: 26px;
    padding: 18px 20px;
    background: #eaeee6;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.95;
    color: var(--muted);
}

body.page .user-box { text-align: left; }

body.page .user-box .u-name {
    margin: 0 0 8px;
    font-size: 24px;
    font-weight: 600;
    color: var(--ink);
}

body.page .user-box .u-meta {
    margin: 0 0 28px;
    font-size: 14px;
    line-height: 2;
    color: var(--muted);
}


/* 会员中心 / 注册：表单左、说明面板右 */
body.page .account-grid {
    display: grid;
    grid-template-columns: 460px 1fr;
    gap: 76px;
    align-items: start;
}

body.page .account-grid > .panel { grid-column: 1; }

body.page .account-aside {
    grid-column: 2;
    padding: 34px 32px 36px;
    background: var(--deep);
    border-radius: 12px;
}

body.page .account-aside ul {
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--line-w);
}

body.page .account-aside li {
    display: grid;
    grid-template-columns: 62px 1fr;
    gap: 16px;
    align-items: baseline;
    padding: 18px 0;
    border-bottom: 1px solid var(--line-w);
}

body.page .account-aside li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

body.page .account-aside b {
    font-size: 15px;
    font-weight: 600;
    color: var(--accent);
}

body.page .account-aside span {
    font-size: 13.5px;
    line-height: 1.9;
    color: rgba(255, 255, 255, .64);
}

/* ============================ 9. 文档页 ============================ */
body.page .doc-wrap {
    box-sizing: border-box;
    display: flex;
    align-items: flex-start;
    gap: 64px;
    width: auto !important;
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 44px var(--gutter) 96px;
}

body.page .doc-nav {
    flex: 0 0 200px;
    width: 200px;
    position: sticky;
    top: 30px;
    padding: 0;
    border-right: 0;
    border-left: 1px solid var(--line);
}

body.page .doc-nav a {
    display: block;
    margin: 0;
    padding: 11px 0 11px 18px;
    font-size: 14.5px;
    color: var(--muted);
    text-decoration: none;
    background: none;
    border: 0;
    border-left: 2px solid transparent;
    border-radius: 0;
    margin-left: -1px;
    transition: color .2s, border-color .2s;
}

body.page .doc-nav a:hover {
    color: var(--ink);
    background: none;
    border-left-color: rgba(23, 35, 31, .22);
}

body.page .doc-nav a.current {
    color: var(--ink);
    font-weight: 600;
    background: none;
    border-left-color: var(--deep);
}

body.page .doc-body {
    flex: 1;
    min-width: 0;
    max-width: 780px;
    font-size: 15px;
    line-height: 2.05;
    color: var(--muted);
}

body.page .doc-body h2 {
    margin: 2.2em 0 .8em;
    padding-top: 1.4em;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.6;
    color: var(--ink);
    border-top: 1px solid var(--line);
}

body.page .doc-body h2:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

body.page .doc-body h3 {
    margin: 1.7em 0 .6em;
    font-size: 15.5px;
    font-weight: 600;
    color: var(--ink);
}

body.page .doc-body p { margin: 0 0 1.05em; color: var(--muted); }

body.page .doc-body strong { color: var(--ink); }

body.page .doc-body a {
    color: var(--ink);
    text-decoration: none;
    border-bottom: 1px solid rgba(23, 35, 31, .3);
}

body.page .doc-body a:hover { border-bottom-color: var(--ink); }

body.page .doc-meta {
    margin: 0 0 2.2em !important;
    padding: 0 0 1.3em;
    font-size: 13px;
    line-height: 1.9;
    color: rgba(23, 35, 31, .45);
    border-bottom: 1px solid var(--line);
}

body.page .info-list {
    margin: 0 0 1.4em;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--line);
}

body.page .info-list li {
    display: flex;
    gap: 18px;
    margin: 0;
    padding: 12px 0;
    font-size: 14.5px;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
}

body.page .info-list li span {
    flex: 0 0 92px;
    color: var(--muted);
}

body.page .flow-list {
    margin: 0 0 1.4em;
    padding: 0;
    list-style: none;
    counter-reset: flow;
}

body.page .flow-list li {
    position: relative;
    margin: 0 0 1.1em;
    padding-left: 3.1em;
    line-height: 1.95;
    color: var(--muted);
}

body.page .flow-list li::before {
    counter-increment: flow;
    content: counter(flow, decimal-leading-zero);
    position: absolute;
    left: 0;
    top: .1em;
    width: 2.1em;
    height: 2.1em;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    letter-spacing: .06em;
    color: var(--deep);
    background: rgba(23, 54, 45, .08);
    border-radius: 50%;
}

body.page .pay-box {
    margin: 1.6em 0 0;
    padding: 24px 26px;
    background: #ffffff;
    border: 1px solid var(--line);
    border-left: 3px solid var(--deep);
    border-radius: 6px;
}

body.page .pay-box p { color: var(--muted); }

body.page .pay-box b { color: var(--ink); }

/* ============================ 10. 作品详情页 ============================ */
body.page .case-sub {
    margin: 0 0 44px;
    font-size: 13px;
    letter-spacing: .18em;
    color: rgba(23, 35, 31, .45);
    text-align: left;
}

/* 项目信息（题材 / 形式 / 分镜页数） */
body.page .case-meta {
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--line);
}

body.page .case-meta li {
    display: grid;
    grid-template-columns: 68px 1fr;
    gap: 14px;
    align-items: baseline;
    padding: 14px 0;
    font-size: 14.5px;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
}

body.page .case-meta span {
    font-size: 13px;
    color: var(--muted);
}

body.page .case-desc {
    max-width: 760px;
    margin: 0 0 46px;
    font-size: 15.5px;
    line-height: 2.05;
    color: var(--muted);
}

/* 详情页首屏：左侧文案 / 右侧封面 */
body.page .case-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 76px;
    align-items: start;
    padding-bottom: 78px;
}

body.page .case-hero-txt { padding-top: 4px; }

body.page .case-hero-pic img.case-cover {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    border-radius: 10px;
    border: 1px solid var(--line);
    box-shadow: 0 18px 46px rgba(23, 35, 31, .18);
}

body.page .case-gallery {
    max-width: 900px;
    margin: 0;
}

body.page .case-gallery-head {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 0 0 30px;
    padding-top: 30px;
    border-top: 1px solid var(--line);
}

body.page .case-gallery-head span {
    font-size: 11.5px;
    letter-spacing: .24em;
    color: rgba(23, 35, 31, .45);
    white-space: nowrap;
    text-transform: uppercase;
}

body.page .case-gallery-head i {
    flex: 1;
    height: 1px;
    background: var(--line);
}

body.page .case-gallery-head em {
    font-style: normal;
    font-size: 12px;
    letter-spacing: .06em;
    color: rgba(23, 35, 31, .45);
    white-space: nowrap;
}

body.page .case-gallery .case-page img {
    border-radius: 6px;
    border: 1px solid var(--line);
    box-shadow: 0 10px 30px rgba(23, 35, 31, .12);
}

body.page .case-note {
    max-width: 900px;
    margin: 46px 0 0;
    font-size: 14px;
    line-height: 1.9;
    color: var(--muted);
    text-align: left;
}

body.page .case-note a {
    color: var(--ink);
    text-decoration: none;
    border-bottom: 1px solid rgba(23, 35, 31, .3);
}

body.page .case-note a:hover { border-bottom-color: var(--ink); }

/* 详情页返回顶部的按钮改用品牌色 */
body.page .backtop {
    color: var(--deep);
    border-color: var(--line);
    box-shadow: 0 8px 24px rgba(23, 35, 31, .18);
}

body.page .backtop:hover {
    background: var(--deep);
    border-color: var(--deep);
    color: var(--accent);
    box-shadow: 0 12px 30px rgba(23, 54, 45, .35);
}

body.page .backtop:focus-visible { outline-color: var(--deep); }

/* ============================ 11. 页脚 ============================ */
body.page .footer {
    background: var(--deeper);
    padding: 46px 0 42px;
}

body.page .footer .wrap {
    box-sizing: border-box;
    width: auto;
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 0 var(--gutter);
}

body.page .footer .footer-left {
    float: none;
    padding: 0;
    text-align: left;
}

body.page .footer .copy p {
    margin: 0;
    font-family: inherit;
    font-size: 13px;
    line-height: 2.15;
    color: rgba(255, 255, 255, .48);
}

body.page .footer .copy p.copy-name { font-size: 13px; }

body.page .footer .copy p a {
    color: rgba(255, 255, 255, .74);
    text-decoration: none;
}

body.page .footer .copy p a:hover { color: var(--accent); }

body.page .footer .copy p.copy-links { margin-top: 8px; font-size: 12.5px; }

body.page .footer .copy p.copy-links span { color: rgba(255, 255, 255, .22); }

body.page .footer .copy p.copy-links a { color: rgba(255, 255, 255, .55); }

body.page .footer .copy p.copy-links a:hover { color: var(--accent); }

/* ============================ 12. 窄屏兜底（笔记本宽度） ============================ */
@media only screen and (max-width: 1180px) {

    body.page { --gutter: 28px; }

    body.page .page-head { padding-top: 56px; }

    body.page .page-head h1 { font-size: 38px; }

    body.page .case-title { font-size: 34px; }

    body.page .hd-nav { gap: 24px; }

    body.page .doc-wrap { gap: 40px; }

    body.page .doc-nav { flex-basis: 168px; width: 168px; }
}

@media only screen and (max-width: 900px) {

    body.page .middle-grids { grid-template-columns: 1fr; gap: 28px; }

    body.page .doc-wrap { flex-direction: column; gap: 28px; }

    body.page .doc-nav {
        position: static;
        width: 100%;
        flex: none;
        border-left: 0;
        border-bottom: 1px solid var(--line);
        padding-bottom: 12px;
        display: flex;
        flex-wrap: wrap;
        gap: 6px 20px;
    }

    body.page .doc-nav a { padding: 6px 0; border-left: 0; margin-left: 0; }

    body.page .doc-nav a.current { border-left: 0; color: var(--ink); }

    body.page .case-hero { grid-template-columns: 1fr; gap: 34px; }

    body.page .about-facts { padding: 30px 26px 32px; }

    body.page .contact-card dt { float: none; width: auto; line-height: 1.6; }

    body.page .contact-card dd { margin-left: 0; }
}