:root {
  --theme-blue: #0f67ff;
  --theme-blue-deep: #014bc1;
  --theme-bg: #f6fbff;
  --panel-bg: #ffffff;
  --text-main: #1f2b3a;
  --text-sub: #6c798a;
  --border-color: #d6dfea;
  --shadow: 0 14px 32px rgba(22, 54, 113, 0.08);
  --radius-lg: 18px;
  --radius-md: 14px;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  font-family: "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  background: var(--theme-bg);
  color: var(--text-main);
}

body {
  min-width: 320px;
}

img {
  display: block;
  max-width: 100%;
}

figure {
  margin: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

.domPc {
  display: block;
}

.domMobile {
  display: none;
}

.page {
  overflow-x: hidden;
}

.bannerPc {
  height: 600px;
  background: #0d57dd url("https://www.news.cn/digital/aiwl/index/img/banner.png") center top / cover no-repeat;
}

.bannerMobile img {
  width: 100%;
  height: auto;
}

.pageMain {
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
  padding: 28px 0 72px;
}

.intro {
  background: var(--panel-bg);
  padding: 24px 32px;
  margin-bottom: 28px;
}

.introTitle {
  margin: 0;
  font-size: 36px;
  line-height: 1.35;
  color: #1858da;
  text-align: center;
}

.introDesc {
  max-width: 860px;
  margin: 14px auto 0;
  font-size: 16px;
  line-height: 1.9;
  color: var(--text-sub);
  text-align: center;
}

.section {
  margin-top: 80px;
  /* padding: 26px 28px 30px; */
}

.sectionTitle {
  margin-bottom: 22px;
}

.sectionTitle img {
  width: 100%;
  height: auto;
}

.sectionFocus {
  overflow: hidden;
}

.focusSliderWrap {
  position: relative;
  height: 428px;
  /* padding: 34px 76px 70px;
  background: linear-gradient(180deg, #f8fbff 0%, #eef5ff 100%); */
  overflow: visible;
}

.focusSliderBg {
  position: absolute;
  left: 50%;
  right: 0;
  bottom: 0;
  width: min(1080px, 100%);
  height: 220px;
  transform: translateX(-50%);
  background: url("https://www.news.cn/digital/images/focus-bg.png") center bottom / contain no-repeat;
  pointer-events: none;
  opacity: 0.96;
}

.memberSliderWrap,
.interviewWrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
}

.focusSlider,
.memberSlider,
.interviewSlider {
  width: 100%;
  overflow: hidden;
}

.focusSlider {
  position: relative;
  z-index: 1;
}

.navBtn {
  position: relative;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border: 1px solid #c6d7fb;
  border-radius: 50%;
  background: linear-gradient(180deg, #ffffff 0%, #edf4ff 100%);
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.navBtn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(10, 81, 214, 0.12);
}

.navBtn::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  border-top: 2px solid var(--theme-blue);
  border-right: 2px solid var(--theme-blue);
  margin: -5px 0 0 -3px;
}

.navPrev::before {
  transform: rotate(-135deg);
}

.navNext::before {
  transform: rotate(45deg);
  margin-left: -7px;
}

.focusSliderWrap .navBtn {
  position: absolute;
  top: 50%;
  z-index: 5;
  width: 45px;
  height: 45px;
  margin-top: -22px;
  background: #3b5efa;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.focusSliderWrap .navBtn:hover {
  transform: none;
  box-shadow: none;
  background: #2a4de8;
}

.focusSliderWrap .navPrev {
  left: 0;
}

.focusSliderWrap .navNext {
  right: 0;
}

.focusSliderWrap .navBtn::before {
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -3px;
  border-top-color: #fff;
  border-right-color: #fff;
}
.focusSliderWrap .navNext::before {
  margin-left: -7px;
}
.focusCard {
  position: relative;
  width: 890px;
  height: 380px;
  overflow: visible;
}

.focusPoster,
.cardThumb,
.enterpriseVisual,
.miniVisual,
.leaderPhoto,
.interviewMedia {
  position: relative;
  overflow: hidden;
}

.focusPoster {
  position: absolute;
  left: 0;
  top: 50%;
  width: 220px;
  height: 320px;
  padding: 30px 15px;
  transform: translateY(-50%);
  color: #fff;
  display: none;
  z-index: 4;
  background: #3b5efa;
}

.focusPoster::after,
.cardThumb::after,
.enterpriseVisual::after,
.miniVisual::after,
.leaderPhoto::after,
.interviewMedia::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 22%, rgba(255, 255, 255, 0.34), transparent 26%),
    linear-gradient(135deg, transparent 0%, rgba(255, 255, 255, 0.12) 100%);
  pointer-events: none;
}

