/* ===========================================================================
湖北刻度律师事务所官网 —— 站点样式补充
site.css 为参考稿原样复刻的样式表；本文件只承载新增组件的样式，
变量与命名风格与 site.css 保持一致。
=========================================================================== */
/* ---------------------------------------------------------------- 无障碍 */
.skip-link{position:absolute;left:-9999px;top:0;z-index:99;background:var(--ink);color:var(--on-ink);
padding:10px 16px;font-size:14px;}
.skip-link:focus{left:8px;top:8px;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
clip:rect(0 0 0 0);white-space:nowrap;border:0;}
/* ------------------------------------------------------------ 横幅标语字距
参考稿把标语写成「扎 根 荆 州 · 服 务 湖 北」并在字符间手动加了空格。
这里改由 CSS 统一控制字距，后台维护时直接输入自然文字即可，
视觉间距与参考稿保持一致；text-indent 用于抵消末位字距造成的偏移。 */
.sb-caption{letter-spacing:.4em; text-indent:.4em;}
/* ------------------------------------------------------------ 导航当前态 */
.nav-links a.on{border-color:var(--brass);}
.nav-links a:focus-visible,.burger:focus-visible,.phone-pill:focus-visible,
a:focus-visible,button:focus-visible,summary:focus-visible{
outline:2px solid var(--brass);outline-offset:2px;}
/* ------------------------------------------------------------ 律师肖像图 */
.lawyer-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
transition:transform .6s ease;}
.lawyer:hover .lawyer-photo img{transform:scale(1.12) translateY(-2%);}
/* -------------------------------------------------------------- 轮播图片 */
.kb-slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.05);
animation:kbzoom 18s infinite;}
/* ---------------------------------------------------------------- 二维码 */
.qr-box img{width:100%;height:100%;object-fit:contain;}
/* ---------------------------------------------------------------- 页脚补充 */
.foot-disclaimer{border-top:1px solid rgba(255,255,255,.12);padding-top:18px;margin-bottom:10px;
max-width:none;color:#7C8894;font-size:12.5px;}
/* ------------------------------------------------- 洞察列表：筛选与搜索 */
.filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:28px;}
.chip{font-size:13.5px;color:var(--ink-soft);border:1px solid var(--line);padding:6px 14px;
transition:all .15s;}
.chip:hover{border-color:var(--brass);color:var(--tx);}
.chip.on{background:var(--ink);color:var(--on-ink);border-color:var(--ink);}
.search-form{display:flex;margin-left:auto;gap:0;}
.search-form input{font:inherit;font-size:14px;padding:8px 12px;border:1px solid var(--line);
background:transparent;color:var(--tx);border-radius:0;min-width:200px;}
.search-form button{font:inherit;font-size:14px;padding:8px 16px;border:1px solid var(--ink);
background:var(--ink);color:var(--on-ink);cursor:pointer;}
.search-form button:hover{background:var(--seal);border-color:var(--seal);}
/* ------------------------------------------------------------------ 分页 */
.pager{display:flex;align-items:center;gap:20px;justify-content:center;padding:36px 0 8px;
font-size:14px;border-top:1px solid var(--line);margin-top:36px;}
.pager a{border-bottom:1px solid var(--line);padding-bottom:1px;}
.pager a:hover{border-color:var(--tx);color:var(--seal);}
.pager .disabled{color:var(--ink-soft);opacity:.45;}
.pager-info{color:var(--ink-soft);font-family:var(--font-serif);font-size:13px;}
/* ------------------------------------------------------------ 文章目录 */
.toc{border:1px solid var(--line);background:var(--stone);padding:20px 24px;margin:24px 0 8px;}
.toc-title{font-family:var(--font-serif);font-size:15px;margin-bottom:10px;color:var(--brass);}
.toc ol{list-style:none;counter-reset:toc;font-size:14px;}
.toc li{border-bottom:1px dashed var(--line);padding:6px 0;}
.toc li:last-child{border-bottom:none;}
.toc li.toc-l3{padding-left:18px;font-size:13.5px;color:var(--ink-soft);}
.toc a:hover{color:var(--seal);}
/* ---------------------------------------------------------------- 表单 */
.field-error{color:var(--seal);font-size:12.5px;}
.field-hint{font-size:12.5px;color:var(--ink-soft);}
.form-msg{list-style:none;margin-bottom:18px;}
.form-msg li{border-left:3px solid var(--brass);background:var(--stone);padding:10px 14px;
font-size:14px;margin-bottom:8px;}
.form-msg li.error{border-left-color:var(--seal);}
form.f input:focus,form.f textarea:focus{outline:none;border-color:var(--brass);}
form.f button:disabled{opacity:.6;cursor:not-allowed;}
/* 下拉框：与输入框保持一致的边框、内距与配色，保留浏览器原生箭头 */
form.f select{font:inherit;font-size:inherit;line-height:1.5;padding:11px 12px;
border:1px solid var(--line);background:transparent;color:var(--tx);
width:100%;border-radius:0;cursor:pointer;}
form.f select:focus{outline:none;border-color:var(--brass);}
form.f select:invalid,form.f select option[value=""]{color:var(--ink-soft);}
form.f select option{color:var(--tx);}
/* -------------------------------------------------------- 详情页外壳微调 */
.doc .plaque{margin-bottom:0;}
.side img{width:100%;height:auto;}
.side .qr-box{margin-bottom:12px;}
/* ------------------------------------------------------ 案例列表（可展开）
有「案情与处理」的案例用 details/summary 做成点击展开，样式直接复用
site.css 中常见问题的折叠样式（下边框 + 右侧 ＋/－ 标记）。
没有填写案情的案例改用 .case-plain 输出普通一行：外观与折叠项对齐，
但不会出现「点了没反应」的空折叠项。
选择器用 .prose .case-plain 是为了压过 site.css 里 .prose p 的 max-width
与 margin-bottom。 */
.prose .case-plain{border-bottom:1px solid var(--line);padding:16px 0;margin:0;
color:var(--ink-soft);}
/* ------------------------------------------------------- 微信号：点击复制
微信不允许网页直接跳转到「添加好友」页面（没有可用的公开链接），
所以做成点击复制微信号，用户复制后到微信里粘贴搜索。
用 color:inherit 让它同时适配浅色正文区与深色咨询卡两处。 */
.copy-chip{display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:inherit;
line-height:1.5;border:1px solid var(--brass);background:transparent;color:inherit;
padding:2px 10px;border-radius:0;cursor:pointer;transition:background .15s ease;}
.copy-chip:hover{background:rgba(173,138,78,.14);}
.copy-chip span{font-size:11.5px;color:var(--brass);border-left:1px solid var(--brass);
padding-left:8px;}
.copy-chip:focus-visible{outline:2px solid var(--brass);outline-offset:2px;}
/* 复制结果提示（bottom 留出底部操作条的位置） */
.copy-toast{position:fixed;left:50%;bottom:84px;z-index:99;
transform:translateX(-50%) translateY(6px);
background:var(--ink);color:#fff;padding:10px 18px;font-size:14px;line-height:1.5;
box-shadow:0 6px 20px rgba(15,25,40,.22);
opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease;}
.copy-toast.on{opacity:1;transform:translateX(-50%) translateY(0);}
@media (prefers-reduced-motion:reduce){
.copy-toast{transition:none;}
}
/* ------------------------------------------- 站外账号（徽章 + 名称）
后台「站点信息 → 站外账号」里启用的条目才会出现，两处共用同一套标记：
· 页脚 .foot-social —— 深色底，用 --brass-light 保证对比度
· 联系我们的事务所信息表 .social-row —— 浅色底，用 --brass
徽章用平台名首字，不引外部图标字体（本项目禁止外部 CDN）。
排布用「固定宽度 + flex-wrap」，不用 grid 的 1fr：
fr 会让每一列去撑满可用宽度，于是名称越短，后面空出的地方越大 —— 看着像
间距过大，实际是列宽被撑开了；列数也因此偏少。宽度写死之后，gap 就是真实的
间距，且每一行的列都是同一个宽度，换行后左边缘自然对齐。
宽度按最长的一条名称定（内置平台名最长是「微信视频号」五个字）：
· 联系我们页 14px 字号 → 内容约 97px，取 104px；容器约 590px 时每行 4 个。
· 页脚 13px 字号 → 内容约 92px，取 96px；那一栏约 320px 时每行 3 个。
两个数一起决定列数，想更紧凑就调小 width 和 gap。将来有人填更长的自定义名称
（如「抖音 · 张律师」），会在原位换行，不会把版面撑破。 */
.foot-social .badge,
.social-row .badge{display:inline-flex;align-items:center;justify-content:center;
width:20px;height:20px;flex-shrink:0;font-size:11px;line-height:1;}
.foot-social{display:flex;flex-wrap:wrap;gap:10px 13px;margin-top:16px;}
.foot-social a{flex:0 0 96px;display:flex;align-items:center;gap:7px;font-size:13px;
overflow-wrap:anywhere;color:#B9C2CC;transition:color .15s ease;}
.foot-social a:hover{color:#fff;}
.foot-social .badge{color:var(--brass-light);border:1px solid rgba(173,138,78,.55);}
.foot-social a:focus-visible{outline:2px solid var(--brass);outline-offset:2px;}
.social-row{display:flex;flex-wrap:wrap;gap:12px 18px;margin:0;}
.social-row a{flex:0 0 104px;display:flex;align-items:center;gap:7px;font-size:14px;
overflow-wrap:anywhere;color:inherit;transition:color .15s ease;}
.social-row a:hover{color:var(--seal);}
.social-row .badge{color:var(--brass);border:1px solid var(--brass);}
.social-row a:focus-visible{outline:2px solid var(--brass);outline-offset:2px;}
/* ----------------------------------------------- 微信号弹窗（二维码大图）
为什么不做「点击直接加好友」：扫码后那个「添加到通讯录」页面是微信 App
内部渲染的，手机浏览器打不开，微信也没把它开放给外部链接。
所以点击后弹出二维码大图 —— 微信内长按识别、手机浏览器保存后相册选取、
电脑用手机扫一扫，各环境下的提示文案由 site.js 按 UA 替换。 */
.wx-modal{position:fixed;inset:0;z-index:80;display:flex;align-items:center;
justify-content:center;padding:20px;}
.wx-modal[hidden]{display:none;}
.wx-modal-mask{position:absolute;inset:0;background:rgba(15,25,40,.62);}
.wx-modal-box{position:relative;width:100%;max-width:340px;text-align:center;
background:var(--paper);border:1px solid var(--brass);
padding:30px 26px 22px;box-shadow:0 18px 48px rgba(15,25,40,.28);}
.wx-modal-title{font-family:var(--font-serif);font-size:17px;color:var(--ink);
margin-bottom:16px;padding:0 24px;}
.wx-modal-qr{display:block;width:240px;height:240px;max-width:100%;margin:0 auto 14px;
background:#fff;border:1px solid var(--line);object-fit:contain;}
.wx-modal-tip{font-size:13px;line-height:1.7;color:var(--ink-soft);margin-bottom:16px;}
.wx-modal-close{position:absolute;top:4px;right:8px;padding:6px;border:0;background:none;
font-size:24px;line-height:1;color:var(--ink-soft);cursor:pointer;}
.wx-modal-close:hover{color:var(--seal);}
@media (max-width:480px){
.wx-modal-box{padding:26px 18px 18px;}
.wx-modal-qr{width:200px;height:200px;}
.wx-modal-tip{font-size:12.5px;}
}
/* ------------------------------------------------------------ 图片自适应 */
.prose img{max-width:100%;height:auto;margin:14px 0;}
.prose table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14px;}
.prose th,.prose td{border:1px solid var(--line);padding:8px 10px;text-align:left;}
.prose th{background:var(--stone);font-family:var(--font-serif);}
.prose blockquote{border-left:3px solid var(--brass);padding:4px 16px;color:var(--ink-soft);
margin:14px 0;background:var(--stone);}
.prose code{background:var(--stone);padding:1px 5px;font-size:13px;}
/* --------------------------------------------------------- 减少动画偏好 */
@media (prefers-reduced-motion:reduce){
.lawyer-photo img,.kb-slide img{animation:none !important;transition:none !important;}
.lawyer:hover .lawyer-photo img{transform:none;}
}
@media (max-width:900px){
.search-form{margin-left:0;width:100%;}
.search-form input{flex:1;min-width:0;}
}
/* ------------------------------------------------ 标题层级修正（外观不变）
为让文档大纲正确，把几处「视觉上是标题、但参考稿写成 」的元素改成真正的
h2/h3：业务范围标签 p→h2、律师姓名与文章标题 p→h3、页脚栏目标题 h4→h3。
site.css 是按参考稿的
/
调好的，换成标题标签后会被全局规则
（h1,h2,h3{font-family:serif;font-weight:700;letter-spacing:.01em}）与浏览器
默认边距带出差异。下面把这些差异抹平，使可见外观与改动前完全一致。
注意：必须放在「响应式」区块之前 —— 那里约定其后的规则一律写在 @media 内。 */
.ledger-title{font-family:inherit;font-weight:400;letter-spacing:normal;margin:0 0 6px;}
.lawyer-name{font-weight:400;letter-spacing:normal;margin-top:0;}
.insight-title{font-weight:400;letter-spacing:normal;margin-top:0;}
/* 页脚栏目标题：复刻 site.css 中 footer h4 的取值（含 h4 默认的 1.33em 上边距） */
footer h3{font-family:inherit;font-weight:500;letter-spacing:normal;color:#fff;
font-size:14px;margin:1.33em 0 14px;}
/* ---------------------------------------------------------------- 全站搜索
导航里的放大镜入口 + /search/ 搜索页。沿用 site.css 的配色与直角风格。 */
.nav-search{display:flex;align-items:center;color:inherit;}
.nav-search svg{display:block;}
.nav-search:hover{color:var(--brass);}
/* 搜索框：图标在左、按钮在右，整体一个框；聚焦时整框高亮。
避免「输入框 + 外挂按钮」那种割裂感（原来是两个各自独立的控件）。 */
.site-search{display:flex;align-items:stretch;max-width:660px;border:1px solid var(--ink);
background:#fff;transition:border-color .15s ease,box-shadow .15s ease;}
.site-search:focus-within{border-color:var(--brass);box-shadow:0 0 0 3px rgba(173,138,78,.16);}
.site-search-ico{flex:0 0 auto;width:18px;height:18px;align-self:center;margin-left:16px;
color:var(--ink-soft);}
.site-search input{flex:1;min-width:0;border:0;background:transparent;font:inherit;
font-size:16px;padding:15px 14px;color:var(--ink);appearance:none;}
.site-search input:focus{outline:none;}
.site-search input::placeholder{color:var(--ink-soft);}
/* 去掉浏览器给 type=search 自带的清除按钮，保持整洁 */
.site-search input::-webkit-search-cancel-button,
.site-search input::-webkit-search-decoration{-webkit-appearance:none;appearance:none;}
.site-search button{flex:0 0 auto;border:0;background:var(--ink);color:var(--on-ink);
font:inherit;font-size:15px;padding:0 28px;cursor:pointer;transition:background .15s ease;}
.site-search button:hover{background:var(--seal);}
.search-count{margin-top:24px;font-size:15px;color:var(--ink-soft);}
/* 搜索框下面的「热门搜索」：复用洞察页的 .chip 胶囊样式 */
.hot-searches{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:16px;}
.hot-label{font-size:13.5px;color:var(--ink-soft);}
/* 关键词后面的搜索次数：小一号、淡一档，不抢关键词本身 */
.chip-count{font-size:12px;opacity:.62;}
/* 页脚公安备案：号码前面带警徽图标（官方要求「图标 + 备案号」一起展示） */
/* inline-flex 盒的基线取自第一个子项（即图片），而图片的基线是它的底边 —— 不加处理时
整组会比前面的 ICP 备案号高约 5px，看起来没对齐。给盒子本身加 vertical-align:middle，
让组内文字与相邻文字在同一基线上（实测底边差 0.69px）。
不要改用 display:inline：那样会改变 span 的自动最小尺寸，窄屏下整组会被挤到第二行。 */
.beian{display:inline-flex;align-items:center;gap:5px;vertical-align:middle;}
.beian-icon{width:16px;height:18px;flex-shrink:0;}
.search-group{margin-top:34px;}
.search-group h2{font-size:19px;margin-bottom:10px;}
/* 整条结果可点：容器设 relative，让 .stretch 的 ::after 铺满整行 */
.search-hit{position:relative;padding:15px 0;border-bottom:1px solid var(--line);
transition:background .15s ease;}
.search-hit:hover{background:var(--stone);}
.search-hit a{font-family:var(--font-serif);font-size:18px;}
.search-hit:hover a{color:var(--seal);}
.search-hit p{font-size:14px;color:var(--ink-soft);margin-top:6px;}
/* ===========================================================================
响应式 —— 移动端与平板适配
---------------------------------------------------------------------------
约定（重要）：site.css 是参考稿的逐字节复刻，**桌面端外观保持 1:1**。
因此本区块的每一条规则都写在 @media 内，只在窄屏生效；site.css 不做修改。
断点分三档：
900px 与参考稿一致：进入移动端布局（收起横向导航、单列、显示底部操作条）
600px 窄屏手机：收紧左右边距、标题字号与多列栅格
380px 小屏兜底，覆盖 320px 级别设备（iPhone SE 一代 / 老安卓）
背景：参考稿原本只有 900 / 520 两档，且只处理了首页与文章详情用到的组件。
业务列表的 .rows、洞察页的 .filter-bar、分页 .pager、正文表格 .prose table、
关于我们的 .about-figures、联系卡片 .plaque 等此前没有任何移动端规则，
是本区块主要的修复对象。
=========================================================================== */
/* ------------------------------------------- 触摸设备：点击目标不小于 44px
用 hover/pointer 判断而非宽度：触屏平板（最宽到 1024px）同样需要更大热区，
而带鼠标的桌面浏览器不受影响，符合「桌面端像素不变」的约束。 */
@media (hover:none) and (pointer:coarse){
.chip{padding:11px 16px;}
.pager a,.pager .disabled{padding:8px 4px;}
}
/* ------------------------------------------------------- 900px：移动端布局 */
@media (max-width:900px){
/* 避免移动浏览器在横竖屏切换时擅自放大字号 */
html{-webkit-text-size-adjust:100%;}
/* ---- 顶栏高度由**固定**改为**最小**。
参考稿写的是 height:76px，一旦里面的内容换行就会溢出并被裁掉
（上线后确实出现过：所名被压成多行，顶部半截字被切掉）。 ---- */
.nav-row{height:auto;min-height:72px;gap:14px;}
/* ---- 汉堡按钮：视觉尺寸不变，用透明边框把热区撑到 50×44。
必须改回 content-box —— 全局 *{box-sizing:border-box} 会把 24px 的边框
算进 width 里，内容区被压成 2px，三条线就挤没了。
margin-right:-12px 抵消右边框，使图标位置与参考稿完全一致。 ---- */
.burger{box-sizing:content-box;border:12px solid transparent;margin-right:-12px;}
.burger:focus-visible{outline-offset:-12px;}
/* ---- 移动端下拉菜单
由 site.js 切换 .open 类，不再写内联样式（内联样式会盖掉媒体查询、难维护）。
top:100% 的定位基准是 position:sticky 的 header，因此无需在 JS 里硬编码
头部高度，刘海屏（safe-area-inset-top）下也不会错位。 ---- */
.nav-links.open{
display:flex;flex-direction:column;gap:0;
position:absolute;top:100%;left:0;right:0;
padding:6px 28px 12px;
background:var(--paper);border-bottom:1px solid var(--line);
box-shadow:0 14px 28px rgba(15,25,40,.10);
max-height:70vh;overflow-y:auto;-webkit-overflow-scrolling:touch;
}
.nav-links.open a{padding:13px 0;border-bottom:1px solid var(--line);}
.nav-links.open a:last-child{border-bottom:none;}
.nav-links.open a.on{border-color:var(--brass);}
.nav-links.open a:hover{border-color:var(--line);}
/* ---- 竖向留白：桌面的 72 / 56px 对手机过高 ---- */
section.block{padding:44px 0;}
.hero{padding:34px 0 40px;}
.hero-grid{gap:30px;} /* 参考稿只改了列数，60px 间距在手机上过大 */
.ph{padding:26px 0 30px;}
.about-grid{padding-top:40px;padding-bottom:40px;}
.doc{padding-top:30px;padding-bottom:46px;}
footer{padding:44px 0 90px;}
.foot-grid{gap:26px;}
/* ---- 分页：参考稿未设 flex-wrap，手机上会被挤出屏幕 ---- */
.pager{flex-wrap:wrap;gap:10px 18px;padding-top:26px;}
/* ---- 正文表格：在本层横向滚动。
display:block 会让表格内部生成匿名表格盒，内容更宽时由本层滚动，
无需改动模板、也无需在正文 HTML 里插包裹元素。 ---- */
.prose table{display:block;width:100%;max-width:100%;overflow-x:auto;
-webkit-overflow-scrolling:touch;}
/* ---- 长网址 / 长英文串不撑破版面（参考稿未处理） ---- */
.prose,.ans,.side,.toc,.rows p{overflow-wrap:break-word;}
/* ---- 侧栏与卡片留白 ---- */
.side{padding:20px;}
.ans{padding:18px 20px;}
.toc{padding:18px 20px;}
/* ---- 业务列表的三列栅格在窄屏收紧 ---- */
.rows a{grid-template-columns:28px 1fr auto;gap:10px;padding:18px 2px;}
/* ---- 洞察条目 ---- */
.insight-item{padding:20px 0;}
/* ---- 律师卡片：两列布局下右列不应有竖线。
site.css 的 nth-child(4n) 是按四列写的，两列时会在第 4、8… 项
留下一条多余的右边框。 ---- */
.lawyer:nth-child(2n){border-right:none;}
/* ---- iOS 聚焦缩放：输入控件字号小于 16px 时 Safari 会自动放大整个页面 ---- */
.search-form input{font-size:16px;}
form.f input:not([type=checkbox]),form.f textarea,form.f select{font-size:16px;}
/* ---- 表单说明与错误提示文字略微放大 ---- */
.field-hint,.field-error{font-size:13px;}
}
/* ------------------------------------------------------- 600px：窄屏手机 */
@media (max-width:600px){
/* 左右边距 28px 在 375px 屏上占到 15%。
这里**只用长写属性改左右**、不动上下 —— .doc / .ph / 带内联样式的 .wrap
各自有自己的竖向留白，用 padding 简写会一并覆盖掉。 */
.wrap:not(.doc){padding-left:18px;padding-right:18px;}
.wrap.doc{padding:26px 18px 44px;}
/* ---- 顶部品牌区
关键修复：此前所名会被压成每行 1~4 个字。原因是 .brand 作为 flex 子项
默认可收缩（flex-shrink:1），空间不够时被压到 min-content —— 中文的
min-content 就是「一个汉字」，于是逐字折行。这里禁止收缩并禁止折行。 ---- */
.brand{flex-shrink:0;gap:10px;min-width:0;}
.brand-logo{height:36px;}
.brand-name{font-size:16px;line-height:1.3;white-space:nowrap;}
.brand-name small{font-size:9.5px;letter-spacing:.04em;white-space:nowrap;}
.phone-pill{padding:7px 12px;font-size:13px;}
.phone-pill b{font-size:15px;}
/* ---- 天际线横幅与标语 ---- */
.skyline-banner{height:170px;}
.sb-caption{font-size:12.5px;letter-spacing:.26em;text-indent:.26em;}
/* ---- 轮播 ---- */
.gallery{height:230px;}
.kb-cap{left:18px;bottom:16px;font-size:15px;}
/* ---- 标题与正文 ---- */
.hero h1{font-size:27px;}
.hero-lede{font-size:16px;margin-bottom:28px;}
.block-head{margin-bottom:26px;}
.block-head h2{font-size:23px;}
.about-quote{font-size:20px;padding-left:22px;}
.about-quote::before{font-size:46px;top:-8px;}
.about-figures div{padding:20px 16px;}
.about-figures b{font-size:24px;}
/* ---- 联系卡片 ---- */
.plaque{padding:26px 20px;}
.plaque-phone{font-size:26px;}
/* ---- 详情页 ---- */
.ph h1{font-size:24px;}
.prose h2{font-size:20px;margin:28px 0 10px;}
.toc li{padding:9px 0;}
/* ---- 业务列表 ---- */
.rows a{grid-template-columns:22px 1fr auto;gap:9px;}
.rows h3{font-size:17px;}
.rows p{font-size:14px;}
.pager{font-size:13.5px;}
/* ---- 洞察页筛选栏 ---- */
.filter-bar{gap:8px;margin-bottom:22px;}
/* ---- 底部操作条 ---- */
.mobile-bar a{padding:15px 0;font-size:15px;}
}
/* ------------------------------------------------- 480px：让位给事务所名称
头部同时塞下「logo + 所名（9 个字）+ 电话号码胶囊 + 汉堡按钮」在 400px 上
会超出约 20px，挤压的直接后果就是上面那个所名折行的问题。
这里撤掉头部重复的电话号码：底部固定操作条已有一整条「☎ 电话咨询」，
同样是 tel: 链接，一通点击即拨，不损失任何功能。 */
@media (max-width:480px){
.phone-pill{display:none;}
.nav-row{gap:10px;}
}
/* ----------------------------------------------- 380px：小屏兜底（320px 级）*/
@media (max-width:380px){
.wrap:not(.doc){padding-left:14px;padding-right:14px;}
.wrap.doc{padding:22px 14px 40px;}
.skyline-banner{height:148px;}
.sb-caption{font-size:11.5px;letter-spacing:.16em;text-indent:.16em;}
.gallery{height:200px;}
.hero h1{font-size:23px;}
.hero-lede{font-size:15px;}
.ph h1{font-size:22px;}
.block-head h2{font-size:21px;}
.ledger-name{font-size:14.5px;}
.lawyer{padding:18px 14px 18px 0;}
.lawyer-name{font-size:15.5px;}
/* 数字块：320px 上并排两列每格只剩约 130px，改单列更易读 */
.about-figures{grid-template-columns:1fr;}
.about-figures div{border-right:none;}
/* 联系信息表：dt/dd 由左右两列改为上下堆叠 */
dl.pf{grid-template-columns:1fr;gap:0;}
dl.pf dd{margin-bottom:10px;}
.plaque{padding:22px 16px;}
.plaque-phone{font-size:23px;}
.qr-box{width:64px;height:64px;}
}