/* ============================================================
   钛声矩阵封面页css
   ============================================================ */
   
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Inter','Segoe UI',system-ui,-apple-system,'Microsoft YaHei',sans-serif;
  background:#f5f5f5; color:#666; line-height:1.6; -webkit-font-smoothing:antialiased; padding:0 20px; }
.container { max-width:1400px; margin:0 auto; padding:20px 0 60px; }

.site-header { position:relative; padding:24px 40px; margin-bottom:30px; background:#0F3057;
  border-radius:12px; box-shadow:0 4px 24px rgba(0,0,0,.3); display:flex; flex-wrap:wrap;
  justify-content:space-between; align-items:center; gap:18px; }
.brand .logo { font-size:1.8rem; font-weight:700; letter-spacing:1px; color:#fff; text-decoration:none; }
.brand .tagline { font-size:.8rem; color:#8a8a9e; margin-left:12px; letter-spacing:2px; font-weight:300;
  border-left:1px solid rgba(255,255,255,.08); padding-left:14px; }
.main-nav { display:flex; gap:22px; font-size:.95rem; font-weight:500; flex-wrap:wrap; }
.main-nav a { color:#b0c4db; text-decoration:none; padding:4px 0; border-bottom:2px solid transparent; transition:all .3s; }
.main-nav a:hover,.main-nav a.active { color:#fff; border-bottom-color:#dc0000; }

.breadcrumb { font-size:.85rem; color:#999; margin-bottom:18px; }
.breadcrumb a { color:#888; text-decoration:none; }
.breadcrumb a:hover { color:#0F3057; }
.breadcrumb span { margin:0 6px; color:#ccc; }

.hero { position:relative; overflow:hidden; background:linear-gradient(120deg,#0F3057 0%,#1a4068 60%,#24507f 100%);
  border-radius:12px; padding:48px 44px 44px; margin-bottom:36px; box-shadow:0 8px 30px rgba(15,48,87,.18); }
.hero::after { content:''; position:absolute; top:-40%; right:-8%; width:420px; height:420px; border-radius:50%;
  background:radial-gradient(circle,rgba(220,0,0,.18) 0%,transparent 70%); }
.hero h1 { font-size:3rem; font-weight:700; letter-spacing:3px; color:#fff; position:relative; z-index:2; }
.hero h1 span { color:#ffb3b3; }
.hero .sub { font-size:1.02rem; color:#c3d3e4; margin-top:12px; font-weight:300; letter-spacing:1px;
  border-left:3px solid #dc0000; padding-left:18px; position:relative; z-index:2; max-width:1000px; }
.hero-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:18px; margin-top:34px; position:relative; z-index:2; }
.hero-stat { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:10px; padding:16px 18px; }
.hero-stat .num { font-size:2rem; font-weight:700; color:#fff; line-height:1.2; }
.hero-stat .num small { font-size:.85rem; font-weight:400; margin-left:3px; color:#c3d3e4; }
.hero-stat .lab { font-size:.82rem; color:#b0c4db; letter-spacing:1px; margin-top:2px; }

.entry-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:24px; margin-bottom:46px; }
.entry-card { background:#fff; border:1px solid #e8e8e8; border-radius:12px; padding:28px 26px;
  text-decoration:none; color:inherit; display:block; position:relative; overflow:hidden;
  box-shadow:0 2px 8px rgba(0,0,0,.03); transition:all .3s; }
.entry-card::before { content:''; position:absolute; top:0; left:0; width:4px; height:100%;
  background:linear-gradient(to bottom,#0F3057,#2D3436); opacity:.3; transition:opacity .3s; }
.entry-card:hover { transform:translateY(-6px); border-color:#0F3057; box-shadow:0 12px 40px rgba(15,48,87,.10); }
.entry-card:hover::before { opacity:1; }
.entry-card .ico { width:54px; height:54px; border-radius:12px; background:#eef2f7; color:#0F3057;
  display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin-bottom:16px; }
.entry-card h3 { font-size:1.25rem; color:#1f1f1f; font-weight:600; margin-bottom:6px; }
.entry-card h3 em { font-style:normal; font-size:.75rem; color:#dc0000; border:1px solid #f3c9c9;
  border-radius:20px; padding:1px 8px; margin-left:8px; vertical-align:middle; }
.entry-card p { font-size:.92rem; color:#888; }
.entry-card .go { margin-top:14px; font-size:.88rem; color:#0F3057; font-weight:600; }

.sec-head { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:22px; flex-wrap:wrap; gap:10px; }
.sec-head h2 { font-size:1.6rem; font-weight:600; color:#1f1f1f; letter-spacing:1px; }
.sec-head h2 i { color:#0F3057; margin-right:10px; }
.sec-head .desc { font-size:.9rem; color:#999; }
.sec-head .more { font-size:.9rem; color:#0F3057; text-decoration:none; font-weight:500; }
.sec-head .more:hover { color:#dc0000; }

.dyn-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:22px; margin-bottom:46px; }
.dyn-card { background:#fff; border:1px solid #e8e8e8; border-radius:12px; padding:24px 24px 18px;
  transition:all .3s; box-shadow:0 2px 8px rgba(0,0,0,.03); }
.dyn-card:hover { transform:translateY(-5px); border-color:#0F3057; box-shadow:0 12px 36px rgba(15,48,87,.09); }
.tag { display:inline-block; font-size:.72rem; padding:3px 12px; border-radius:20px;
  background:#eef2f7; color:#0F3057; margin-bottom:12px; letter-spacing:.5px; }
.tag.grade { background:#fff4e5; color:#b26a00; margin-left:6px; }
.tag.scene { background:#eaf7ef; color:#1a7f45; margin-left:6px; }
.dyn-card h3 { font-size:1.08rem; font-weight:600; margin-bottom:8px; line-height:1.45; }
.dyn-card h3 a { color:#1f1f1f; text-decoration:none; transition:color .3s; }
.dyn-card h3 a:hover { color:#0F3057; }
.dyn-card .sum { font-size:.9rem; color:#888; line-height:1.7; margin-bottom:14px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.dyn-card .meta { display:flex; justify-content:space-between; font-size:.8rem; color:#aaa;
  border-top:1px solid #f0f0f0; padding-top:12px; }
.dyn-empty { background:#fff; border:1px dashed #dfe5ec; border-radius:12px; padding:46px 20px;
  text-align:center; color:#aaa; grid-column:1/-1; }

.plat-sec { background:#fff; border:1px solid #e8e8e8; border-radius:12px; padding:32px 30px;
  margin-bottom:46px; box-shadow:0 2px 8px rgba(0,0,0,.03); }
.plat-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.plat-item { border:1px solid #ececec; border-radius:12px; padding:22px 12px 16px; text-align:center;
  text-decoration:none; color:#555; display:flex; flex-direction:column; align-items:center; gap:9px;
  transition:all .3s; background:#fcfcfd; }
.plat-item:hover { transform:translateY(-4px); border-color:#0F3057; box-shadow:0 10px 26px rgba(15,48,87,.10); color:#1f1f1f; }
.plat-item .ico { width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:1.7rem; background:#f2f5f9; color:#0F3057; transition:all .3s; }
.plat-item:hover .ico { transform:scale(1.06); }
.plat-item .pname { font-size:.95rem; font-weight:500; }
.plat-item .pbage { font-size:.68rem; color:#999; }
.plat-item .pbage b { color:#0F3057; font-weight:600; }
.plat-item[data-p="抖音"] .ico { color:#000; background:#eaf9fd; }
.plat-item[data-p="今日头条"] .ico { color:#f8593c; background:#fdeeeb; }
.plat-item[data-p="百家号"] .ico { color:#2932e1; background:#ececfd; }
.plat-item[data-p="视频号"] .ico { color:#09b83e; background:#e9f9ee; }
.plat-item[data-p="微信公众号"] .ico { color:#07c160; background:#e8f8ef; }
.plat-item[data-p="微博"] .ico { color:#ff8200; background:#fff3e6; }
.plat-item[data-p="知乎"] .ico { color:#0084ff; background:#e8f2ff; }
.plat-item[data-p="B站"] .ico { color:#fb7299; background:#fdeaf0; }
.plat-item[data-p="搜狐号"] .ico { color:#ee6a3d; background:#fdefe8; }
.plat-item[data-p="网易号"] .ico { color:#e73c3c; background:#fdecec; }
.plat-empty { text-align:center; color:#aaa; padding:36px 0; }

.rp-sec { background:linear-gradient(135deg,#0F3057 0%,#1a4068 100%); border-radius:12px; padding:36px 34px;
  margin-bottom:40px; color:#fff; box-shadow:0 8px 30px rgba(15,48,87,.18); }
.rp-sec .sec-head h2 { color:#fff; }
.rp-sec .sec-head h2 i { color:#ffb3b3; }
.rp-sec .sec-head .desc { color:#b0c4db; }
.rp-sec .sec-head .more { color:#fff; border-bottom:1px solid rgba(255,255,255,.4); }
.rp-sec .sec-head .more:hover { color:#ffb3b3; }
.rp-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:18px; margin-bottom:22px; }
.rp-stat { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:10px; padding:16px; text-align:center; }
.rp-stat .num { font-size:1.9rem; font-weight:700; color:#fff; }
.rp-stat .lab { font-size:.8rem; color:#b0c4db; letter-spacing:1px; }
.rp-note { font-size:.88rem; color:#c3d3e4; border-top:1px solid rgba(255,255,255,.12); padding-top:16px; }
.rp-note a { color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.4); }
.rp-note a:hover { color:#ffb3b3; }

.site-footer { margin-top:30px; border-top:1px solid #e8e8e8; padding:32px 0 20px; text-align:center; font-size:.85rem; color:#999; }
.site-footer .footer-links { margin-top:10px; }
.site-footer  a { color:#999; text-decoration:none; margin:0 10px; transition:color .3s; }
.site-footer  a:hover { color:#0F3057;}

@media (max-width:1199px){ .plat-grid { grid-template-columns:repeat(4,1fr); } }
@media (max-width:992px){
  .site-header { padding:20px 24px; flex-direction:column; align-items:stretch; gap:14px; }
  .brand .tagline { display:block; margin-left:0; padding-left:0; border-left:none; margin-top:2px; }
  .main-nav { gap:18px; font-size:.9rem; }
  .hero { padding:34px 26px; } .hero h1 { font-size:2.2rem; }
  .plat-grid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:768px){
  body { padding:0 12px; }
  .hero h1 { font-size:1.8rem; letter-spacing:2px; }
  .hero .sub { font-size:.92rem; padding-left:14px; }
  .plat-grid { grid-template-columns:repeat(2,1fr); gap:14px; }
  .rp-sec { padding:26px 20px; }
}
@media (max-width:480px){
  .hero h1 { font-size:1.5rem; }
  .entry-card { padding:22px 18px; }
  .plat-item .ico { width:48px; height:48px; font-size:1.4rem; }
}

/* ===== 返回顶部按钮 ===== */
.gotop {
  position: fixed; right: 28px; bottom: 34px;
  width: 50px; height: 50px; padding: 0; border: none; border-radius: 50%;
  background: #fff; box-shadow: 0 4px 18px rgba(15,48,87,.18);
  cursor: pointer; z-index: 9999;
  opacity: 0; visibility: hidden; transform: translateY(14px) scale(.9);
  transition: opacity .3s, transform .3s, visibility .3s;
}
.gotop.show { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.gotop-ring { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.gotop-bg { fill: none; stroke: #eceff4; stroke-width: 3; }
.gotop-bar { fill: none; stroke: #0F3057; stroke-width: 3; stroke-linecap: round;
  stroke-dasharray: 119.38; stroke-dashoffset: 119.38; }
.gotop-arrow { position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center; }
.gotop-arrow svg { width: 18px; height: 18px; fill: none;
  stroke: #0F3057; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.gotop:hover { box-shadow: 0 6px 22px rgba(15,48,87,.28); }
.gotop:hover .gotop-arrow svg { stroke: #dc0000; }
.gotop:hover .gotop-bar { stroke: #dc0000; }
@media (max-width:768px){
  .gotop { right: 14px; bottom: 18px; width: 42px; height: 42px; }
  .gotop-arrow svg { width: 15px; height: 15px; }
}
/* ===== 移动端响应式补丁 · 钛声矩阵封面页===== */
.nav-toggle{display:none;position:absolute;top:20px;right:20px;z-index:60;width:44px;height:44px;padding:0;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:10px;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.nav-toggle span{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:all .3s}
.nav-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.active span:nth-child(2){opacity:0}
.nav-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (max-width:768px){
  .site-header{position:relative}
  .brand{padding-right:60px}
  .nav-toggle{display:flex}
  .main-nav{display:none!important;width:100%;flex-direction:column;gap:0;padding-top:12px;border-top:1px solid rgba(255,255,255,.12)}
  .main-nav.open{display:flex!important}
  .main-nav a{padding:13px 0;font-size:1rem;border-bottom:1px solid rgba(255,255,255,.08)}
  .hero{padding:26px 18px}
  .hero h1{font-size:1.7rem;letter-spacing:1px}
  .hero .sub{font-size:.88rem;padding-left:12px}
  .hero-stats{grid-template-columns:repeat(2,1fr);gap:10px;margin-top:22px}
  .hero-stat{padding:12px}
  .hero-stat .num{font-size:1.45rem}
  .hero-stat .lab{font-size:.7rem}
  .entry-grid{grid-template-columns:1fr;gap:16px}
  .entry-card{padding:22px 18px}
  .sec-head h2{font-size:1.3rem}
  .sec-head .desc{font-size:.82rem}
  .dyn-grid{grid-template-columns:1fr}
  .plat-sec{padding:20px 14px}
  .plat-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .plat-item{padding:16px 8px 12px}
  .plat-item .ico{width:48px;height:48px;font-size:1.4rem}
  .plat-item .pname{font-size:.9rem}
  .rp-sec{padding:22px 16px}
  .rp-stats{grid-template-columns:repeat(2,1fr);gap:10px}
  .rp-stat .num{font-size:1.5rem}
  .rp-note{font-size:.82rem}
}

/* ============================================================
   国内平台品牌图标（FA 无收录，内联 SVG 精准还原）
   覆盖：百家号 / 今日头条 / 视频号 / 微信公众号 / 搜狐号 / 网易号
   同时适配 平台入口页(.plat-card) 与 封面页(.plat-item)
   ============================================================ */

/* ① 隐藏原来凑数的 FA 图标 */
.plat-card[data-p="百家号"] .ico i,    .plat-item[data-p="百家号"] .ico i,
.plat-card[data-p="今日头条"] .ico i,  .plat-item[data-p="今日头条"] .ico i,
.plat-card[data-p="视频号"] .ico i,    .plat-item[data-p="视频号"] .ico i,
.plat-card[data-p="微信公众号"] .ico i,.plat-item[data-p="微信公众号"] .ico i,
.plat-card[data-p="搜狐号"] .ico i,    .plat-item[data-p="搜狐号"] .ico i,
.plat-card[data-p="网易号"] .ico i,    .plat-item[data-p="网易号"] .ico i {
  display: none !important;
}

/* ② 伪元素统一基础 */
.plat-card[data-p="百家号"] .ico::after,    .plat-item[data-p="百家号"] .ico::after,
.plat-card[data-p="今日头条"] .ico::after,  .plat-item[data-p="今日头条"] .ico::after,
.plat-card[data-p="视频号"] .ico::after,    .plat-item[data-p="视频号"] .ico::after,
.plat-card[data-p="微信公众号"] .ico::after,.plat-item[data-p="微信公众号"] .ico::after,
.plat-card[data-p="搜狐号"] .ico::after,    .plat-item[data-p="搜狐号"] .ico::after,
.plat-card[data-p="网易号"] .ico::after,    .plat-item[data-p="网易号"] .ico::after {
  content: ''; display: block; width: 62%; height: 62%;
  min-width: 28px; min-height: 28px;
  background-repeat: no-repeat; background-position: center; background-size: contain;
}

/* ③ 百家号：蓝紫渐变 C 形 + 双星闪 */
.plat-card[data-p="百家号"] .ico::after, .plat-item[data-p="百家号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%232b6cf0'/%3E%3Cstop offset='1' stop-color='%238b5cf6'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='7' y='8' width='20' height='6' rx='3' fill='%233b82f6'/%3E%3Cpath d='M31 16a12 12 0 1 0 0 16' fill='none' stroke='url(%23g)' stroke-width='7' stroke-linecap='round'/%3E%3Cpath d='M35 9 L36.5 13.5 L41 15 L36.5 16.5 L35 21 L33.5 16.5 L29 15 L33.5 13.5 Z' fill='%23c084fc'/%3E%3Cpath d='M39.5 22 L40.25 23.75 L42 24.5 L40.25 25.25 L39.5 27 L38.75 25.25 L37 24.5 L38.75 23.75 Z' fill='%23a855f7'/%3E%3C/svg%3E");
}

/* ④ 今日头条：红色圆角块 + 白色新闻行 */
.plat-card[data-p="今日头条"] .ico::after, .plat-item[data-p="今日头条"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Crect x='5' y='5' width='38' height='38' rx='9' fill='%23F8593C'/%3E%3Crect x='13' y='14' width='22' height='4' rx='2' fill='white'/%3E%3Crect x='13' y='22' width='22' height='4' rx='2' fill='white'/%3E%3Crect x='13' y='30' width='13' height='4' rx='2' fill='white'/%3E%3C/svg%3E");
}

/* ⑤ 视频号：绿色圆 + 白色播放键（与公众号明确区分） */
.plat-card[data-p="视频号"] .ico::after, .plat-item[data-p="视频号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='21' fill='%2309B83E'/%3E%3Cpath d='M19 15 L34 24 L19 33 Z' fill='white'/%3E%3C/svg%3E");
}

/* ⑥ 微信公众号：微信绿圆 + 白色双气泡 */
.plat-card[data-p="微信公众号"] .ico::after, .plat-item[data-p="微信公众号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='21' fill='%2307C160'/%3E%3Cellipse cx='19' cy='21' rx='10' ry='8' fill='white'/%3E%3Cpath d='M12 27 L10.5 32 L15.5 29 Z' fill='white'/%3E%3Cellipse cx='31' cy='29' rx='8' ry='6.5' fill='white' opacity='0.85'/%3E%3Cpath d='M36 33 L37.5 37 L33 35 Z' fill='white' opacity='0.85'/%3E%3C/svg%3E");
}

/* ⑦ 搜狐号：橙色圆 + 白色狐狸头 */
.plat-card[data-p="搜狐号"] .ico::after, .plat-item[data-p="搜狐号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='21' fill='%23EE6A3D'/%3E%3Cpath d='M24 13 L29 20 C32.5 21 34.5 24 33 27.5 C31.5 31 27.5 33 24 33 C20.5 33 16.5 31 15 27.5 C13.5 24 15.5 21 19 20 Z' fill='white'/%3E%3Cpath d='M13 14 L16.5 23 L21 18 Z' fill='white'/%3E%3Cpath d='M35 14 L31.5 23 L27 18 Z' fill='white'/%3E%3C/svg%3E");
}

/* ⑧ 网易号：红色圆 + 白色信封（网易邮箱基因） */
.plat-card[data-p="网易号"] .ico::after, .plat-item[data-p="网易号"] .ico::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='21' fill='%23E73C3C'/%3E%3Crect x='13' y='16' width='22' height='16' rx='2' fill='white'/%3E%3Cpath d='M13 18.5 L24 26 L35 18.5' fill='none' stroke='%23E73C3C' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}