/* =====================================================================
   list.css — 列表页专属样式（须在 base.css 之后引入）
   ---------------------------------------------------------------------
   v0.1 来源：由 新网站设计/public/css/list.css 移植（2026-09-19 · it-005）。
   设计稿的 .crumb / .side-head / .side-nav / .panel-head / .list-item /
   .date-block / .pagination 等自研类名，已改写到对应组件的渲染态类名上：
     · 190509 当前位置        .content-address > table.winstyle190509
     · 190563 二级导航        .content-news-title > .content-title
                              > .content-1 > .content-span-1 + .content-title-1
     · 190581 二级导航1       .content-1 > .content-span-1（承载面板标题栏）
     · 1059064 静态翻页列表   .content-news-list > ul > li.content-news-li
                              > a + p + span.content-news-time
     · 分页                   .content-page > .zxf_pagediv
   ===================================================================== */

/* 页面横幅 */
.page-banner{position:relative;background:var(--grad);padding:76px 0 70px;overflow:hidden;color:#fff}
.page-banner .grid-overlay{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:52px 52px;mask-image:radial-gradient(ellipse 80% 90% at 20% 50%,#000 30%,transparent 78%)}
.page-banner .glow{position:absolute;width:420px;height:420px;border-radius:50%;background:#0E8C74;filter:blur(100px);opacity:.45;right:-80px;top:-140px}
.page-banner h1{font-size:38px;font-weight:800;letter-spacing:2px;position:relative;z-index:2}
.page-banner .en{font-size:13px;letter-spacing:3.5px;color:var(--cyan);text-transform:uppercase;font-family:var(--font-en);display:block;margin-bottom:12px;position:relative;z-index:2}

/* 组件 190509 当前位置：渲染态为 <table class="winstyle190509"><tr><td nowrap>当前位置：… */
.content-address{position:relative;z-index:2;margin-top:18px;font-size:13px;color:rgba(255,255,255,.6)}
.content-address table{font-size:13px;color:rgba(255,255,255,.6)}
.content-address td{white-space:nowrap}
.content-address .fontstyle190509{color:rgba(255,255,255,.6)}
.content-address a .fontstyle190509:hover{color:var(--cyan)}
.content-address .splitflagstyle190509{color:rgba(255,255,255,.3);margin:0 8px}

/* 主体布局 */
.main{padding:56px 0 88px}
.layout{display:grid;grid-template-columns:280px 1fr;gap:36px;align-items:start}

/* 侧边栏目（页面框架卡片 + 组件 190563 二级导航） */
.side-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);position:sticky;top:102px}
.content-title{background:#fff}
.side-card .content-1{background:var(--grad);color:#fff;padding:24px 26px}
.side-card .content-span-1{display:block;font-size:19px;font-weight:700;letter-spacing:1px;color:#fff}
/* 设计稿的英文小标题（News Center）在组件渲染态里没有对应节点，
   用伪元素保住外观；文字硬编码在 CSS 中（见 VERSION.md 已知偏差）。 */
.side-card .content-span-1::after{content:"News Center";display:block;margin-top:2px;font-size:11px;letter-spacing:2px;font-weight:400;color:rgba(255,255,255,.6);text-transform:uppercase;font-family:var(--font-en)}
.side-card .content-title-1{display:flex;flex-direction:column}
.side-card .content-title-1 a{display:flex;align-items:center;justify-content:space-between;padding:15px 24px;font-size:14.5px;color:var(--ink);border-bottom:1px dashed var(--line);position:relative;transition:all .25s}
.side-card .content-title-1 a:last-child{border-bottom:none}
.side-card .content-title-1 a .arrow{color:#B7C2D0;font-size:12px;transition:all .25s}
.side-card .content-title-1 a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--blue),var(--cyan));transform:scaleY(0);transition:transform .25s}
.side-card .content-title-1 a:hover,.side-card .content-title-1 a.active{background:#F5FBF9;color:var(--teal);padding-left:30px}
.side-card .content-title-1 a:hover::before,.side-card .content-title-1 a.active::before{transform:scaleY(1)}
.side-card .content-title-1 a.active{font-weight:600}

/* 列表 */
.list-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden}

/* 组件 190581 二级导航1（.content-1 > .content-span-1）→ 面板标题栏 */
.panel-head{display:flex;align-items:center;justify-content:space-between;padding:22px 30px;border-bottom:1px solid var(--line)}
.panel-head .content-span-1{font-size:17px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:10px}
.panel-head .content-span-1::before{content:"";width:4px;height:18px;border-radius:2px;background:linear-gradient(180deg,var(--blue),var(--cyan))}
.panel-head .count{font-size:12.5px;color:#93A1B5;font-weight:400}

/* 组件 1059064 静态翻页列表 */
.content-news-li{display:grid;grid-template-columns:76px 1fr 38px;grid-template-areas:"date title go" "date sum go";align-items:center;column-gap:22px;padding:24px 30px;border-bottom:1px dashed var(--line);transition:all .25s ease}
.content-news-li:last-child{border-bottom:none}
.content-news-li:hover{background:#F8FBFA}
/* 组件渲染态只提供「一个日期字段」，无法拆成设计稿的「日 / 年月」双行，
   故日期块统一渲染为单行完整日期（见 VERSION.md 已知偏差 D-01）。 */
.content-news-li>span.content-news-time{grid-area:date;width:76px;height:76px;border-radius:12px;background:linear-gradient(150deg,#F2F7FF,#EAF7F4);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--font-en);font-size:13px;line-height:1;white-space:nowrap;color:#8A97AB;transition:all .3s}
.content-news-li:hover>span.content-news-time{background:var(--grad);border-color:transparent;color:#fff}
.content-news-li>a{grid-area:title;font-size:16.5px;font-weight:600;color:var(--ink);line-height:1.55;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;transition:color .25s}
.content-news-li:hover>a{color:var(--teal)}
.content-news-li>p{grid-area:sum;margin-top:8px;font-size:13.5px;color:#8A97AB;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.content-news-li>p:empty{display:none}
.content-news-li::after{grid-area:go;content:"→";width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:#B7C2D0;font-size:15px;transition:all .3s}
.content-news-li:hover::after{background:var(--teal);border-color:var(--teal);color:#fff;transform:rotate(-45deg)}

/* 分页（模板容器 .content-page > .zxf_pagediv；页码类名取自组件渲染态） */
.content-page{padding:34px 0 8px}
.zxf_pagediv{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap}
.zxf_pagediv a,.zxf_pagediv span{min-width:42px;height:42px;padding:0 14px;border-radius:10px;border:1px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--body);font-family:var(--font-en)}
.zxf_pagediv a:hover{border-color:var(--teal);color:var(--teal)}
.zxf_pagediv a.this-page{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 8px 18px rgba(47,123,255,.25)}
.zxf_pagediv span.PrevDisabled,.zxf_pagediv span.NextDisabled{opacity:.4}
.zxf_pagediv span.break{border:none;background:transparent;min-width:0;padding:0 2px;letter-spacing:2px}

/* ============ Misc ============ */
.reveal{opacity:0;transform:translateY(24px);transition:all .65s cubic-bezier(.22,.61,.36,1)}
.reveal.in{opacity:1;transform:none}

/* ============ Responsive（列表页专属部分） ============ */
@media(max-width:1080px){
  .layout{grid-template-columns:1fr}
  /* 手机模式（≤1080px，单列布局起点）：侧边栏整块隐藏。
     原规则 .side-card{position:static} 随之失效（display:none 已将其移出栅格，
     同时避免留下 0 高栅格项产生 36px 幽灵行间距）。 */
  .side-card{display:none}
}
@media(max-width:640px){
  .page-banner h1{font-size:28px}
  .content-news-li{grid-template-columns:64px 1fr 38px;grid-template-areas:"date title go";column-gap:14px;padding:18px}
  .content-news-li>span.content-news-time{width:64px;height:64px;font-size:12px}
  .content-news-li>p{display:none}
  .page-banner{padding:20px 0 20px;}
  .main{padding:20px 0 20px}
}