.phone-news-body { background: #f4f5f7; }
.phone-news { width: 100%; max-width: 750px; margin: 0 auto; overflow: hidden; color: #202738; background: #f4f5f7; }
.phone-news h1, .phone-news h2, .phone-news p, .phone-news ul { margin: 0; }
.phone-news ul { padding: 0; list-style: none; }
.phone-news a { color: inherit; text-decoration: none; }

.phone-news-hero { min-height: clamp(210px, 43vw, 323px); padding: calc(clamp(68px, 12vw, 90px) + clamp(28px, 7vw, 52px)) clamp(18px, 4.8vw, 36px) clamp(30px, 7vw, 52px); background-color: #e4f4ff; background-image: url(../../Images/ShowImg/seo-geo/news/news-hero-bg.webp); background-position: center; background-repeat: no-repeat; background-size: cover; text-align: center; }
.phone-news-hero h1 { font-size: clamp(29px, 6.4vw, 48px); font-weight: 700; line-height: 1.25; letter-spacing: .02em; }
.phone-news-hero p { margin-top: clamp(13px, 3.2vw, 24px); color: #3f4a5b; font-size: clamp(14px, 3.2vw, 24px); line-height: 1.55; }

.phone-news-breadcrumb { display: flex; min-height: clamp(54px, 12.8vw, 96px); align-items: center; gap: clamp(10px, 2.4vw, 18px); padding: 0 clamp(16px, 4.267vw, 32px); background: #fff; color: #9aa0aa; font-size: clamp(14px, 3.2vw, 24px); }
.phone-news-breadcrumb a { display: inline-flex; align-items: center; gap: 7px; color: #303747; }
.phone-news-breadcrumb svg { width: clamp(17px, 4vw, 30px); height: clamp(17px, 4vw, 30px); fill: none; stroke: currentColor; stroke-linejoin: round; stroke-width: 1.8; }

.phone-news-content { padding: clamp(18px, 4.267vw, 32px) clamp(16px, 4.267vw, 32px) clamp(30px, 8vw, 60px); }
.phone-news-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(6px, 1.8vw, 13px); margin-bottom: clamp(18px, 4.8vw, 36px); }
.phone-news-tab { min-width: 0; min-height: clamp(38px, 9.333vw, 70px); padding: 7px 4px; border: 0; border-radius: clamp(7px, 1.867vw, 14px); color: #303744; background: transparent; cursor: pointer; font-size: clamp(14px, 3.2vw, 24px); line-height: 1.25; white-space: nowrap; }
.phone-news-tab.is-active { color: #078af0; background: #dff1fd; }

.phone-news-list { display: grid; }
.phone-news-card { display: grid; min-width: 0; grid-template-columns: clamp(112px, 29vw, 218px) minmax(0, 1fr); gap: clamp(11px, 3vw, 22px); padding: 0 0 clamp(17px, 4.267vw, 32px); margin-bottom: clamp(17px, 4.267vw, 32px); border-bottom: 1px solid #e1e4e8; }
.phone-news-cover { position: relative; display: block; align-self: start; overflow: hidden; border-radius: clamp(7px, 1.867vw, 14px); background: #e7ebef; }
.phone-news-cover img { display: block; width: 100%; aspect-ratio: 1.05 / 1; object-fit: cover; }
.phone-news-cover span { position: absolute; top: 0; left: 0; max-width: 100%; padding: 3px clamp(7px, 1.8vw, 13px); overflow: hidden; color: #fff; background: rgba(32, 48, 61, .62); font-size: 14px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.phone-news-card-content { display: flex; min-width: 0; flex-direction: column; }
.phone-news-card-content h2 { display: -webkit-box; overflow: hidden; color: #252c3b; font-size: clamp(16px, 3.733vw, 28px); font-weight: 500; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.phone-news-card-content h2 a { overflow-wrap: anywhere; }
.phone-news-card-content p { display: -webkit-box; margin-top: clamp(5px, 1.333vw, 10px); overflow: hidden; color: #7d8490; font-size: clamp(14px, 3.2vw, 24px); line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.phone-news-card-meta { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 5px; color: #a3a8b0; font-size: 14px; line-height: 1.35; }
.phone-news-card-meta span { min-width: 0; overflow: hidden; color: #078af0; text-overflow: ellipsis; white-space: nowrap; }
.phone-news-card-meta time { flex: 0 0 auto; white-space: nowrap; }
.phone-news-empty { padding: clamp(26px, 7vw, 52px) 16px; border-radius: 14px; background: #fff; color: #747d8b; text-align: center; }
.phone-news-empty p { font-size: clamp(14px, 3.2vw, 24px); }
.phone-news-empty p + p { margin-top: 10px; }
.phone-news-empty a { color: var(--phone-blue); }
.phone-news-empty span { margin: 0 8px; }

.phone-news-more { min-height: clamp(52px, 13vw, 98px); text-align: center; }
.phone-news-more button { display: inline-flex; min-height: 40px; align-items: center; gap: 10px; padding: 7px 18px; border: 0; color: #a0a5ae; background: transparent; cursor: pointer; font-size: clamp(14px, 3.2vw, 24px); }
.phone-news-more button[hidden] { display: none; }
.phone-news-more button i { display: block; width: 16px; height: 16px; border: 3px dotted #21a8ff; border-radius: 50%; }
.phone-news-more button.is-loading i { animation: phone-news-spin .85s linear infinite; }
.phone-news-more p { min-height: 22px; color: #8d949f; font-size: 14px; }
@keyframes phone-news-spin { to { transform: rotate(360deg); } }

.phone-news-sidebar { display: grid; gap: clamp(16px, 4.267vw, 32px); margin-top: clamp(17px, 4.267vw, 32px); }
.phone-news-side-card { padding: clamp(20px, 4.8vw, 36px); border-radius: clamp(16px, 4.267vw, 32px); background: #fff; }
.phone-news-side-card h2 { padding-bottom: clamp(8px, 2.133vw, 16px); border-bottom: 1px solid #e0e3e7; color: #303746; font-size: clamp(20px, 4.267vw, 32px); font-weight: 500; line-height: 1.35; }
.phone-news-side-card ul { display: grid; gap: clamp(10px, 2.4vw, 18px); margin-top: clamp(12px, 3.2vw, 24px); }
.phone-news-side-card li { min-width: 0; color: #7e8591; font-size: clamp(14px, 3.2vw, 24px); line-height: 1.45; }
.phone-news-side-card li a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.phone-news-hot-tags { display: flex; flex-wrap: wrap; gap: clamp(9px, 2.4vw, 18px); margin-top: clamp(12px, 3.2vw, 24px); }
.phone-news-hot-tags span { display: inline-flex; min-height: clamp(34px, 8.533vw, 64px); align-items: center; padding: 6px clamp(10px, 2.667vw, 20px); border: 1px solid #dfe3e9; border-radius: clamp(6px, 1.6vw, 12px); color: #7d8490; background: #fff; font-size: clamp(14px, 3.067vw, 23px); line-height: 1.3; }

@media (max-width: 359px) {
  .phone-news-content { padding-right: 14px; padding-left: 14px; }
  .phone-news-tabs { gap: 3px; }
  .phone-news-tab { font-size: 14px; }
  .phone-news-card { grid-template-columns: 104px minmax(0, 1fr); gap: 10px; }
  .phone-news-card-content p { -webkit-line-clamp: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .phone-news-more button.is-loading i { animation: none; }
}