/* Isolated responsive layer for the public site. Desktop and About keep their existing systems. */
@media screen and (max-width: 980px) {
  body:not(.page-about) .w1200 {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    margin-right: auto !important;
    margin-left: auto !important;
    box-sizing: border-box !important;
  }

  body:not(.page-about) img,
  body:not(.page-about) video,
  body:not(.page-about) iframe {
    max-width: 100%;
  }

  body:not(.page-about) .z_footer {
    padding: 0 24px 18px;
    background-size: auto 100%;
  }

  body:not(.page-about) .z_footer_top {
    width: 100% !important;
    padding: 48px 0 28px;
    flex-wrap: wrap;
    gap: 24px;
  }

  body:not(.page-about) .z_footer_top .fl_warp {
    width: 100%;
    margin-right: 0;
  }

  body:not(.page-about) .z_footer_lt {
    align-items: center;
  }

  body:not(.page-about) .z_footer_desc {
    margin: 24px 0 0;
  }

  body:not(.page-about) .z_footer_desc p {
    flex-wrap: wrap;
    gap: 8px 20px;
  }

  body:not(.page-about) .z_footer_desc p a {
    padding: 0;
  }

  body:not(.page-about) .z_footer_top .erweima {
    width: 112px;
    margin-right: 16px;
  }

  body:not(.page-about) .z_footer_btm {
    width: 100% !important;
    padding: 20px 0 0;
    line-height: 1.8;
  }

  body:not(.page-about) .z_footer_copy {
    float: none;
  }
}

