/* ===== ATLAS local navigation · white background and blue text ===== */

:root{
  --page-bg:      #f6fbff;
  --page-bg-2:    #eaf4fc;
  --ink-blue:     #0d3157;
  --deep-blue:    #123f68;
  --mid-blue:     #2878c7;
  --soft-blue:    #e7f2fb;
  --card-bg:      rgba(255,255,255,0.92);
  --card-border:  rgba(40,120,199,0.18);
  --card-hover:   #ffffff;
  --btn-bg:       #edf6fd;
  --btn-hover:    #dceefa;
  --text-main:    #0d3157;
  --text-desc:    #54708a;
  --text-faint:   #8ca0b4;
  --radius-card:  12px;
  --radius-btn:   6px;
  --font-sans:    'Inter', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

*{ box-sizing: border-box; margin:0; padding:0; }

html,body{
  min-height: 100vh;
  font-family: var(--font-sans);
  color: var(--text-main);
}

body{
  position: relative;
  background:
    linear-gradient(145deg, rgba(246,251,255,0.96) 0%, rgba(234,244,252,0.96) 100%),
    radial-gradient(90% 70% at 90% 85%, rgba(40,120,199,0.16) 0%, transparent 60%);
  overflow-x: hidden;
}

.bg-decor{
  position: fixed;
  right: -220px;
  bottom: -260px;
  width: 900px;
  height: 900px;
  z-index: 0;
  pointer-events: none;
  border-radius: 50%;
  background:
    repeating-radial-gradient(
      circle at center,
      transparent 0,
      transparent 118px,
      rgba(40,120,199,0.075) 120px,
      rgba(40,120,199,0.075) 122px,
      transparent 124px
    );
  opacity: 0.95;
}

.site-header{
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 0 auto;
  padding: 56px 40px 0;
  display: flex;
  align-items: center;
  gap: 16px;
}

.logo-mark{ display:flex; align-items:center; color: var(--ink-blue); }

.logo-text{
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-weight: 700;
  color: var(--ink-blue);
}

.logo-cn{ font-size: 20px; letter-spacing: 2px; }
.logo-dot{ color: var(--mid-blue); }
.logo-en{ font-size: 18px; letter-spacing: 3px; color: var(--ink-blue); font-weight: 600; }

.atlas-grid{
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 0 auto;
  padding: 72px 40px 100px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

@media (max-width: 860px){
  .atlas-grid{ grid-template-columns: 1fr; padding: 48px 20px 80px; }
  .site-header{ padding: 40px 20px 0; }
}

.card{
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: var(--radius-card);
  padding: 32px 32px 28px;
  box-shadow: 0 18px 45px rgba(13,49,87,0.08);
  transition: background .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}

.card:hover{
  background: var(--card-hover);
  border-color: rgba(40,120,199,0.34);
  box-shadow: 0 22px 52px rgba(13,49,87,0.12);
}

.card-icon{
  width: 44px;
  height: 44px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  background: var(--soft-blue);
  border: 1px solid rgba(40,120,199,0.12);
}

.icon-blue   { color: #1976b9; }
.icon-green  { color: #16876a; }
.icon-orange { color: #b46b1f; }
.icon-purple { color: #6656b8; }

.card-title{
  font-size: 21px;
  font-weight: 800;
  margin-bottom: 10px;
  letter-spacing: 0;
  color: var(--ink-blue);
}

.card-title-link{
  color: inherit;
  text-decoration: none;
}

.card-title-link:hover{
  color: var(--mid-blue);
}

.card-desc{
  font-size: 14px;
  color: var(--text-desc);
  line-height: 1.6;
  margin-bottom: 24px;
}

.btn-row{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.btn-row-three .atlas-btn{
  flex: 1 1 calc((100% - 24px) / 3);
}

.atlas-btn{
  flex: 1;
  min-width: 100px;
  text-align: center;
  background: var(--btn-bg);
  border: 1px solid rgba(40,120,199,0.18);
  border-radius: var(--radius-btn);
  padding: 12px 14px;
  font-size: 14px;
  font-weight: 700;
  color: var(--deep-blue);
  text-decoration: none;
  transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.atlas-btn:hover{
  background: var(--btn-hover);
  border-color: rgba(40,120,199,0.34);
  color: #0a2745;
  transform: translateY(-2px);
}

.atlas-btn.is-pending{
  opacity: 0.48;
  cursor: not-allowed;
  color: #7e8b98;
  background: #f1f4f7;
  border-color: rgba(126,139,152,0.24);
}

.atlas-btn.is-pending:hover{
  background: #f1f4f7;
  transform: none;
}

.atlas-btn.is-pending span::after{
  content: "待接入";
  display: block;
  font-size: 10px;
  font-weight: 400;
  color: var(--text-faint);
  margin-top: 4px;
  letter-spacing: 1px;
}

.site-footer{
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 40px 40px;
  font-size: 12px;
  color: var(--text-faint);
  display: flex;
  gap: 8px;
}

@media (max-width: 860px){
  .site-footer{ padding: 0 20px 32px; }
}

/* ============================================================
   ATLAS 首页 v2 · 三大板块导航 + 最新内容区
   ============================================================ */

.header-sub{
  margin-left: auto;
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--text-desc);
}

@media (max-width: 860px){
  .header-sub{ display: none; }
}

.home{
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 0 auto;
  padding: 44px 40px 80px;
}

.sections-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

@media (max-width: 960px){
  .sections-grid{ grid-template-columns: 1fr; }
  .home{ padding: 40px 20px 70px; }
}

.section-card{
  display: flex;
  flex-direction: column;
}

.section-card .btn-row{
  margin-top: auto;
}

.btn-row-two .atlas-btn{
  flex: 1 1 calc((100% - 12px) / 2);
}

/* ---- 内容区：最新联合早报 + 最新公众号 ---- */

.feeds-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 24px;
}

@media (max-width: 960px){
  .feeds-grid{ grid-template-columns: 1fr; }
}

.feed-panel{
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: var(--radius-card);
  box-shadow: 0 18px 45px rgba(13,49,87,0.08);
  padding: 24px 26px 18px;
  display: flex;
  flex-direction: column;
  transition: border-color .25s ease, box-shadow .25s ease;
}

.feed-panel:hover{
  border-color: rgba(40,120,199,0.30);
  box-shadow: 0 22px 52px rgba(13,49,87,0.11);
}

.feed-head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.feed-title{
  display: flex;
  align-items: center;
  gap: 12px;
}

.feed-icon{
  font-size: 22px;
  line-height: 1;
}

.feed-title h2{
  font-size: 17px;
  font-weight: 800;
  color: var(--ink-blue);
  margin: 0;
}

.feed-meta{
  font-size: 12px;
  color: var(--text-desc);
  margin: 3px 0 0;
}

.feed-more{
  font-size: 13px;
  font-weight: 700;
  color: var(--mid-blue);
  text-decoration: none;
  white-space: nowrap;
  padding-top: 4px;
}

.feed-more:hover{ text-decoration: underline; }

.feed-list{
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: zaobao;
}

.feed-list .feed-item{
  counter-increment: zaobao;
  position: relative;
  padding: 10px 0 10px 30px;
  border-top: 1px dashed rgba(40,120,199,0.14);
  font-size: 14px;
  line-height: 1.55;
  color: var(--text-main);
}

.feed-list .feed-item::before{
  content: counter(zaobao);
  position: absolute;
  left: 0;
  top: 10px;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  background: var(--soft-blue);
  border: 1px solid rgba(40,120,199,0.16);
  color: var(--deep-blue);
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.feed-list .feed-item:first-child{ border-top: none; }

.feed-item a{
  color: inherit;
  text-decoration: none;
}

.feed-item a:hover{ color: var(--mid-blue); }

.feed-empty{
  padding: 14px 0;
  color: var(--text-faint);
  font-size: 13px;
}

.feed-foot{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(40,120,199,0.12);
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}

.feed-label{
  font-size: 11px;
  letter-spacing: 2px;
  color: var(--text-faint);
  font-weight: 700;
  flex-shrink: 0;
}

.feed-history{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.hist-chip{
  font-size: 11.5px;
  color: var(--deep-blue);
  background: var(--btn-bg);
  border: 1px solid rgba(40,120,199,0.18);
  border-radius: 999px;
  padding: 2px 10px;
  text-decoration: none;
  white-space: nowrap;
}

.hist-chip:hover{
  background: var(--btn-hover);
  border-color: rgba(40,120,199,0.34);
}

/* ---- 公众号文章列表 ---- */

.article-list{
  list-style: none;
  margin: 0;
  padding: 0;
}

.article-item{
  display: flex;
  gap: 10px;
  align-items: baseline;
  padding: 10px 0;
  border-top: 1px dashed rgba(40,120,199,0.14);
}

.article-item:first-child{ border-top: none; }

.article-date{
  flex-shrink: 0;
  font-size: 11.5px;
  color: var(--text-faint);
  font-family: 'Inter', 'JetBrains Mono', Consolas, monospace;
}

.article-main{
  flex: 1;
  min-width: 0;
}

.article-account{
  font-size: 11.5px;
  color: #16876a;
  font-weight: 700;
  margin-right: 8px;
}

.article-title{
  font-size: 14px;
  line-height: 1.5;
  color: var(--text-main);
  cursor: pointer;
}

.article-title:hover{ color: var(--mid-blue); }