/* 全局和容器样式 */
body {
  height: 100vh;
  display: flex;
  flex-direction: column;
  color: #333;
  line-height: 1.6;
  overflow-y: auto;
}

body * {
  font-family: Alibaba-Xi;
}
.hero {
  background-image: url("https://oss.allintrip.cn/shanwentou/upfiles/onepage/bannernew.jpg?x-oss-process=image/quality,q_85/format,jpg");
}
.hero-d {
  background-image: url("https://oss.allintrip.cn/shanwentou/upfiles/onepage/bannerdj.png?x-oss-process=image/quality,q_85/format,jpg");
  flex-direction: column;
  background-size: cover;
  background-position: center;
  padding: 6vw 0 3rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  animation: heroFadeIn 1.5s ease-out;
}
.hero-d .container {
  flex-direction: column;
  text-align: center;
  color: #fff;
  animation: contentSlideUp 1s ease-out 0.3s both;
}
.hero-d h1 {
  font-family: Alibaba-Xi;
  font-size: 6rem;
  font-weight: 400;
  line-height: 1;
  margin: 0 0 30px 0;
  color: #fff;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
  letter-spacing: 2px;
  animation: titleFadeIn 1.2s ease-out 0.5s both;
}
.header-bg {
  width: 100%;
  background-color: #e2e3e4;
  height: 60vh;
  min-height: 60vh;
  height: auto;
  background-position: bottom;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden; /* 防止模糊层溢出 */
}
.newsBg {
  width: 100%;
  background-color: #e2e3e4;
  height: 100%;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  z-index: 999;
}
.header-bg:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  pointer-events: none;
  backdrop-filter: blur(5px);
}

.detail-container {
  flex: 1;
  max-width: 1100px;
  margin: 2rem auto;
  padding: 40px 60px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  border-radius: 8px;
}
.bannerImg {
  width: 75%;
  aspect-ratio: 3/2;
  margin: 0 auto 1rem;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* img {
    width: 100%;
    height: 300px;
    object-fit: cover;
  } */
}
/* 面包屑导航 */
.breadcrumb {
  font-size: 14px;
  color: #888;
  margin-bottom: 30px;
}

.breadcrumb a {
  color: #555;
  text-decoration: none;
  transition: color 0.3s;
}

.breadcrumb a:hover {
  color: var(--primary-color);
}

/* 新闻头部 */
.news-header {
  text-align: center;
  margin-bottom: 20px;
}

.news-title-detail {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 15px;
  color: #222;
}

.news-meta-detail {
  font-size: 14px;
  color: #999;
}

.news-meta-detail span {
  margin: 0 15px;
}

/* 分割线 */
.divider {
  border: 0;
  height: 1px;
  background-color: #eee;
  margin: 30px 0;
}

/* 新闻正文 */
.news-content-detail {
  font-size: 16px;
  line-height: 1.8;
}

/* 覆盖富文本内联字号，统一按容器字号渲染 */
.news-content-detail *,
.news-content-detail [style*="font-size"],
.news-content-detail font,
.news-content-detail span,
.news-content-detail p,
.news-content-detail div,
.news-content-detail h1,
.news-content-detail h2,
.news-content-detail h3,
.news-content-detail h4,
.news-content-detail h5,
.news-content-detail h6 {
  font-size: 1em !important;
  line-height: inherit !important;
}
.focusbox {
  /* width: 1200px !important; */
  width: 100% !important;
  min-height: 500px !important;
  height: auto !important;
}
.focusbox ul {
  min-height: 500px !important;
  height: auto !important;
  max-width: 100% !important;
  width: 100% !important;
}
/* 字体大小切换 */
.font-size-control {
  margin-top: 12px;
  display: inline-flex;
  gap: 8px;
}

