/* 资讯模块样式 —— 极简克制：中性灰底 + 单一蓝色强调 #1880FF，大量留白 */
.mq-container { width: 100%; max-width: 1188px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; }
/* 面包屑导航
原主题结构：
现统一改为：，Yoast 内部是 inline 。
下面同时覆盖两套结构。原主题 ol/li 块保留作历史兼容；Yoast 子结构（breadcrumb_last、内层 span）单独处理。 */
.mq-breadcrumb { font-size: 14px; color: #475569; margin: 0 0 48px; line-height: 1.6; font-weight: 400; }
.mq-breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; }
.mq-breadcrumb li { display: inline-flex; align-items: center; gap: 8px; }
.mq-breadcrumb a { color: #475569; text-decoration: none; }
.mq-breadcrumb a:hover { color: #475569; }
.mq-breadcrumb li:last-child span { color: #475569; }
/* Yoast 内部：「首页」 / 「资讯」
文本节点「/」继承 .mq-breadcrumb 的 color，无需单独处理。 */
.mq-breadcrumb .breadcrumb_last { color: #475569; }
.mq-breadcrumb > span { font-size: 14px; line-height: 1.6; }
/* 浅色留白 Hero（去除渐变与装饰图） */
.mq-news-hero { background: #FAFBFC; border-bottom: 1px solid #EEF2F7; }
.mq-news-hero__inner { max-width: 1188px; margin: 0 auto; padding: 100px 24px 76px; }
.mq-title { color: #0F172A; font-size: 42px; font-weight: 700; letter-spacing: -1px; line-height: 1.2; margin: 0; }
.mq-subtitle { color: #6B7280; font-size: 17px; margin: 16px 0 0; }
.mq-section { padding: 88px 0 112px; }
/* 列表头部 */
.mq-list-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 44px; padding-bottom: 20px; border-bottom: 1px solid #EEF2F7; }
.mq-list-head__main { display: flex; flex-direction: column; gap: 8px; }
.mq-list-title { font-size: 24px; font-weight: 600; color: #0F172A; margin: 0; letter-spacing: -.3px; }
.mq-list-sub { font-size: 14px; color: #9CA3AF; margin: 0; }
.mq-list-count { flex: none; font-size: 14px; color: #9CA3AF; background: #F1F5F9; padding: 6px 14px; border-radius: 999px; }
/* 空状态 */
.mq-empty { padding: 80px 0; text-align: center; color: #9CA3AF; font-size: 15px; }
/* 卡片网格：充足留白、整齐对齐 */
.mq-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 32px; }
@media (max-width: 1024px) { .mq-grid { grid-template-columns: repeat(2, 1fr); gap: 36px 28px; } }
@media (max-width: 640px) { .mq-grid { grid-template-columns: 1fr; gap: 32px; } }
/* 卡片：白底、发丝边框、克制阴影，仅靠 hover 轻微提示 */
.mq-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #EEF2F7; border-radius: 16px; overflow: hidden; text-decoration: none; color: inherit; transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.mq-card:hover { transform: translateY(-4px); box-shadow: 0 14px 36px rgba(15,23,42,.08); border-color: #E2E8F0; }
.mq-card__media { height: 196px; overflow: hidden; background: #F1F5F9 url(../images/mq-placeholder.svg) center / 120px 120px no-repeat; }
.mq-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.mq-card:hover .mq-card__media img { transform: scale(1.05); }
.mq-card__body { padding: 28px; display: flex; flex-direction: column; flex: 1; }
/* 元信息：单一蓝色标签 + 中性日期 */
.mq-card__meta { display: flex; align-items: center; gap: 12px; font-size: 13px; color: #9CA3AF; margin-bottom: 16px; }
.mq-tag { background: #EFF4FF; color: #1880FF; padding: 4px 12px; border-radius: 999px; font-weight: 500; font-size: 12px; }
.mq-card__title { font-size: 19px; font-weight: 600; line-height: 1.5; color: #0F172A; margin: 0 0 12px; transition: color .3s ease; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mq-card:hover .mq-card__title { color: #1880FF; }
.mq-card__excerpt { font-size: 14.5px; line-height: 1.75; color: #6B7280; margin: 0 0 20px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* 阅读更多：克制的蓝色文字 + 箭头位移 */
.mq-card__more { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; color: #1880FF; font-size: 14px; font-weight: 500; }
.mq-card__more .arrow { transition: transform .3s ease; }
.mq-card:hover .mq-card__more .arrow { transform: translateX(4px); }
/* 分页：桌面端完整页码 + 移动端紧凑上下页 */
.mq-pagination { display: flex; justify-content: center; margin-top: 64px; }
.mq-pagination__desktop ul.page-numbers { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; }
.mq-pagination__desktop li { margin: 0; }
.mq-pagination__desktop a.page-numbers,
.mq-pagination__desktop span.page-numbers {
min-width: 42px; height: 42px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center;
border: 1px solid #E2E8F0; border-radius: 10px; background: #fff; color: #475569; font-size: 14px;
text-decoration: none; transition: border-color .2s ease, color .2s ease, background .2s ease;
}
.mq-pagination__desktop a.page-numbers:hover { border-color: #1880FF; color: #1880FF; }
.mq-pagination__desktop span.page-numbers.current { background: #1880FF; border-color: #1880FF; color: #fff; font-weight: 600; }
.mq-pagination__desktop a.prev, .mq-pagination__desktop a.next { gap: 6px; }
.mq-pagination__desktop .mq-page__label { font-size: 14px; }
.mq-pagination__compact { display: none; align-items: center; justify-content: space-between; gap: 12px; width: 100%; }
.mq-pagination__compact .mq-page { display: inline-flex; align-items: center; gap: 6px; height: 42px; padding: 0 20px; border: 1px solid #E2E8F0; border-radius: 10px; background: #fff; color: #475569; font-size: 14px; text-decoration: none; }
.mq-pagination__compact .mq-page.is-disabled { color: #CBD5E1; border-color: #F1F5F9; background: #F8FAFC; }
.mq-pagination__compact .mq-page--status { border: none; background: transparent; color: #64748B; padding: 0; }
/* 响应式：收敛间距与字号 */
@media (max-width: 768px) {
.mq-news-hero__inner { padding: 72px 20px 52px; }
.mq-title { font-size: 32px; }
.mq-subtitle { font-size: 15px; }
.mq-section { padding: 56px 0 80px; }
.mq-list-head { margin-bottom: 36px; }
}
/* 移动端：隐藏桌面完整页码，启用紧凑上下页；列表头部堆叠 */
@media (max-width: 640px) {
.mq-pagination { margin-top: 44px; }
.mq-pagination__desktop { display: none; }
.mq-pagination__compact { display: flex; }
.mq-list-head { flex-direction: column; align-items: flex-start; gap: 12px; }
.mq-list-count { align-self: flex-start; }
}
/* 详情页 */
.mq-article { max-width: 760px; margin: 0 auto; padding: 140px 24px 96px; box-sizing: border-box; }
.mq-back { display: inline-flex; align-items: center; gap: 6px; color: #1880FF; text-decoration: none; margin-bottom: 24px; font-size: 14px; }
.mq-article__meta { display: flex; align-items: center; gap: 12px; color: #9CA3AF; font-size: 14px; margin-bottom: 16px; }
.mq-article__title { font-size: 36px; font-weight: 700; color: #0F172A; line-height: 1.3; margin: 0 0 24px; letter-spacing: -.5px; }
.mq-article__cover { width: 100%; min-height: 320px; border-radius: 16px; overflow: hidden; margin-bottom: 32px; background: #F1F5F9 url(../images/mq-placeholder.svg) center / 200px 200px no-repeat; }
.mq-article__cover img { width: 100%; height: auto; display: block; }
.mq-article__content { font-size: 16px; line-height: 30px; color: #374151; }
.mq-article__content p { margin: 0 0 20px; }
.mq-article__content h2, .mq-article__content h3 { color: #0F172A; margin: 28px 0 12px; }
.mq-block-title { font-size: 28px; font-weight: 600; color: #0F172A; margin: 0 0 28px; }
/* 页脚 */
.mq-footer { width: 100%; }
.mq-footer__cta { background: #0F172A; }
.mq-footer__cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 56px 24px; flex-wrap: wrap; }
.mq-footer__cta-inner h2 { color: #fff; font-size: 28px; font-weight: 600; margin: 0; }
.mq-btn-primary { display: inline-flex; align-items: center; justify-content: center; height: 46px; padding: 0 28px; border-radius: 999px; background: #1880FF; color: #fff; font-size: 16px; font-weight: 500; text-decoration: none; transition: opacity .2s ease; }
.mq-btn-primary:hover { opacity: .85; }
.mq-footer__main { background: #0F172A; color: #c7d2e8; }
.mq-footer__cols { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: 32px; padding: 64px 24px; }
@media (max-width: 900px) { .mq-footer__cols { grid-template-columns: 1fr 1fr; } }
.mq-footer__brand img { height: 40px; margin-bottom: 16px; }
.mq-footer__brand p { font-size: 14px; line-height: 24px; color: #9fb0d0; max-width: 280px; }
.mq-footer__col h4 { color: #fff; font-size: 16px; margin: 0 0 16px; font-weight: 600; }
.mq-footer__col button { display: block; color: #9fb0d0; font-size: 14px; text-decoration: none; margin-bottom: 10px; transition: color .2s ease; background: none; border: 0; padding: 0; cursor: pointer; text-align: left; font-family: inherit; }
.mq-footer__col button:hover { color: #fff; }
.mq-footer__bottom { border-top: 1px solid rgba(255,255,255,.08); padding: 20px 24px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13px; color: #7e8db0; }
/* ============================================================
* 「免费试用」悬停下拉菜单
* - 默认隐藏；hover 触发（含 hover 桥接防止闪烁）
* - JS 增 .is-open 用于移动端点击切换
* - 每个平台项：白底圆角胶囊，hover 蓝色高亮
* - 未配置 URL 的项：灰态禁用，光标 not-allowed
* ============================================================ */
/* 外层 wrapper：创建独立 stacking context，确保菜单不会被下方 DOM 顺序靠后、含 position/overflow 的元素覆盖 */
.mq-trial-wrap {
position: relative;
isolation: isolate;
z-index: 60;
}
.mq-trial { position: relative; display: inline-block; }
.mq-trial__menu {
position: absolute;
top: 0;
left: calc(100% + 12px);
transform: translate(-6px, 0);
min-width: 220px;
padding: 8px;
background: #ffffff;
border: 1px solid rgba(8, 18, 51, 0.08);
border-radius: 16px;
box-shadow: 0 12px 40px rgba(8, 18, 51, 0.12), 0 2px 6px rgba(8, 18, 51, 0.04);
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
z-index: 50;
}
/* hover 桥接：从触发器移动到菜单的安全区（避免中间缝隙丢失 hover）
—— 水平桥接 12px，覆盖 trigger 右边缘 → menu 左边缘的间隙 */
.mq-trial__menu::before {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: -12px;
width: 12px;
}
.mq-trial.is-open .mq-trial__menu,
.mq-trial:hover .mq-trial__menu {
opacity: 1;
visibility: visible;
transform: translate(0, 0);
pointer-events: auto;
transition: opacity .18s ease, transform .18s ease, visibility 0s linear 0s;
}
.mq-trial__item {
display: flex;
align-items: center;
gap: 12px;
width: 100%;
padding: 10px 16px;
background: transparent;
border: 0;
border-radius: 10px;
color: #040F42;
font-size: 15px;
font-weight: 500;
font-family: inherit;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
transition: background-color .15s ease, color .15s ease;
}
.mq-trial__item + .mq-trial__item { margin-top: 2px; }
.mq-trial__item:hover {
background: #f0f7ff;
color: #1880FF;
}
.mq-trial__item.is-disabled {
cursor: not-allowed;
opacity: 0.45;
color: #6b7280;
}
.mq-trial__item.is-disabled:hover {
background: transparent;
color: #6b7280;
}
.mq-trial__item svg {
width: 18px;
height: 18px;
flex-shrink: 0;
color: #1880FF;
transition: color .15s ease;
}
.mq-trial__item:hover svg { color: #1880FF; }
.mq-trial__item.is-disabled svg { color: #9ca3af; }
/* 移动端（无 hover）下，点击 trigger 切换菜单
—— 侧向展开模式下，transform 改为水平位移 */
@media (hover: none) {
.mq-trial__menu::before { display: none; }
.mq-trial:hover .mq-trial__menu { opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-6px, 0); }
.mq-trial.is-open .mq-trial__menu { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(0, 0); }
}
/* 数字滚动动画：等宽数字防宽度抖动 */
.mq-counter {
display: inline-block;
font-variant-numeric: tabular-nums;
will-change: contents;
}
/* ============================================================
* 列表页 v2：工具栏 / 视图切换 / 骨架屏 / 状态展示 / 涟漪
* - 工具栏：分类 Tab + 排序下拉 + 网格/列表切换
* - 视图切换：grid 3列瀑布流 / list 横向单列（移动端自动单列卡片流）
* - 骨架屏：DOM ready 后渐隐替换实数据，避免 CLS
* - 涟漪：绝对定位圆形 div，scale + opacity 动画
* ============================================================ */
/* ----- 工具栏 ----- */
.mq-toolbar {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
margin-bottom: 36px;
padding: 14px 20px;
background: #FAFBFC;
border: 1px solid #EEF2F7;
border-radius: 14px;
}
.mq-toolbar__left { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.mq-toolbar__left::-webkit-scrollbar { display: none; }
.mq-toolbar__right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
/* ----- 分类 Tab ----- */
.mq-tabs { list-style: none; display: inline-flex; align-items: center; gap: 4px; margin: 0; padding: 0; }
.mq-tab {
display: inline-flex;
align-items: center;
height: 34px;
padding: 0 16px;
border-radius: 999px;
color: #475569;
font-size: 14px;
font-weight: 500;
text-decoration: none;
white-space: nowrap;
transition: background-color .2s ease, color .2s ease;
}
.mq-tab:hover { background: #F1F5F9; color: #0F172A; }
.mq-tab.is-active { background: #1880FF; color: #fff; }
.mq-tab.is-active:hover { background: #0E6FE5; color: #fff; }
/* ----- 排序下拉 ----- */
.mq-sort { position: relative; }
.mq-sort__trigger {
display: inline-flex; align-items: center; gap: 8px;
height: 38px; padding: 0 14px;
background: #fff; border: 1px solid #E2E8F0; border-radius: 10px;
color: #475569; font-size: 14px; font-weight: 500;
cursor: pointer; font-family: inherit;
transition: border-color .2s ease, color .2s ease, background-color .2s ease;
}
.mq-sort__trigger:hover { border-color: #1880FF; color: #1880FF; }
.mq-sort__trigger:hover .mq-sort__caret { color: #1880FF; }
.mq-sort__trigger[aria-expanded="true"] { border-color: #1880FF; color: #1880FF; box-shadow: 0 0 0 3px rgba(24,128,255,.08); }
.mq-sort__trigger[aria-expanded="true"] .mq-sort__caret { transform: rotate(180deg); color: #1880FF; }
.mq-sort__caret { color: #94A3B8; transition: transform .2s ease, color .2s ease; }
.mq-sort__menu {
position: absolute; top: calc(100% + 8px); right: 0; z-index: 40;
min-width: 160px; padding: 6px; margin: 0; list-style: none;
background: #fff; border: 1px solid rgba(8,18,51,.08); border-radius: 12px;
box-shadow: 0 12px 36px rgba(8,18,51,.12), 0 2px 6px rgba(8,18,51,.04);
opacity: 0; visibility: hidden; transform: translateY(-6px);
transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
}
.mq-sort.is-open .mq-sort__menu { opacity: 1; visibility: visible; transform: translateY(0); transition: opacity .18s ease, transform .18s ease, visibility 0s linear 0s; }
.mq-sort__item {
display: block; width: 100%; padding: 9px 14px; border: 0; background: transparent;
border-radius: 8px; color: #475569; font-size: 14px; font-family: inherit; text-align: left;
cursor: pointer; transition: background-color .15s ease, color .15s ease;
}
.mq-sort__item:hover { background: #F0F7FF; color: #1880FF; }
.mq-sort__item.is-active { background: #EFF4FF; color: #1880FF; font-weight: 600; }
/* ----- 网格 / 列表 视图切换 ----- */
.mq-view-switch {
display: inline-flex; align-items: center;
background: #fff; border: 1px solid #E2E8F0; border-radius: 10px;
padding: 3px; gap: 2px;
}
.mq-view-switch__btn {
width: 34px; height: 32px; display: inline-flex; align-items: center; justify-content: center;
border: 0; background: transparent; border-radius: 7px; color: #94A3B8;
cursor: pointer; transition: background-color .2s ease, color .2s ease;
}
.mq-view-switch__btn:hover { color: #475569; }
.mq-view-switch__btn.is-active { background: #1880FF; color: #fff; }
/* ----- 列表容器：grid 视图（默认）----- */
.mq-list-wrap { position: relative; min-height: 240px; }
.mq-list { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin: 0; padding: 0; }
.mq-list-wrap[data-view="grid"] .mq-list { grid-template-columns: repeat(3, 1fr); gap: 32px; }
/* ----- 列表视图：横向单条 ----- */
.mq-list-wrap[data-view="list"] .mq-list {
grid-template-columns: 1fr; gap: 20px;
}
.mq-list-wrap[data-view="list"] .mq-card { flex-direction: row; }
.mq-list-wrap[data-view="list"] .mq-card__media { width: 320px; height: 200px; flex-shrink: 0; }
.mq-list-wrap[data-view="list"] .mq-card__body { flex: 1; padding: 28px 32px; }
.mq-list-wrap[data-view="list"] .mq-card__title { font-size: 20px; -webkit-line-clamp: 1; }
.mq-list-wrap[data-view="list"] .mq-card__excerpt { -webkit-line-clamp: 2; }
/* ----- 列表项过渡 ----- */
.mq-list__item { opacity: 0; transform: translateY(10px); animation: mqFadeUp .4s ease forwards; }
.mq-list__item:nth-child(1) { animation-delay: .04s; }
.mq-list__item:nth-child(2) { animation-delay: .08s; }
.mq-list__item:nth-child(3) { animation-delay: .12s; }
.mq-list__item:nth-child(4) { animation-delay: .16s; }
.mq-list__item:nth-child(5) { animation-delay: .20s; }
.mq-list__item:nth-child(6) { animation-delay: .24s; }
.mq-list__item:nth-child(n+7) { animation-delay: .28s; }
@keyframes mqFadeUp { to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .mq-list__item { animation: none; opacity: 1; transform: none; } }
/* ----- 卡片 v2：更精细的层次 ----- */
.mq-card { position: relative; }
.mq-card__ph {
width: 100%;
height: 100%;
object-fit: contain;
display: block;
background: #F1F5F9;
}
.mq-card__badge {
position: absolute; top: 14px; left: 14px;
background: rgba(15,23,42,.78); color: #fff;
font-size: 12px; font-weight: 500; padding: 4px 10px; border-radius: 999px;
backdrop-filter: blur(4px);
opacity: 0; transform: translateY(-4px); transition: opacity .3s ease, transform .3s ease;
}
.mq-card:hover .mq-card__badge { opacity: 1; transform: translateY(0); }
.mq-card__meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mq-card__meta-item { display: inline-flex; align-items: center; gap: 5px; color: #94A3B8; font-size: 13px; }
.mq-card__meta-item svg { color: #CBD5E1; flex-shrink: 0; }
.mq-card__meta-sep { color: #CBD5E1; font-size: 13px; }
.mq-card__footer { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 16px; border-top: 1px dashed #EEF2F7; }
.mq-card__more { display: inline-flex; align-items: center; gap: 6px; color: #1880FF; font-size: 14px; font-weight: 500; }
.mq-card__arrow { transition: transform .3s ease; }
.mq-card:hover .mq-card__arrow { transform: translateX(4px); }
.mq-card__cta {
background: #F1F5F9; color: #475569; font-size: 12px; font-weight: 500;
padding: 6px 12px; border-radius: 999px; transition: background-color .2s ease, color .2s ease;
}
.mq-card:hover .mq-card__cta { background: #1880FF; color: #fff; }
/* ----- 点击涟漪 ----- */
.mq-card--ripple { overflow: hidden; }
.mq-ripple {
position: absolute; border-radius: 50%;
background: rgba(24,128,255,.18);
transform: scale(0); opacity: 1; pointer-events: none;
animation: mqRipple .6s ease-out forwards;
}
@keyframes mqRipple { to { transform: scale(4); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .mq-ripple { animation: none; display: none; } }
/* ----- 骨架屏 ----- */
.mq-skeleton-grid {
display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px;
margin-bottom: 32px;
transition: opacity .35s ease, transform .35s ease;
}
.mq-skeleton-grid.is-hide { opacity: 0; transform: translateY(-6px); pointer-events: none; }
.mq-skeleton-card {
background: #fff; border: 1px solid #EEF2F7; border-radius: 16px;
padding: 0; overflow: hidden;
}
.mq-skeleton {
background: linear-gradient(90deg, #F1F5F9 0%, #E2E8F0 50%, #F1F5F9 100%);
background-size: 200% 100%;
animation: mqShimmer 1.4s linear infinite;
border-radius: 6px;
}
@keyframes mqShimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.mq-skeleton--media { height: 196px; border-radius: 0; }
.mq-skeleton--line { height: 14px; margin: 14px 24px; }
.mq-skeleton--meta { width: 35%; height: 12px; margin: 18px 24px 8px; }
.mq-skeleton--title { width: 80%; height: 18px; }
.mq-skeleton--excerpt { width: 100%; }
.mq-skeleton--more { width: 30%; height: 12px; margin-bottom: 22px; }
@media (prefers-reduced-motion: reduce) { .mq-skeleton { animation: none; background: #F1F5F9; } }
/* ----- 列表头部微调 ----- */
.mq-list-head { margin-bottom: 32px; }
.mq-list-count strong { color: #1880FF; font-weight: 600; margin: 0 2px; }
/* ----- 状态展示：空/错误 ----- */
.mq-state {
display: flex; flex-direction: column; align-items: center; justify-content: center;
padding: 80px 24px; text-align: center;
background: #FAFBFC; border: 1px dashed #E2E8F0; border-radius: 16px;
}
.mq-state__icon { color: #CBD5E1; margin-bottom: 20px; }
.mq-state__title { font-size: 20px; font-weight: 600; color: #0F172A; margin: 0 0 10px; }
.mq-state__desc { font-size: 14.5px; line-height: 1.7; color: #6B7280; max-width: 420px; margin: 0 0 24px; }
.mq-state__action {
display: inline-flex; align-items: center; gap: 8px;
height: 42px; padding: 0 22px; border-radius: 999px;
background: #1880FF; color: #fff; font-size: 14px; font-weight: 500;
text-decoration: none; transition: background-color .2s ease, transform .2s ease;
}
.mq-state__action:hover { background: #0E6FE5; transform: translateY(-1px); }
/* ----- 搜索结果页专属：hero 关键词高亮 / 工具栏关键词 / 空状态搜索 ----- */
.mq-search-hero__q {
color: #1880FF;
font-weight: 600;
word-break: break-word;
background: #E6F1FF;
padding: 1px 8px;
border-radius: 6px;
margin: 0 4px;
}
.mq-search-keyword {
font-size: 14px;
color: #475569;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
}
.mq-search-keyword strong {
color: #1880FF;
font-weight: 600;
background: #E6F1FF;
padding: 1px 6px;
border-radius: 4px;
margin-left: 2px;
}
.mq-state__search {
display: flex;
gap: 10px;
width: 100%;
max-width: 420px;
margin: 0 0 20px;
}
.mq-state__search-input {
flex: 1 1 auto;
min-width: 0;
height: 44px;
padding: 0 18px;
border: 1px solid #E2E8F0;
border-radius: 999px;
font-size: 15px;
color: #0F172A;
background: #fff;
outline: none;
transition: border-color .2s ease, box-shadow .2s ease;
}
.mq-state__search-input:focus {
border-color: #1880FF;
box-shadow: 0 0 0 3px rgba(24, 128, 255, .15);
}
.mq-state__search-submit {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
gap: 6px;
height: 44px;
padding: 0 22px;
border: 0;
border-radius: 999px;
background: #1880FF;
color: #fff;
font-size: 14px;
font-weight: 500;
cursor: pointer;
transition: background-color .2s ease, transform .2s ease;
}
.mq-state__search-submit:hover { background: #0E6FE5; transform: translateY(-1px); }
@media (max-width: 480px) {
.mq-state__search { flex-direction: column; }
.mq-state__search-submit { width: 100%; justify-content: center; }
}
/* ----- 响应式 ----- */
@media (max-width: 1024px) {
.mq-list, .mq-list-wrap[data-view="grid"] .mq-list { grid-template-columns: repeat(2, 1fr); gap: 24px; }
.mq-skeleton-grid { grid-template-columns: repeat(2, 1fr); }
.mq-list-wrap[data-view="list"] .mq-card { flex-direction: column; }
.mq-list-wrap[data-view="list"] .mq-card__media { width: 100%; height: 196px; }
}
@media (max-width: 640px) {
.mq-toolbar { flex-direction: column; align-items: stretch; padding: 12px 14px; gap: 10px; }
.mq-toolbar__left { overflow-x: auto; }
.mq-toolbar__right { justify-content: space-between; }
.mq-list, .mq-list-wrap[data-view="grid"] .mq-list, .mq-skeleton-grid { grid-template-columns: 1fr; gap: 20px; }
.mq-list-wrap[data-view="list"] .mq-card { flex-direction: column; }
.mq-list-wrap[data-view="list"] .mq-card__media { width: 100%; height: 196px; }
.mq-list-wrap[data-view="list"] .mq-card__body { padding: 22px; }
.mq-card__badge { opacity: 1; transform: none; }
.mq-state { padding: 60px 20px; }
.mq-state__title { font-size: 18px; }
.mq-card__cta { display: none; }
}
/* ============================================================
* 详情页：两栏布局（左正文 + 右 sticky 侧边栏）
* ============================================================ */
.mq-article { max-width: 1188px; margin: 0 auto; padding: 140px 24px 96px; box-sizing: border-box; }
.mq-single__layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; align-items: start; }
.mq-single__main { min-width: 0; }
.mq-single__sidebar { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 28px; }
/* 正文上下文自动内链（由 the_content 过滤器注入 ） */
.mq-article__content a.mq-ilink {
color: #1880FF;
text-decoration: none;
border-bottom: 1px dashed #93C5FD;
transition: border-color .2s ease, color .2s ease;
}
.mq-article__content a.mq-ilink:hover { color: #0E6FE5; border-bottom-color: #1880FF; }
/* 本文标签 */
.mq-tags { display: flex; align-items: flex-start; gap: 12px; margin-top: 36px; padding-top: 24px; border-top: 1px solid #EEF2F7; }
.mq-tags__label { flex: none; font-size: 13px; color: #9CA3AF; padding-top: 6px; }
.mq-tags__list { display: flex; flex-wrap: wrap; gap: 8px; }
/* ============================================================
* 通用侧边栏挂件（详情页 / 栏目页共用）
* ============================================================ */
.mq-widget { background: #fff; border: 1px solid #EEF2F7; border-radius: 16px; padding: 22px 22px 24px; }
.mq-widget__title { position: relative; font-size: 16px; font-weight: 600; color: #0F172A; margin: 0 0 18px; padding-left: 12px; }
.mq-widget__title::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 16px; border-radius: 2px; background: #1880FF; }
/* 热门排行（编号高亮前 3） */
.mq-rank { list-style: none; margin: 0; padding: 0; }
.mq-rank__item { display: flex; align-items: flex-start; gap: 12px; padding: 11px 0; border-bottom: 1px dashed #EEF2F7; }
.mq-rank__item:last-child { border-bottom: 0; padding-bottom: 0; }
.mq-rank__no { flex: none; width: 22px; height: 22px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; background: #F1F5F9; color: #64748B; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.mq-rank__item:nth-child(1) .mq-rank__no,
.mq-rank__item:nth-child(2) .mq-rank__no,
.mq-rank__item:nth-child(3) .mq-rank__no { background: #1880FF; color: #fff; }
.mq-rank__link { font-size: 14px; line-height: 1.5; color: #334155; text-decoration: none; transition: color .2s ease; }
.mq-rank__link:hover { color: #1880FF; }
/* 紧凑列表（最新发布 / 热门资讯） */
.mq-mini-list { list-style: none; margin: 0; padding: 0; }
.mq-mini-list__item { padding: 10px 0; border-bottom: 1px dashed #EEF2F7; }
.mq-mini-list__item:last-child { border-bottom: 0; padding-bottom: 0; }
.mq-mini-list__link { display: flex; flex-direction: column; gap: 4px; text-decoration: none; }
.mq-mini-list__title { font-size: 14px; line-height: 1.5; color: #334155; transition: color .2s ease; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mq-mini-list__link:hover .mq-mini-list__title { color: #1880FF; }
.mq-mini-list__date { font-size: 12px; color: #9CA3AF; }
/* 标签云 */
.mq-tagcloud { display: flex; flex-wrap: wrap; gap: 8px; }
.mq-tagcloud__item { display: inline-flex; align-items: center; padding: 5px 12px; border-radius: 999px; background: #F1F5F9; color: #475569; font-size: 13px; text-decoration: none; transition: background-color .2s ease, color .2s ease; }
.mq-tagcloud__item:hover { background: #1880FF; color: #fff; }
/* 栏目导航 */
.mq-cat-list { list-style: none; margin: 0; padding: 0; }
.mq-cat-list__item { margin: 0; }
.mq-cat-list__link { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; border-radius: 10px; color: #475569; font-size: 14px; text-decoration: none; transition: background-color .2s ease, color .2s ease; }
.mq-cat-list__link:hover { background: #F0F7FF; color: #1880FF; }
.mq-cat-list__count { font-size: 12px; color: #9CA3AF; font-variant-numeric: tabular-nums; }
.mq-cat-list__item.is-active .mq-cat-list__link { background: #1880FF; color: #fff; }
.mq-cat-list__item.is-active .mq-cat-list__count { color: rgba(255,255,255,.8); }
/* ============================================================
* 栏目页：两栏布局（主列表 + 内链侧边栏）
* ============================================================ */
.mq-archive__layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; align-items: start; }
.mq-archive__main { min-width: 0; }
.mq-archive__sidebar { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 24px; }
/* 侧栏存在时，主列表网格在桌面端收为 2 列（优先级高于默认 3 列） */
@media (min-width: 1025px) {
.mq-archive__main .mq-list,
.mq-archive__main .mq-list-wrap[data-view="grid"] .mq-list { grid-template-columns: repeat(2, 1fr); gap: 28px; }
.mq-archive__main .mq-skeleton-grid { grid-template-columns: repeat(2, 1fr); gap: 28px; }
}
/* ============================================================
* 响应式：≤1024px 侧边栏收起到正文下方
* ============================================================ */
@media (max-width: 1024px) {
.mq-single__layout { grid-template-columns: 1fr; gap: 40px; }
.mq-single__sidebar { position: static; order: 2; }
.mq-archive__layout { grid-template-columns: 1fr; gap: 40px; }
.mq-archive__sidebar { position: static; order: 2; }
}
/* ============================================================
* 首页「最新资讯」section：区段头 + 3×3 卡片网格
* 复用 .mq-grid / .mq-card / .mq-card__media / .mq-card__body /
* .mq-card__meta / .mq-tag / .mq-card__title / .mq-card__excerpt /
* .mq-card__more，仅补充区段头布局与 96px 上下留白
* ============================================================ */
.mq-section { padding: 96px 0; background: #fff; }
.mq-section--latest { border-top: 1px solid #EEF2F7; }
.mq-section__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 48px; }
.mq-section__title { font-size: 36px; font-weight: 700; color: #0F172A; line-height: 1.2; margin: 0 0 12px; letter-spacing: -.01em; }
.mq-section__sub { font-size: 16px; color: #6B7280; line-height: 1.6; margin: 0; max-width: 560px; }
.mq-section__more { color: #1880FF; font-size: 15px; font-weight: 500; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; flex-shrink: 0; transition: color .2s ease, gap .2s ease; }
.mq-section__more:hover { color: #0E66D9; gap: 8px; }
.mq-section__more:focus-visible { outline: 2px solid #1880FF; outline-offset: 4px; border-radius: 2px; }
@media (max-width: 640px) {
.mq-section { padding: 64px 0; }
.mq-section__head { flex-direction: column; align-items: flex-start; gap: 16px; margin-bottom: 32px; }
.mq-section__title { font-size: 26px; }
.mq-section__sub { font-size: 14px; }
}
/* ============================================================
* 首页 FAQ（常见问题）手风琴模块
* 区段头复用 .mq-section / __head / __title / __sub 既有样式
* 采用原生 手风琴：无 JS 依赖、可访问、移动端友好
* ============================================================ */
.mq-section--faq { border-top: 1px solid #EEF2F7; }
.mq-faq { max-width: 860px; margin: 0 auto; display: flex; flex-direction: column; }
.mq-faq__item {
border: 1px solid #EEF2F7;
border-radius: 12px;
background: #fff;
margin-bottom: 16px;
overflow: hidden;
transition: border-color .2s ease, box-shadow .2s ease;
}
.mq-faq__item:last-child { margin-bottom: 0; }
.mq-faq__item[open] {
border-color: #BFD6FF;
box-shadow: 0 4px 16px rgba(24, 128, 255, .08);
}
.mq-faq__q {
list-style: none; /* 去掉 默认三角 */
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding: 22px 24px;
font-size: 17px;
font-weight: 600;
color: #0F172A;
line-height: 1.5;
user-select: none;
}
.mq-faq__q::-webkit-details-marker { display: none; }
.mq-faq__q:focus-visible { outline: 2px solid #1880FF; outline-offset: -2px; border-radius: 12px; }
/* + / − 指示器 */
.mq-faq__icon {
position: relative;
flex-shrink: 0;
width: 18px;
height: 18px;
transition: transform .25s ease;
}
.mq-faq__icon::before,
.mq-faq__icon::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
background: #1880FF;
border-radius: 2px;
}
.mq-faq__icon::before { width: 18px; height: 2px; transform: translate(-50%, -50%); } /* 横 */
.mq-faq__icon::after { width: 2px; height: 18px; transform: translate(-50%, -50%); /* 竖 */
transition: opacity .25s ease; }
.mq-faq__item[open] .mq-faq__icon { transform: rotate(180deg); }
.mq-faq__item[open] .mq-faq__icon::after { opacity: 0; } /* 展开变 − */
.mq-faq__a {
padding: 0 24px 24px;
font-size: 15px;
line-height: 1.8;
color: #475569;
}
.mq-faq__a p { margin: 0 0 12px; }
.mq-faq__a p:last-child { margin-bottom: 0; }
/* Customizer 后台重复器控件样式 */
.mq-faq-repeater { margin-top: 8px; }
.mq-faq-list { margin: 0 0 8px; list-style: none; }
.mq-faq-row { background: #f7f9fc; border: 1px solid #e3e8f0; border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; }
.mq-faq-row p { margin: 0 0 6px; }
.mq-faq-row .widefat { width: 100%; }
.mq-faq-del { color: #d6336c; }
@media (max-width: 1024px) {
.mq-faq__q { padding: 20px 20px; font-size: 16px; }
.mq-faq__a { padding: 0 20px 20px; }
}
@media (max-width: 640px) {
.mq-faq { max-width: 100%; }
.mq-faq__q { padding: 18px; font-size: 15px; }
.mq-faq__a { padding: 0 18px 18px; font-size: 14px; line-height: 1.75; }
}