.cardThumb > a,
.enterpriseVisual > a,
.miniVisual > a,
.leaderPhoto > a,
.interviewMedia > a,
.memberAvatar > a {
  display: block;
  width: 100%;
  height: 100%;
}

.cardThumb img,
.enterpriseVisual img,
.miniVisual img,
.leaderPhoto img,
.interviewMedia img,
.memberAvatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.posterBlue {
  background: #3b5efa;
  box-shadow: 0 8px 20px rgba(10, 81, 214, 0.5);

}

.posterTag,
.cardLabel,
.highlightTag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  font-size: 12px;
  letter-spacing: 0.06em;
}

.focusPoster h3,
.infoCard h3,
.leaderCard h3,
.leaderHighlightInfo h3,
.enterpriseCaption h3,
.enterpriseItem h3,
.memberCard h3,
.techCard h3,
.interviewCard h3 {
  margin: 0;
  font-size: 20px;
  line-height: 1.45;
}

.focusPoster h3 {
  margin-top: 0;
  font-size: 18px;
  line-height: 1.35;
  max-height: 74px;
  overflow: hidden;
  display: -webkit-box;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.focusPoster h3 a {
  color: #fff;
}

.focusPoster p,
.infoCard p,
.leaderHighlightInfo p,
.enterpriseCaption p,
.enterpriseItem p,
.memberCard p,
.interviewCard p {
  margin: 10px 0 0;
  font-size: 14px;
  line-height: 1.8;
}

.focusPoster .posterTag {
  width: fit-content;
  min-height: 28px;
  margin-bottom: 16px;
  background: rgba(255, 255, 255, 0.16);
}

.focusPoster .focusDesc {
  margin-top: 18px;
  height: 126px;
  overflow: hidden;
  font-size: 14px;
  line-height: 1.8;
}

.focusPoster .focusMore {
  position: absolute;
  left: 20px;
  bottom: 30px;
  min-width: 96px;
  height: 24px;
}

.focusPoster .focusMore a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 96px;
  height: 24px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.42);
  color: #fff;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

.focusSummary {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  overflow: hidden;
  border-radius: 10px;
}

.focusSummary::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 24, 58, 0.04), rgba(10, 24, 58, 0.18));
  pointer-events: none;
}

.focusSlider .swiper-slide-active .focusSummary {
  position: absolute;
  top: 50%;
  right: 86px;
  width: 670px;
  height: 376px;
  padding: 5px;
  transform: translateY(-50%);
  background: linear-gradient(50deg, #005edd 0%, #cceeff 100%);
  z-index: 2;
  border-radius: 0;
  overflow: visible;
}

.focusSlider .swiper-slide-active .focusSummary::after {
  display: none;
}

.focusSummary a,
.focusSummary img {
  display: block;
  width: 100%;
  height: 100%;
}

.focusSummary img {
  object-fit: cover;
}

.focusSlider .swiper-slide {
  width: 960px;
  height: 380px;
  overflow: visible;
}

.focusSlider .swiper-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(14, 39, 103, 0.14));
  opacity: 1;
  transition: opacity 0.45s ease;
  pointer-events: none;
}

.focusSlider .swiper-slide-active::after {
  opacity: 0;
}

.focusSlider .swiper-slide-active .focusPoster,
.focusSlider .swiper-slide-active .focusSummary {
  display: block;
}