.font-size-control .font-btn {
  padding: 4px 10px;
  font-size: 14px;
  line-height: 1.2;
  color: #666;
  border: 1px solid #e5e6eb;
  background: #fff;
  border-radius: 16px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.font-size-control .font-btn:hover {
  color: var(--primary-color);
  border-color: var(--primary-color);
}

.font-size-control .font-btn.active {
  color: #fff;
  background: var(--primary-color);
  border-color: var(--primary-color);
}

/* 应用在正文容器上的字体大小类 */
.news-content-detail.font-small {
  font-size: 1rem;
}
.news-content-detail.font-medium {
  font-size: 1.5rem;
}
.news-content-detail.font-large {
  font-size: 2rem;
}

.news-content-detail p {
  margin-bottom: 25px;
}

.news-content-detail img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 30px auto;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* 上一篇/下一篇导航 */
.news-navigation {
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  font-size: 1rem;
  gap: 2rem;
}

.news-navigation a {
  color: #a0a0a0;
  text-decoration: none;
  transition: color 0.3s;
}

.news-navigation a:hover {
  color: var(--primary-color);
}

/* 返回列表按钮 */
.back-to-list {
  text-align: center;
  margin-top: 40px;
}

.back-to-list a {
  display: inline-block;
  padding: 12px 30px;
  background-color: var(--primary-color);
  color: #fff;
  text-decoration: none;
  border-radius: 25px;
  transition: background-color 0.3s, transform 0.3s;
  font-size: 16px;
}

.back-to-list a:hover {
  background-color: var(--primary-color-hover);
  transform: translateY(-2px);
}

/* 加载状态样式 */
.loading-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
}

.loading-spinner {
  width: 40px;
  height: 40px;
  border: 4px solid #f3f3f3;
  border-top: 4px solid var(--primary-color);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 20px;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.loading-state p {
  color: #666;
  font-size: 16px;
  margin: 0;
}

/* 错误状态样式 */
.error-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
}

.error-icon {
  font-size: 48px;
  margin-bottom: 20px;
}

.error-state h3 {
  color: #dc3545;
  margin-bottom: 15px;
  font-size: 24px;
}

.error-state p {
  color: #666;
  font-size: 16px;
  margin-bottom: 30px;
  max-width: 400px;
}

.retry-btn {
  background-color: var(--primary-color);
  color: #fff;
  border: none;
  padding: 12px 30px;
  border-radius: 25px;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.3s, transform 0.3s;
}

.retry-btn:hover {
  background-color: var(--primary-color-hover);
  transform: translateY(-2px);
}

/* 响应式设计 */
@media (max-width: 768px) {
  .detail-container {
    max-width: 100%;
    padding: 25px;
  }

  .news-title-detail {
    font-size: 24px;
  }

  .news-meta-detail span {
    display: block;
    margin: 5px 0;
  }

  .news-navigation {
    flex-direction: column;
    gap: 10px;
  }

  .loading-state,
  .error-state {
    padding: 40px 20px;
  }

  .error-state h3 {
    font-size: 20px;
  }
}
.carousel {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 420px;
  overflow: hidden;
}

.slides {
  width: 100%;
  height: 100%;
  min-height: 420px;
  position: relative;
}

.slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 420px;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 0.5s ease;
}

.slide.active {
  opacity: 1;
}

.carousel .nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background 0.2s ease, transform 0.2s ease;
}

.carousel .nav.prev {
  left: 12px;
}

.carousel .nav.next {
  right: 12px;
}

.carousel .nav:hover {
  background: rgba(0, 0, 0, 0.5);
  transform: translateY(-50%) scale(1.05);
}

.carousel .dots {
  position: absolute;
  bottom: 12px;
  left: 0;
  right: 0;
  display: flex;
  gap: 12px;
  justify-content: center;
}

.carousel .dot {
  width: 12px;
  max-width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.6);
  border: 0;
  margin: 0;
  cursor: pointer;
}

.carousel .dot.active {
  background: #d81e06;
}

/* 悬浮分享按钮 */
.share-floating {
  position: fixed;
  right: 24px;
  bottom: 20vh;
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 1000;
}

.share-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid #e5e6eb;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.share-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.16);
}