@media screen and (max-width: 768px) {
  body:not(.page-about) .w1200 {
    width: calc(100% - 32px) !important;
  }

  /* Home Banner: mobile asset first; desktop fallback stays fully visible. */
  .page-home .banner.home_lunbo {
    min-width: 0;
    width: 100%;
    margin-top: 55px;
    background: #f6f5f2;
    transition: height .25s ease;
  }

  .page-home .home_lunbo .swiper-slide {
    align-items: stretch;
    background: #f6f5f2;
  }

  .page-home .home_lunbo .swiper-slide::after,
  .page-home .home_lunbo .swiper-slide .swiper_video_wrap::after,
  .page-home #fireworksCanvas {
    display: none;
  }

  .page-home .home_lunbo .swiper_img-bg {
    display: none;
  }

  .page-home .home_lunbo .swiper_img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .page-home .home_lunbo .swiper_img-fallback {
    object-fit: contain;
  }

  .page-home .home_lunbo .swiper_video {
    object-position: center;
  }

  .page-home .home_lunbo .video-mute-hint {
    bottom: 22px;
    padding: 7px 14px;
    font-size: 12px;
  }

  .page-home .banner.home_lunbo .swiper-button-home-next,
  .page-home .banner.home_lunbo .swiper-button-home-prev {
    display: none !important;
  }

  .page-home .home_lunbo .swiper-pagination {
    bottom: 10px;
  }

  .page-home .news-quicknav-section,
  .page-home .course-recommend-section,
  .page-home .test-tools-section {
    padding: 36px 0 !important;
  }

  .page-home .news-card {
    padding: 0 !important;
  }

  .page-home .news-tab-bar {
    align-items: flex-start !important;
    gap: 12px;
  }

  .page-home .news-tab-left {
    display: block !important;
  }

  .page-home .news-main-title,
  .page-home .section-header .section-title,
  .page-home .test-tools-section .section-title h2 {
    font-size: 22px !important;
  }

  .page-home .news-tabs {
    width: 100%;
    margin-top: 20px !important;
    overflow-x: auto !important;
    scrollbar-width: none;
  }

  .page-home .news-tabs::-webkit-scrollbar {
    display: none;
  }

  .page-home .news-column:nth-child(n+2) {
    display: none !important;
  }

  .page-home .news-title {
    max-width: none !important;
  }

  .page-home .news-sidebar {
    border-bottom: 0 !important;
  }

  .page-home .sidebar-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-home .sidebar-card:hover {
    transform: none !important;
  }

  .page-home .sidebar-card .qrcode-panel {
    display: none !important;
  }

  .page-home .course-grid,
  .page-product .course-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    gap: 18px;
    min-height: 0;
  }

  .page-home .course-card,
  .page-product .course-card {
    border-radius: 12px;
  }

  .page-home .course-card:hover,
  .page-product .course-card:hover {
    transform: none;
  }

  .page-home .course-card-img {
    height: auto;
  }

  .page-home .course-card-img img {
    width: 100%;
    height: auto;
    aspect-ratio: auto;
    object-fit: initial;
  }

  .page-product .course-card-img img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
  }

  .page-home .section-header {
    flex-direction: row;
    align-items: center;
    margin-bottom: 24px;
  }

  .page-home .test-tools-section > div {
    width: calc(100% - 32px) !important;
    padding: 0 !important;
  }

  .page-home .tools-carousel-btn {
    display: none;
  }

  .page-home .tools-carousel-viewport {
    overflow: visible;
  }

  .page-home .tools-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    transform: none !important;
  }

  .page-home .tool-item {
    width: 100%;
  }

  .page-home .tool-card {
    border-radius: 12px;
  }

  .page-home .card-text {
    left: 22px;
    bottom: 22px;
  }

  .page-home .card-text h3 {
    font-size: 22px !important;
  }

  .page-home .card-icon {
    right: 22px;
    bottom: 22px;
  }

  .page-home .student-portal-wrapper {
    display: none;
  }

  /* Product list. */
  .page-product .category-tabs {
    justify-content: flex-start;
    gap: 8px;
    margin-top: 55px;
    margin-bottom: 12px;
    padding: 16px 0;
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
  }

  .page-product .category-tabs::-webkit-scrollbar {
    display: none;
  }

  .page-product .category-tabs a {
    flex: 0 0 auto;
    padding: 8px 12px;
  }

  .page-product .category-tabs a.active::after {
    bottom: -9px;
  }

  .page-product .course-section {
    padding: 24px 0 44px;
  }

  .page-product .course-section .section-title {
    margin-bottom: 22px;
  }

  /* News and case lists share a horizontally scrollable category bar. */
  .page-news .media,
  .page-cases .involve {
    padding-top: 55px;
  }

  .page-news .media_menu,
  .page-cases .involve_menu {
    width: 100% !important;
    height: auto;
    min-height: 64px;
    padding: 12px 16px;
    gap: 8px;
    overflow-x: auto;
    box-sizing: border-box;
    scrollbar-width: none;
  }

  .page-news .media_menu::-webkit-scrollbar,
  .page-cases .involve_menu::-webkit-scrollbar {
    display: none;
  }

  .page-news .media_item,
  .page-cases .involve_item {
    flex: 0 0 auto;
    padding: 7px 14px;
    font-size: 14px;
  }

  .page-news .media_con,
  .page-cases .involve_con {
    padding: 18px 0 56px;
  }

  .page-news .media_con .media_con_ul {
    padding: 0;
  }

  .page-news .media_con .media_con_ul li .aa {
    display: block;
    padding: 0 0 18px;
    margin-bottom: 20px;
    border-bottom: 1px solid #ededed;
    border-radius: 0;
    box-shadow: none;
  }

  .page-news .media_con .media_con_ul li .st_media_img {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    margin: 0 0 16px;
    border-radius: 10px;
  }

  .page-news .media_con .media_con_ul li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .page-news .media_con .media_con_ul li .st_media_text {
    width: 100%;
    margin-top: 0;
  }

  .page-news .media_con .media_con_ul li h3 {
    font-size: 17px;
    line-height: 1.55;
    -webkit-line-clamp: 2;
  }

  .page-news .media_con .media_con_ul li p {
    height: auto;
    margin-bottom: 14px;
    padding-top: 10px;
    -webkit-line-clamp: 2;
  }

  .page-cases .involve_con .involve_con_ul {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .page-cases .involve_con .involve_con_ul li {
    width: 100%;
    margin: 0;
    padding: 10px 10px 14px;
    box-sizing: border-box;
  }

  .page-cases .involve_con .involve_con_ul li .st_involve_img {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }

  .page-cases .involve_con .involve_con_ul li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .page-cases .involve_con .involve_con_ul li h3 {
    height: auto;
    padding-top: 16px;
  }

  /* Article and activity details. */
  .page-news-detail .media_detail {
    padding: 79px 0 48px;
  }

  .page-news-detail .media_daohang {
    overflow: hidden;
    white-space: nowrap;
  }

  .page-news-detail .media_daohang a {
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 4px;
    font-size: 12px;
  }

  .page-news-detail .media_daohang img {
    flex: 0 0 auto;
  }

  .page-news-detail .media_detail_con {
    margin-top: 16px;
    padding: 24px 18px;
    border-radius: 10px;
  }

  .page-news-detail .media_detail_con h3 {
    font-size: 21px;
    line-height: 1.5;
  }

  .page-news-detail .media_detail_con h6.date {
    margin: 12px 0 18px;
    font-size: 13px;
  }

  .page-news-detail .media_detail_con .media_detail_text {
    padding-top: 22px;
  }

  .page-news-detail .media_detail_con .media_detail_text p {
    font-size: 15px;
    line-height: 1.9;
  }

  .page-news-detail .media_detail_sxbtn {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .page-news-detail .media_detail_sxbtn_l,
  .page-news-detail .media_detail_sxbtn_r {
    width: 100%;
    height: auto;
    min-height: 52px;
    padding: 14px;
    line-height: 1.6;
    text-align: left;
    box-sizing: border-box;
  }

  .page-cases-detail .involved_detail_banner {
    margin-top: 79px !important;
  }

  .page-cases-detail .involved_detail_banner img {
    height: auto;
    aspect-ratio: 16 / 6;
    object-fit: cover;
    border-radius: 12px;
  }

  .page-cases-detail .involved_detail_list {
    margin-bottom: 70px;
  }

  .page-cases-detail .involved_detail_hdjs_con {
    padding: 34px 0;
  }

  .page-cases-detail .involved_hdjs_text {
    width: 100%;
  }

  .page-cases-detail .involved_detail_title h4 {
    font-size: 21px;
  }

  .page-cases-detail .involved_detail_zpss {
    margin: 48px 0;
  }

  .page-cases-detail .involved_detail_zpss_con ul {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .page-cases-detail .involved_detail_zpss_con ul li {
    width: 100%;
    margin: 0;
    padding: 10px 10px 22px;
    box-sizing: border-box;
  }

  .page-cases-detail .z_about_video {
    width: 100%;
    aspect-ratio: 16 / 9;
  }

  .page-cases-detail .z_video_pop .warp,
  .page-product-detail .z_video_pop .warp {
    width: calc(100% - 32px);
    height: auto;
    aspect-ratio: 16 / 9;
  }

  /* Product detail. */
  .page-product-detail .home_course {
    padding: 79px 0 48px;
  }

  .page-product-detail .home_course_con {
    display: block;
    padding: 24px 20px;
  }

  .page-product-detail .home_course_con .home_course_con_l,
  .page-product-detail .home_course_con .home_course_con_r {
    width: 100%;
  }

  .page-product-detail .home_course_con .home_course_con_l .course_h3 {
    font-size: 21px;
    line-height: 1.5;
  }

  .page-product-detail .home_course_con .home_course_con_l .course_date {
    margin: 10px 0 20px;
    font-size: 14px;
  }

  .page-product-detail .home_course_con .home_course_con_l .course_price {
    font-size: 30px;
  }

  .page-product-detail .home_course_con .home_course_con_r {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 22px;
  }

  .page-product-detail .home_course_con .home_course_con_r .course_btn {
    width: 116px;
    margin: 0;
    box-shadow: none;
  }

  .page-product-detail .home_course_con .home_course_con_r .course_renshu {
    font-size: 13px;
  }

  .page-product-detail .home_course .home_course_content_detail {
    display: block;
  }

  .page-product-detail .home_course .home_course_content_detail_l,
  .page-product-detail .home_course .home_course_content_detail_r {
    width: 100%;
    margin-left: 0;
  }

  .page-product-detail .home_course .home_course_content_detail_r {
    margin-top: 18px;
  }

  .page-product-detail .course_d_item {
    margin: 0 16px;
  }

  .page-product-detail .course_d_con .course_d_con_xx {
    padding: 20px 16px;
  }

  .page-product-detail .popup {
    width: calc(100% - 48px);
    max-width: 320px;
    box-sizing: border-box;
  }

  /* App page keeps its identity while removing desktop-only floats and widths. */
  .page-app .app {
    padding: 88px 0 48px;
    background-position: 36% center;
  }

  .page-app .app .main-bottom {
    padding-top: 0;
  }

  .page-app .app .main-bottom .item-main {
    display: flex;
    flex-direction: column;
    margin: 0;
  }

  .page-app .p1-part1 {
    float: none;
    margin-top: 0;
  }

  .page-app .p1-part1 .tit {
    margin-bottom: 22px;
  }

  .page-app .p1-part1 .tit h3 {
    font-size: 28px;
    line-height: 1.4;
  }

  .page-app .p1-part1 ul {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
  }

  .page-app .p1-part1 ul li {
    width: 100%;
    margin-bottom: 20px;
  }

  .page-app .p1-part1 ul li .font {
    float: none;
    width: 100%;
    box-sizing: border-box;
  }

  .page-app .p1-part1 ul li p {
    float: none;
    margin: 8px 14px 0;
    white-space: normal;
  }

  .page-app .popup-phoneDown {
    margin: 18px auto 0;
  }

  .page-app .item01 .bd {
    float: none;
    order: -1;
    width: min(78vw, 330px);
    height: auto;
    aspect-ratio: 400 / 670;
    margin: 0 auto 26px;
    background-size: contain;
  }

  /* Footer becomes a calm, centered mobile ending. */
  body:not(.page-about) .z_footer {
    padding: 0 16px 18px;
  }

  body:not(.page-about) .z_footer_top {
    justify-content: center;
    padding-top: 40px;
    gap: 22px 14px;
  }

  body:not(.page-about) .z_footer_lt {
    display: block;
    text-align: center;
  }

  body:not(.page-about) .z_footer_logo .logo {
    height: 46px;
    margin: 0 auto;
  }

  body:not(.page-about) .z_footer_tel {
    margin: 18px 0 0;
    padding: 0;
    border-left: 0;
    line-height: 1.8;
  }

  body:not(.page-about) .z_footer_desc p {
    justify-content: center;
  }

  body:not(.page-about) .z_footer_top .erweima {
    width: calc(50% - 18px);
    max-width: 128px;
    margin: 0;
  }

  body:not(.page-about) .erweima p {
    font-size: 13px;
  }

  body:not(.page-about) .z_footer_btm {
    text-align: center;
    font-size: 12px;
  }
}

@media screen and (min-width: 600px) and (max-width: 980px) {
  .page-home .course-grid,
  .page-product .course-grid,
  .page-cases .involve_con .involve_con_ul,
  .page-cases-detail .involved_detail_zpss_con ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-home .banner.home_lunbo,
  .page-home .tools-grid,
  .page-home .course-card,
  .page-product .course-card {
    transition: none !important;
  }
}