.focusMeta {
  position: absolute;
  left: 76px;
  right: 76px;
  bottom: 10px;
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.focusIndicator {
  display: flex;
  align-items: baseline;
  color: #1858da;
  font-weight: 700;
}

.focusCurrent {
  font-size: 26px;
  line-height: 1;
}

.focusDivider,
.focusTotal {
  font-size: 14px;
  color: #8ea6d3;
}

.focusDivider {
  margin: 0 6px;
}

.focusPagination {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.focusPagination .swiper-pagination-bullet {
  width: 24px;
  height: 4px;
  margin: 0;
  border-radius: 999px;
  background: rgba(59, 94, 250, 0.24);
  opacity: 1;
  transition: width 0.3s ease, background 0.3s ease;
}

.focusPagination .swiper-pagination-bullet-active {
  width: 54px;
  background: #3b5efa;
}

.gridCards {
  display: grid;
  gap: 18px;
}

.expertGrid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.expertSliderWrap {
  position: relative;
  /* padding: 0 56px 42px; */
}

.expertSlider {
  overflow: hidden;
}

.expertSlider .swiper-wrapper {
  align-items: stretch;
}

.expertSlider .swiper-slide {
  display: flex;
  height: auto;
  padding: 10px;
}

.expertSlider .infoCard {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 18px 18px 0 0;
  box-shadow: 0 0px 10px rgba(71, 88, 114, 0.16);
  background: #fff;
}

.expertSlider .cardThumb {
  height: 228px;
  border-radius: 18px 18px 0 0;
}

.expertSlider .cardThumb::after {
  display: none;
}

.expertSlider .infoCard h3,
.expertSlider .infoCard p {
  padding-left: 18px;
  padding-right: 18px;
}

.expertSlider .infoCard h3 {
  margin: 0;
  padding-top: 16px;
  padding-bottom: 16px;
  color: #333;
  font-size: 18px;
  line-height: 1.6;
  display: -webkit-box;
  overflow: hidden;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.expertSlider .infoCard p {
  display: none;
}

.expertSlider .infoCard h3 a {
  color: inherit;
}

.expertSliderWrap .navBtn {
  position: absolute;
  top: 50%;
  z-index: 4;
  margin-top: -21px;
}

.expertSliderWrap .expertPrev {
  left: 0;
}

.expertSliderWrap .expertNext {
  right: 0;
}

.expertPagination {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.expertPagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 0;
  border-radius: 50%;
  background: rgba(15, 103, 255, 0.4);
  opacity: 1;
  transition: width 0.25s ease, border-radius 0.25s ease, background 0.25s ease;
}

.expertPagination .swiper-pagination-bullet-active {
  width: 48px;
  border-radius: 999px;
  background: #0f67ff;
}

.infoCard,
.techCard {
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: #fff;
}

.infoCard {
  padding-bottom: 18px;
}

.cardDark {
  background: #101721;
  color: #fff;
}

.cardDark p {
  color: rgba(255, 255, 255, 0.78);
}

.cardThumb {
  height: 172px;
}

.thumbGold {
  background: linear-gradient(135deg, #080807 0%, #f0c342 100%);
}

.thumbForest {
  background: linear-gradient(135deg, #2466b4 0%, #6eba53 100%);
}

.thumbSky {
  background: linear-gradient(135deg, #7048ff 0%, #5fd7ff 100%);
}

.thumbSunrise {
  background: linear-gradient(135deg, #355da8 0%, #f5b252 100%);
}

.thumbFactory {
  background: linear-gradient(135deg, #49596f 0%, #a4c2dd 100%);
}

.thumbCastle {
  background: linear-gradient(135deg, #5f95dd 0%, #a7d6ff 100%);
}

.thumbNight {
  background: linear-gradient(135deg, #0f275c 0%, #2e89ff 100%);
}

.infoCard h3,
.infoCard p,
.techCard h3,
.techMeta {
  padding-left: 18px;
  padding-right: 18px;
}

.infoCard h3,
.techCard h3 {
  margin-top: 16px;
}

.leaderSliderWrap {
  position: relative;
  height: 538px;
}

.leaderSlider {
  height: 100%;
  overflow: hidden;
}

.leaderSlider .swiper-wrapper {
  height: 100%;
  align-items: center;
}

.leaderSlider .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  transition: transform 0.35s ease;
}

.leaderSlider .leaderCard {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
  overflow: hidden;
  border-radius: 0;
  background: #fff;
  border: 0;
  transition: transform 0.35s ease, background 0.35s ease, color 0.35s ease, box-shadow 0.35s ease;
}

.leaderSlider .swiper-slide-active .leaderCard {
  background: linear-gradient(180deg, #176fff 0%, #0b53d1 100%);
  color: #fff;
  box-shadow: 0 20px 40px rgba(18, 82, 206, 0.22);
}

.leaderSlider .swiper-slide-active .leaderPhoto {
  height: 368px;
}

.leaderSlider .leaderPhoto {
  height: 318px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  color: rgba(255, 255, 255, 0.86);
  font-size: 28px;
  font-weight: 700;
  letter-spacing: 0.1em;
}


.leaderCardBody {
  min-height: 96px;
  padding: 14px 16px 18px;
}

.leaderSlider .swiper-slide-active .leaderCardBody {
  min-height: 148px;
}

.leaderCard h3,
.leaderRole,
.leaderQuote {
  padding-left: 0;
  padding-right: 0;
}

.leaderCard h3 {
  margin: 0;
  color: #333;
  font-size: 18px;
  line-height: 1.35;
}

.leaderRole {
  margin: 8px 0 0;
  color: #4d4d4d;
  font-size: 14px;
  line-height: 1.5;
}

.leaderQuote {
  display: none;
  margin: 10px 0 0;
  color: rgba(255, 255, 255, 0.98);
  font-size: 18px;
  line-height: 1.6;
}

.leaderSlider .swiper-slide-active .leaderCard h3,
.leaderSlider .swiper-slide-active .leaderRole,
.leaderSlider .swiper-slide-active .leaderCard h3 a {
  color: #fff;
}

.leaderSlider .swiper-slide-active .leaderQuote {
  display: block;
}

.enterpriseLayout {
  display: flex;
  align-items: stretch;
  justify-content: center;
  flex-wrap: wrap;
  gap: 15px;
  width: min(1200px, 100%);
  margin: 0 auto;
}

.enterpriseMain,
.enterpriseCenter,
.enterpriseSide {
  flex: 0 0 390px;
  width: 390px;
  max-width: 390px;
}

.enterpriseVisual {
  height: 220px;
  background: linear-gradient(135deg, #0f67ff 0%, #79b8ff 100%);
}

.enterpriseMain {
  background: #0f67ff;
  color: #fff;
  border-radius: 16px 16px 0 0;
  overflow: hidden;
}

.enterpriseMain .enterpriseVisual {
  width: 100%;
}

.enterpriseMain .enterpriseVisual::after {
  display: none;
}

.enterpriseMain .enterpriseVisual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.enterpriseCaption {
  padding: 16px 18px 18px;
}

.enterpriseCaption h3 {
  margin: 0;
  color: #fff;
  font-size: 18px;
  line-height: 1.65;
}

.enterpriseCaption h3 a {
  color: inherit;
}

.enterpriseCenter {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.enterpriseSummary {
  padding: 8px 0 18px;
  border-bottom: 1px dotted var(--border-color);
}
.enterpriseSummary:last-child {
  border-bottom: none;
}
.enterpriseSummary + .enterpriseSummary {
  padding-top: 22px;
}

.enterpriseSummary h3 {
  margin: 0;
  color: #2d2d2d;
  font-size: 18px;
  line-height: 1.45;
}

.enterpriseSummary p {
  margin: 14px 0 0;
  color: #4d4d4d;
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: 0.01em;
  text-align: left;
}

.enterpriseSide {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.enterpriseItem {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-height: 90px;
}

.enterpriseItemBody {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.miniVisual {
  flex: 0 0 160px;
  width: 160px;
  height: 90px;
  min-height: 90px;
  border-radius: 10px;
  overflow: hidden;
}

.enterpriseItem .miniVisual::after {
  display: none;
}

.miniVisualA {
  background: linear-gradient(135deg, #3770d5 0%, #92b8ff 100%);
}

.miniVisualB {
  background: linear-gradient(135deg, #3f5c82 0%, #8bc9de 100%);
}

.miniVisualC {
  background: linear-gradient(135deg, #76502f 0%, #c5a060 100%);
}

.enterpriseItem h3 {
  margin: 0;
  font-size: 18px;
  color: #2f2f2f;
}

.enterpriseItem p {
  margin: 8px 0 0;
  color: #5a5a5a;
  font-size: 14px;
  line-height: 1.7;
}

.enterpriseItem.noImage .miniVisual {
  display: none;
}

.enterpriseItem.noImage .enterpriseItemBody {
  flex: 1 1 auto;
}

@media screen and (max-width: 1235px) {
  .enterpriseLayout {
    width: 100%;
    flex-direction: column;
    align-items: center;
  }

  .enterpriseMain,
  .enterpriseCenter,
  .enterpriseSide {
    flex: 0 1 100%;
    width: 100%;
    max-width: none;
  }
}

.memberSlider .swiper-slide {
  height: auto;
  display: flex;
}

.memberCard {
  --member-avatar-size: 200px;
  --member-hover-head-width: 160px;
  --member-frame-width: 180px;
  --member-hover-offset: 10px;
  --member-head-height: 68px;
  --member-head-image-gap: 12px;
  --member-frame-top: 8px;
  --member-frame-height: 318px;
  --member-frame-top-segment: 104px;
  --member-frame-bottom-segment: 30px;
  position: relative;
  width: 100%;
  min-height: 344px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 18px 0 22px;
  background: transparent;
  transition: background-color 0.28s ease, transform 0.28s ease;
}

.memberCard::before,
.memberCard::after {
  content: "";
  position: absolute;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.28s ease;
}

.memberCard::before {
  top: var(--member-frame-top);
  left: calc(50% - (var(--member-avatar-size) / 2) - var(--member-hover-offset));
  width: var(--member-frame-width);
  height: var(--member-frame-height);
  border-top: 2px solid #176fff;
  border-left: 2px solid #176fff;
  border-bottom: 2px solid #176fff;
}

.memberCard::after {
  top: var(--member-frame-top);
  left: calc(50% - (var(--member-avatar-size) / 2) - var(--member-hover-offset) + var(--member-frame-width) - 2px);
  width: 2px;
  height: var(--member-frame-height);
  background:
    linear-gradient(
      to bottom,
      #176fff 0,
      #176fff var(--member-frame-top-segment),
      transparent var(--member-frame-top-segment),
      transparent calc(100% - var(--member-frame-bottom-segment)),
      #176fff calc(100% - var(--member-frame-bottom-segment)),
      #176fff 100%
    );
}

.memberHead {
  width: var(--member-hover-head-width);
  min-height: var(--member-head-height);
  padding: 12px 10px 10px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  transition: background-color 0.28s ease, color 0.28s ease, transform 0.28s ease, align-items 0.28s ease;
}

.memberCard h3 {
  margin: 0;
  color: #333;
  font-size: 18px;
  line-height: 1.35;
}

.memberCard h3 a {
  color: inherit;
}

.memberCard p {
  margin: 4px 0 0;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: 12px;
  line-height: 1.5;
  transition: max-height 0.28s ease, opacity 0.22s ease;
}

.memberAvatar {
  width: var(--member-avatar-size);
  height: var(--member-avatar-size);
  margin-top: var(--member-head-image-gap);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #f1f1f5 0%, #dcdde2 100%);
  color: #c7708a;
  font-size: 32px;
  font-weight: 700;
  box-shadow: none;
  overflow: hidden;
}

.memberCard:hover::before,
.memberCard:hover::after,
.memberCard:focus-within::before,
.memberCard:focus-within::after {
  opacity: 1;
}

.memberCard:hover .memberHead,
.memberCard:focus-within .memberHead {
  background: #176fff;
  align-items: flex-start;
  text-align: left;
  transform: translateX(calc(((var(--member-avatar-size) - var(--member-hover-head-width)) / 2 + var(--member-hover-offset)) * -1));
}

.memberCard:hover h3,
.memberCard:hover h3 a,
.memberCard:focus-within h3,
.memberCard:focus-within h3 a {
  color: #fff;
}

.memberCard:hover p,
.memberCard:focus-within p {
  max-height: 40px;
  opacity: 1;
}

.techGrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.techCard {
  min-height: 210px;
  display: flex;
  align-items: stretch;
  gap: 10px;
  padding: 10px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, #f8fbff 0%, #edf4fb 100%);
  overflow: hidden;
  transition: background-color 0.28s ease, box-shadow 0.28s ease;
}

.techCard .cardThumb {
  flex: 0 0 340px;
  width: 340px;
  height: 190px;
  min-height: 190px;
  max-width: 100%;
  border-radius: 0;
}

.techCard .cardThumb::after {
  display: none;
}

.techMeta {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0;
  transition: background-color 0.28s ease, color 0.28s ease;
}

.techMeta h3 {
  margin: 0;
  color: #2f2f2f;
  font-size: 18px;
  line-height: 1.65;
}

.techMeta h3 a {
  color: inherit;
}

.techCard:hover,
.techCard:focus-within {
  background: #176fff;
  box-shadow: 0 12px 24px rgba(23, 111, 255, 0.18);
}

.techCard:hover .techMeta,
.techCard:focus-within .techMeta {
  background: #176fff;
}

.techCard:hover .techMeta h3,
.techCard:hover .techMeta h3 a,
.techCard:focus-within .techMeta h3,
.techCard:focus-within .techMeta h3 a {
  color: #fff;
}

.enlightenmentGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 26px;
}

.enlightenmentItem {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.enlightenmentThumb {
  flex: 0 0 280px;
  width: 280px;
  height: 160px;
  min-height: 160px;
  border-radius: 0;
  overflow: hidden;
}

.enlightenmentThumb::after {
  display: none;
}

.enlightenmentBody {
  flex: 1;
  min-width: 0;
  padding-top: 4px;
}

.enlightenmentBody h3 {
  margin: 0;
  color: #2d2d2d;
  font-size: 18px;
  line-height: 1.6;
}

.enlightenmentBody h3 a {
  color: inherit;
}

.enlightenmentBody p {
  margin: 8px 0 0;
  color: #666;
  font-size: 13px;
  line-height: 1.75;
}

.enlightenmentBody p a {
  color: #176fff;
}

.masterVisitWrap {
  position: relative;
  padding: 24px 0px 54px;
  overflow: hidden;
}

.masterVisitSlider {
  overflow: visible;
  padding: 24px 0 30px;
}

.masterVisitSlider .swiper-wrapper {
  align-items: center;
}

.masterVisitSlider .swiper-slide {
  height: auto;
  opacity: 0.48;
  transform: scale(0.82);
  transform-origin: center center;
  transition: transform 300ms ease, opacity 300ms ease;
  cursor: pointer;
}

.masterVisitSlider .swiper-slide-prev,
.masterVisitSlider .swiper-slide-next,
.masterVisitSlider .swiper-slide.is-side {
  opacity: 0.78;
  transform: scale(0.9);
}

.masterVisitSlider .swiper-slide-active,
.masterVisitSlider .swiper-slide.is-active {
  opacity: 1;
  transform: scale(1.22);
  z-index: 3;
}

.masterVisitCard {
  background: transparent;
}

.masterVisitMedia {
  height: 184px;
  overflow: hidden;
}

.masterVisitMedia::after {
  display: none;
}

.masterVisitBody {
  padding: 12px 0 0;
  text-align: center;
}

.masterVisitBody h3 {
  margin: 0;
  color: #2f2f2f;
  font-size: 18px;
  line-height: 1.5;
}

.masterVisitBody h3 a {
  color: inherit;
}

.masterVisitBody p {
  margin: 8px 0 0;
  color: #666;
  font-size: 13px;
  line-height: 1.6;
}

.masterVisitWrap .navBtn {
  top: 50%;
  margin-top: -60px;
  position: absolute;
  z-index: 10;
}

.masterVisitWrap .masterVisitPrev {
  left: 0;
}

.masterVisitWrap .masterVisitNext {
  right: 0;
}

.masterVisitPagination {
  position: absolute;
  left: 56px;
  right: 56px;
  bottom: 10px;
  text-align: center;
}

.masterVisitPagination .swiper-pagination-bullet {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: 0 4px;
  border-radius: 50%;
  background: rgba(23, 111, 255, 0.24);
  opacity: 1;
  transition: all 300ms ease;
}

.masterVisitPagination .swiper-pagination-bullet-active {
  width: 24px;
  border-radius: 99px;
  background: #176fff;
}

.interviewSlider .swiper-slide {
  height: auto;
}

.interviewCard {
  min-height: 100%;
  border-radius: var(--radius-md);
  border: 1px solid var(--border-color);
  background: #fff;
  overflow: hidden;
}

.interviewMedia {
  height: 200px;
}

.mediaBronze {
  background: linear-gradient(135deg, #8f7a45 0%, #d6c69b 100%);
}

.mediaAmber {
  background: linear-gradient(135deg, #a86a23 0%, #f2ca72 100%);
}

.mediaOlive {
  background: linear-gradient(135deg, #8c8f33 0%, #d9d18c 100%);
}

.mediaCopper {
  background: linear-gradient(135deg, #7f4b2d 0%, #d59b6f 100%);
}

.interviewCard h3,
.interviewCard p {
  padding-left: 18px;
  padding-right: 18px;
}

.interviewCard h3 {
  margin-top: 18px;
}

.interviewCard p {
  padding-bottom: 22px;
}

.interviewCardActive {
  box-shadow: 0 16px 32px rgba(170, 111, 36, 0.18);
}

.pageFooter {
  background: linear-gradient(90deg, #0f67ff 0%, #2f8df3 100%);
}

.footerInner {
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
  padding: 26px 0;
  text-align: center;
}

.footerInner p {
  margin: 0;
  font-size: 14px;
  
  color: rgba(255, 255, 255, 0.92);
}

@media screen and (max-width: 1024px) {
  .domPc {
    display: none !important;
  }

  .domMobile {
    display: block !important;
  }

  .pageMain,
  .footerInner {
    width: calc(100% - 24px);
  }

  .pageMain {
    padding: 16px 0 24px;
  }

  .intro,
  .section {
    border-radius: 16px;
  }

  .intro {
    padding: 18px 16px;
    margin-bottom: 18px;
  }

  .introTitle {
    font-size: 24px;
  }

  .introDesc {
    font-size: 14px;
    line-height: 1.75;
    text-align: left;
  }

  .section {
    margin-top: 16px;
    padding: 16px 0 18px;
  }

  .sectionTitle {
    margin-bottom: 16px;
  }

  .navBtn {
    flex-basis: 34px;
    width: 34px;
    height: 34px;
  }

  .memberSliderWrap,
  .interviewWrap {
    gap: 8px;
  }

  .techGrid {
    grid-template-columns: 1fr;
  }

  .leaderSlider .leaderCard {
    border-radius: 12px;
  }

  .leaderSlider .leaderPhoto {
    height: 280px;
  }

  .leaderSliderWrap {
    height: 456px;
  }

  .leaderSlider .swiper-slide-active .leaderPhoto {
    height: 320px;
  }

  .leaderCardBody {
    min-height: 118px;
    padding: 12px 14px 16px;
  }

  .leaderSlider .swiper-slide-active .leaderCardBody {
    min-height: 148px;
  }

  .leaderQuote {
    font-size: 12px;
  }

  .expertSliderWrap {
    padding: 0 0 42px;
  }

  .expertSlider .cardThumb {
    height: 192px;
  }

  .expertSlider .infoCard h3 {
    padding: 14px 14px 16px;
  }

  .expertSliderWrap .navBtn {
    top: auto;
    bottom: 2px;
    width: 34px;
    height: 34px;
    margin-top: 0;
  }

  .expertSliderWrap .expertPrev {
    left: 0;
  }

  .expertSliderWrap .expertNext {
    right: 0;
  }

  .expertPagination {
    left: 44px;
    right: 44px;
  }

  .focusSliderWrap {
    height: auto;
    padding: 18px 0 58px;
  }

  .focusSliderWrap .navBtn {
    top: auto;
    bottom: 8px;
    width: 34px;
    height: 34px;
    margin-top: 0;
  }

  .focusSliderWrap .navPrev {
    left: 0;
  }

  .focusSliderWrap .navNext {
    right: 0;
  }

  .focusSliderWrap .navBtn::before {
    width: 10px;
    height: 10px;
    margin-top: -5px;
  }

  .focusSlider .swiper-slide,
  .focusCard {
    width: 100%;
    height: auto;
  }

  .focusPoster {
    position: relative;
    left: auto;
    top: auto;
    bottom: auto;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 14px 14px 16px;
    transform: none;
    display: block;
    /* background: none; */
    box-shadow: none;
    /* color: #2f2f2f; */
  }

  .focusPoster h3,
  .enterpriseCaption h3 {
    font-size: 18px;
  }

  .focusPoster .posterTag,
  .focusPoster .focusDesc {
    display: none;
  }

  .focusPoster .focusMore {
    display: none;
  }

  .focusPoster h3 {
    max-height: none;
    overflow: visible;
    display: block;
    margin: 0;
    line-height: 1.6;
  }

  .focusPoster h3 a {
    color: inherit;
  }

  .focusSummary {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    width: 100%;
    height: auto;
    padding: 0;
    transform: none;
    background: none;
    border-radius: 12px 12px 0 0;
    overflow: hidden;
  }

  .focusSlider .swiper-slide-active .focusSummary {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    width: 100%;
    height: auto;
    padding: 0;
    transform: none;
    background: none;
    border-radius: 12px 12px 0 0;
    overflow: hidden;
  }

  .focusSummary::after,
  .focusSlider .swiper-slide-active .focusSummary::after {
    display: none;
  }

  .focusSummary a {
    display: block;
    aspect-ratio: 16 / 9;
  }

  .focusSummary img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 0;
  }

  .focusCard {
    display: flex;
    flex-direction: column-reverse;
    overflow: hidden;
    border-radius: 12px;
    background: #fff;
  }

  .focusMeta {
    left: 0;
    right: 0;
    bottom: 10px;
    justify-content: center;
    gap: 0;
    pointer-events: none;
  }

  .focusIndicator {
    display: none;
  }

  .focusPagination {
    flex: none;
    gap: 6px;
    justify-content: center;
    pointer-events: auto;
  }

  .focusPagination .swiper-pagination-bullet {
    width: 16px;
  }

  .focusPagination .swiper-pagination-bullet-active {
    width: 36px;
  }

  .expertPagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
  }

  .expertPagination .swiper-pagination-bullet-active {
    width: 28px;
  }

  .cardThumb {
    height: 156px;
  }

  .enterpriseLayout {
    gap: 18px;
  }

  .enterpriseMain,
  .enterpriseCenter,
  .enterpriseSide {
    width: 100%;
  }

  .enterpriseVisual {
    height: 220px;
  }

  .enterpriseSummary {
    padding: 2px 0 16px;
  }

  .enterpriseSummary + .enterpriseSummary {
    padding-top: 18px;
  }


  .enterpriseItem {
    gap: 10px;
  }

  .miniVisual {
    flex-basis: 160px;
    width: 160px;
    height: 90px;
    min-height: 90px;
  }

  .masterVisitWrap {
    padding: 22px 40px 52px;
  }

  .masterVisitSlider .swiper-slide {
    transform: scale(0.88);
  }

  .masterVisitSlider .swiper-slide-active,
  .masterVisitSlider .swiper-slide.is-active {
    transform: scale(1.14);
  }

  .masterVisitMedia {
    height: 166px;
  }


  .masterVisitWrap .navBtn {
    top: 43%;
  }

  .masterVisitPagination {
    left: 40px;
    right: 40px;
  }

  .memberCard {
    min-height: 344px;
    padding: 18px 0 22px;
  }

  .memberCard::before {
    height: var(--member-frame-height);
  }

  .memberHead {
    min-height: var(--member-head-height);
    padding: 12px 10px 10px;
  }

  .memberAvatar {
    width: var(--member-avatar-size);
    height: var(--member-avatar-size);
    margin-top: var(--member-head-image-gap);
    font-size: 28px;
  }

  .techGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .techCard {
    min-height: 176px;
    flex-direction: column;
  }

  .techCard .cardThumb {
    flex-basis: 260px;
    width: 100%;
    height: auto;
    flex: 0;
  }

  .techMeta {
    padding: 0;
  }


  .enlightenmentGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

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

  .enlightenmentThumb {
    width: 100%;
    height: auto;
    flex: 0;
    min-height: 220px;
  }

  .enlightenmentBody {
    padding-top: 0;
  }


  .interviewMedia {
    height: 160px;
  }

  .interviewCard h3 {
    font-size: 18px;
  }

  .footerInner {
    padding: 22px 0;
  }

  .footerInner p {
    letter-spacing: 0.18em;
  }
}

@media screen and (max-width: 640px) {
  .pageMain,
  .footerInner {
    width: calc(100% - 20px);
  }


  .focusPoster p,
  .infoCard p,
  .leaderCard p,
  .leaderHighlightInfo p,
  .enterpriseCaption p,
  .enterpriseItem p,
  .memberCard p,
  .interviewCard p {
    font-size: 13px;
  }

  .focusSliderWrap {
    padding-bottom: 54px;
  }

  .focusMeta {
    left: 38px;
    right: 38px;
  }

  .focusDivider,
  .focusTotal {
    font-size: 12px;
  }

  .focusPagination .swiper-pagination-bullet {
    width: 12px;
    height: 3px;
  }

  .focusPagination .swiper-pagination-bullet-active {
    width: 28px;
  }
    .expertSliderWrap,
    .expertSlider .swiper-slide {
      padding: 0;
    }
  .expertPagination {
    gap: 8px;
  }

  .expertSlider .cardThumb {
    height: 168px;
  }

  .expertSlider .infoCard {
    border-radius: 14px 14px 0 0;
    box-shadow: 0 8px 18px rgba(71, 88, 114, 0.14);
  }

  .expertSlider .infoCard h3 {
    padding: 12px 12px 14px;
  }

  .masterVisitWrap {
    padding: 18px 26px 46px;
    padding: 0 0 10px;
  }

  .masterVisitSlider .swiper-slide {
    opacity: 0.7;
    transform: scale(0.92);
  }

  .masterVisitSlider .swiper-slide-active,
  .masterVisitSlider .swiper-slide.is-active {
    transform: scale(1.08);
  }

  .masterVisitMedia {
    height: 156px;
  }

  .masterVisitBody {
    padding-top: 10px;
  }

  .masterVisitBody h3 {
    font-size: 14px;
    line-height: 1.45;
  }

  .masterVisitBody p {
    display: none;
  }

  .masterVisitWrap .navBtn {
    top: 39%;
    width: 34px;
    height: 34px;
    margin-top: -17px;
  }

  .masterVisitPagination {
    left: 26px;
    right: 26px;
    bottom: 6px;
  }

  .memberSliderWrap {
    gap: 8px;
  }

  .memberCard {
    min-height: 344px;
    padding: 18px 0 22px;
  }

  .memberCard::before {
    top: var(--member-frame-top);
    height: var(--member-frame-height);
  }

  .memberHead {
    min-height: var(--member-head-height);
    padding: 12px 10px 10px;
  }

  .memberAvatar {
    width: var(--member-avatar-size);
    height: var(--member-avatar-size);
    margin-top: var(--member-head-image-gap);
  }

  .techGrid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .techCard {
    min-height: auto;
    flex-direction: column;
  }

  .techCard .cardThumb {
    flex-basis: auto;
    width: 100%;
    height: 190px;
    min-height: 190px;
  }

  .techMeta {
    padding: 0;
  }
  .enlightenmentGrid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

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

  .enlightenmentThumb {
    width: 100%;
    height: auto;
    flex: 0;
  }

  .enlightenmentBody {
    padding-top: 0;
  }


  .enlightenmentBody p {
    font-size: 13px;
    line-height: 1.7;
  }

  .leaderSlider .leaderPhoto {
    height: 236px;
  }

  .leaderSliderWrap {
    height: 382px;
  }

  .leaderSlider .swiper-slide-active .leaderPhoto {
    height: 262px;
  }

  .leaderCardBody {
    min-height: 104px;
    padding: 10px 12px 14px;
  }

  .leaderSlider .swiper-slide-active .leaderCardBody {
    min-height: 136px;
  }


  .leaderRole,
  .leaderQuote {
    font-size: 12px;
  }

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

  .miniVisual {
    width: 100%;
    height: 180px;
    min-height: 180px;
    flex-basis: auto;
  }


  .enterpriseSummary p,
  .enterpriseItem p {
    line-height: 1.75;
  }

  .enterpriseItem.noImage {
    min-height: auto;
  }
}