/* 极简线性图标：单色，移除彩色底圈 */
.share-wechat {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024' version='1.1'><path d='M711.9744 335.6032c5.19424 0 10.28992 0.09728 15.38816 0.34176C700.40704 189.1712 548.79616 76.8 365.80608 76.8 163.75552 76.8 0 213.7728 0 382.74688 0 481.8112 56.28416 569.90208 143.58656 625.792c1.12896 0.7104 3.35744 2.10816 3.35744 2.10816l-35.35616 110.73024 132.2432-67.36c0 0 4.13952 1.19936 6.22208 1.78944 36.36224 10.11968 75.29856 15.6096 115.75296 15.6096 8.25728 0 16.4416-0.31872 24.57728-0.76032-7.49696-23.25504-11.61472-47.73376-11.61472-72.99584C378.76864 460.66432 527.9936 335.6032 711.9744 335.6032zM493.09952 227.64032c28.37504 0 51.3344 22.24896 51.3344 49.74336 0 27.44192-22.95808 49.7408-51.3344 49.7408-28.39808 0-51.35616-22.29888-51.35616-49.7408C441.74208 249.88928 464.70144 227.64032 493.09952 227.64032zM238.51136 327.12448c-28.37248 0-51.35616-22.29888-51.35616-49.7408 0-27.4944 22.98368-49.74336 51.35616-49.74336 28.40064 0 51.40992 22.24896 51.40992 49.74336C289.92128 304.8256 266.912 327.12448 238.51136 327.12448z' fill='%23969696'></path><path d='M405.67424 616.72704c0 142.75328 138.39232 258.48192 309.09312 258.48192 34.1568 0 67.04128-4.65408 97.76768-13.23008 1.76384-0.4672 5.24416-1.52064 5.24416-1.52064l111.68384 56.9472-29.8432-93.5552c0 0 1.91232-1.19936 2.84288-1.78688 73.70496-47.2192 121.29024-121.60896 121.29024-205.33632 0-142.73152-138.34496-258.43456-308.9856-258.43456C544.06656 358.29248 405.67424 473.99552 405.67424 616.72704zM778.8672 527.7056c0-23.17952 19.40608-41.97248 43.37024-41.97248 24.0128 0 43.42016 18.79296 43.42016 41.97248 0 23.22944-19.40864 42.048-43.42016 42.048C798.27328 569.7536 778.8672 550.93504 778.8672 527.7056zM563.79136 527.7056c0-23.17952 19.4304-41.97248 43.39456-41.97248 23.98976 0 43.42016 18.79296 43.42016 41.97248 0 23.22944-19.4304 42.048-43.42016 42.048C583.22176 569.7536 563.79136 550.93504 563.79136 527.7056z' fill='%23969696'></path></svg>");
}

