/* =====================================================================
 * geoshell.css — 全站「外壳」版式：深色三栏页脚（2026-11-01 整改）
 * ---------------------------------------------------------------------
 * 为什么有这份文件：页脚原来只有 GeoSite.cshtml 内联 <style> 里那一份，
 * 于是首页是这套深色三栏页脚、内页是 _Layout 的 .v-foot 链接墙——同一个站两种底部，
 * 客户判「头部跟底部应该共用一个组件，以首页为准」。页脚标记已经抽成
 * Pages/Shared/_GeoFoot.cshtml，版式则从内联 <style> 下沉到这里，整站都能引到。
 *
 * 挂载：只由 _Layout 在 Tenant.Slug == "chaoqin" 分支里 <link>，
 * 位置在 RenderSection("Head") 之后，所以落地页自己的 geosite.css 与内联样式仍在原位参与层叠。
 * 智搜/云庄主/喜座/润丰不加载本文件，输出逐字不变。
 *
 * 宽度口径：容器不再用内联那套 width:calc(100% - 48px)/1300，改成和皮肤同一条轨
 * （--zs-max 容器 + --zs-pad 内衬，见 chaoqin.css「容器同列」一节），
 * 这样页眉 logo、正文、页脚左缘落在同一条竖线上；变量由皮肤 :root 提供，
 * 蓝/红两套主题（后台【网站设置】切换）自动跟随。
 * 颜色保持首页原样（深底 + 灰蓝文字），因为客户指定的标准就是首页现在的观感。
 * ===================================================================== */

.gs-foot { background: #0d1526; color: #aab4c8; margin-top: 0; }
.gs-foot a { color: #aab4c8; text-decoration: none; }
.gs-foot a:hover { color: #fff; }

/* body 前缀提到 (0,1,1)：落地页那张内联样式表还在整份文件之后输出，
   同权重会被它按顺序盖掉，而这里写的正是"内页也要长成首页那样"的那套。 */
body .gs-foot-inner {
    width: auto; max-width: var(--zs-max); margin: 0 auto;
    display: grid; grid-template-columns: 1.4fr 1fr .8fr; gap: 40px;
    padding: 52px var(--zs-pad) 40px;
}
.gs-foot-brand .gs-foot-logo { font-size: 20px; font-weight: 800; color: #fff; letter-spacing: .02em; margin: 0 0 12px; }
.gs-foot-brand p { margin: 0 0 8px; font-size: 13px; line-height: 1.8; }
.gs-foot-tel { margin-top: 14px; font-size: 13px; }
.gs-foot-tel strong { color: #fff; font-size: 18px; margin-left: 6px; }
.gs-foot-tel .gs-wechat { display: block; margin-top: 6px; color: #aab4c8; }
.gs-foot-col h4, .gs-foot-col h3, .gs-foot-col h2 { margin: 0 0 14px; color: #e8edf6; font-size: 14px; font-weight: 600; }
/* 快捷导航两列排（grid-auto-flow:column + 固定 4 行）：项目多于 8 个时行数按内容自己加长，
   列宽不会塌，移动端整栏改单列（见下面断点）。 */
.gs-foot-col ul {
    list-style: none; margin: 0; padding: 0; display: grid;
    grid-template-columns: 1fr 1fr; grid-template-rows: repeat(4, auto); grid-auto-flow: column;
    gap: 8px 24px;
}
.gs-foot-col li { font-size: 13px; line-height: 1.6; }
.gs-foot-qr { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
/* 二维码 116×116 是后台出图尺寸 + width/height 属性，object-fit:contain 保证不拉伸不裁切 */
.gs-foot-qr img { width: 116px; height: 116px; border-radius: 10px; background: #fff; object-fit: contain; }
.gs-foot-qr p { margin: 0; font-size: 12px; width: 116px; text-align: center; }
/* 无二维码时联系方式描述不限制宽度（116px 是二维码 caption 宽度，地址/电话会折行过多） */
.gs-foot-qr .gs-foot-contact-desc { width: auto; text-align: left; font-size: 13px; line-height: 1.7; }

.gs-foot-base { border-top: 1px solid rgba(255,255,255,.08); }
body .gs-foot-base-inner {
    width: auto; max-width: var(--zs-max); margin: 0 auto;
    padding: 16px var(--zs-pad); font-size: 12px; color: #76829a;
    display: flex; flex-wrap: wrap; gap: 6px 18px;
}
.gs-foot-base a { color: #76829a; }

@media (max-width: 860px) {
    body .gs-foot-inner { grid-template-columns: 1fr; gap: 28px; padding: 40px var(--zs-pad) 30px; }
    .gs-foot-qr { align-items: center; }
    .gs-foot-col ul { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-flow: row; }
}
@media (max-width: 420px) {
    /* 390px 上两列快捷导航每项只剩 ~150px，「业务与解决方案」这类六字项会折行；
       窄屏本来就要滚动，收成单列比挤成两列好点。 */
    .gs-foot-col ul { grid-template-columns: 1fr; }
}

/* =====================================================================
 * 2026-11-01 批次一补：锚点遮挡（C4）+ 外壳移动端可点区（C5）
 * 实测数字与根因见 .qoder/sessions/2026-11-01-chaoqin-detail-checklist.md
 * ===================================================================== */

/* --- 锚点被吸顶页眉压住 ---
   页眉 position:sticky;top:0（皮肤 chaoqin.css:97），实测高 1200=79 / 1440=74 / 992=65 / ≤768=61；
   而带 id 的内容块 scroll-margin-top 全是 0px，跳 #history、#case-301001、#cta-contact 时
   标题正好顶在页眉底下（看不见的 74px）。按"最高页眉 + 13px 余量"给，窄档跟着页眉一起降。 */
main [id] { scroll-margin-top: 92px; }
@media (max-width: 992px) { main [id] { scroll-margin-top: 78px; } }
@media (max-width: 768px) { main [id] { scroll-margin-top: 74px; } }

/* --- 移动端可点区 ---
   390 档 tap_where.js 归属定位：页脚快捷导航 11 项只有 16px 高、备案号 20px、
   「联系我们」出口 21–25px（都在这份外壳自己的标记里）。只补纵向命中区，
   字号、行距、颜色不动，桌面端零影响。 */
@media (max-width: 768px) {
    .gs-foot-col ul { gap: 0 24px; }
    .gs-foot-col ul li a { display: block; padding: 11px 0; }
    .gs-foot-qr > a {
        display: inline-flex; align-items: center; justify-content: center;
        min-height: 44px; padding: 0 20px;
        border: 1px solid rgba(255,255,255,.3); border-radius: 999px; color: #fff;
    }
    .gs-foot-base-inner { gap: 0 18px; }
    .gs-foot-base-inner a { display: inline-flex; align-items: center; min-height: 40px; }
    /* 单列时 11 项 ×44px 会把页脚撑得很高，两列在 390 又会让六字项折行：
       窄档回到两列，但把命中区内衬留在 11px，靠列间距而不是行间距撑开。 */
    @media (max-width: 420px) { .gs-foot-col ul { grid-template-columns: 1fr; } }
}