.share-weibo {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024' version='1.1'><path d='M726.973608 502.538511c-34.789341-6.760984-17.886369-25.464975-17.886369-25.464975s34.026978-56.002478-6.706749-96.79044c-50.495044-50.439786-173.186388 6.434549-173.186388 6.434549-46.827515 14.559601-34.408671-6.598278-27.810393-42.697451 0-42.424228-14.518668-114.294093-139.309836-71.815629-124.709303 42.642193-231.751225 192.216813-231.751225 192.216813-74.487481 99.298564-64.591087 176.076204-64.591087 176.076204 18.567891 169.477926 198.678992 216.046544 338.765517 227.061412 147.380652 11.615549 346.304214-50.821479 406.614811-178.911786C871.422488 560.284703 761.818207 509.518482 726.973608 502.538511L726.973608 502.538511zM415.431106 819.736826c-146.275481 6.816243-264.550235-66.526159-264.550235-164.188456 0-97.716532 118.274754-176.13044 264.550235-182.838212 146.425907-6.760984 264.919648 53.602825 264.919648 151.101393C680.350754 721.474872 561.803801 813.084313 415.431106 819.736826L415.431106 819.736826zM415.431106 819.736826' fill='%23969696'></path><path d='M386.285299 537.055652c-147.202597 17.231453-130.162502 155.082054-130.162502 155.082054s-1.526773 43.678802 39.452547 65.872267c86.102007 46.622854 174.74079 18.376533 219.550345-39.479153C559.94957 660.729369 533.611715 519.988951 386.285299 537.055652L386.285299 537.055652zM349.15054 730.527039c-27.482935 3.27151-49.622164-12.596899-49.622164-35.552727 0-22.902616 19.657712-46.895053 47.140647-49.785893 31.573089-2.944052 52.103682 15.268752 52.103682 38.225603C398.772704 706.261379 376.469746 727.419258 349.15054 730.527039L349.15054 730.527039zM435.853228 656.69345c-9.296737 6.925736-20.775162 5.944386-25.656333-2.399653-5.15337-8.124028-3.217275-21.157879 6.216585-27.974122 10.906397-8.124028 22.221094-5.779633 27.1565 2.345418C448.503339 636.953873 444.959629 649.495514 435.853228 656.69345L435.853228 656.69345zM435.853228 656.69345' fill='%23969696'></path><path d='M798.625508 442.882829c11.83249 0 21.921265-8.723685 23.610744-20.230764 0.217964-0.817622 0.327458-1.581008 0.327458-2.562359 17.994839-161.571862-132.398426-133.76147-132.398426-133.76147-13.360286 0-24.047696 10.796904-24.047696 24.26566 0 13.249769 10.68741 24.047696 24.047696 24.047696 108.023272-23.829731 84.193541 84.192517 84.193541 84.192517C774.359848 432.19542 785.210987 442.882829 798.625508 442.882829L798.625508 442.882829zM798.625508 442.882829' fill='%23969696'></path><path d='M781.066597 160.855548c-51.966559-12.215206-105.405655-1.744737-120.401184 1.14508-1.199315 0.10847-2.290159 1.199315-3.325745 1.417279-0.490164 0.109494-0.87288 0.654916-0.87288 0.654916-14.72333 4.199649-25.520233 17.831111-25.520233 34.026978 0 19.249413 15.595186 35.062564 35.063587 35.062564 0 0 18.920932-2.508123 31.736818-7.579629 12.759605-5.125741 120.401184-3.815909 173.895539 86.047772 29.227672 65.545832 12.868075 109.387339 10.796904 116.475781 0 0-6.925736 17.013489-6.925736 33.80799 0 19.357883 15.595186 31.518854 34.95307 31.518854 16.140609 0 29.718859-2.181689 33.69952-29.556153l0.217964 0C1001.802954 272.532023 874.149599 182.557826 781.066597 160.855548L781.066597 160.855548zM781.066597 160.855548' fill='%23969696'></path></svg>");
}

.share-link {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><ellipse cx='8.8' cy='13.2' rx='4.8' ry='3.2' transform='rotate(-35 8.8 13.2)'/><ellipse cx='15.2' cy='10.8' rx='4.8' ry='3.2' transform='rotate(-35 15.2 10.8)'/></svg>");
}

/* 微信弹窗 */
.share-wechat-modal {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1100;
}

.share-wechat-card {
  background: #fff;
  width: 320px;
  padding: 16px 16px 20px;
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
  text-align: center;
}

.share-wechat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 600;
  margin-bottom: 10px;
}

.share-wechat-close {
  border: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
  background: #f2f3f5;
}

.share-wechat-card img {
  width: 240px;
  height: 240px;
  object-fit: contain;
  margin: 8px auto 10px;
}

.share-wechat-tip {
  color: #666;
  font-size: 14px;
  margin: 0;
}

/* 微信内分享引导层 */
.wechat-guide {
  position: fixed;
  inset: 0;
  z-index: 1200;
}

.wechat-guide-mask {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
}

.wechat-guide-tip {
  position: absolute;
  right: 16px;
  top: 16px;
  color: #fff;
  background: rgba(0, 0, 0, 0.75);
  padding: 10px 12px;
  border-radius: 8px;
  max-width: 70vw;
}

@media (max-width: 768px) {
  .share-floating {
    right: 12px;
    bottom: 16vh;
  }

  .share-btn {
    width: 42px;
    height: 42px;
    background-size: 20px 20px;
  }
}