/* Keep the last pair full-width while preserving the three-column mobile rows. */
@media (max-width: 1023px) {
  .home-category-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .home-category-grid > .card-hover {
    grid-column: span 2;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    text-align: center;
  }
  .home-category-grid > .card-hover > .flex:first-child {
    width: 100%;
    min-height: 2.8em;
    align-items: center;
    justify-content: center;
  }
  .home-category-grid > .card-hover > .flex:last-child {
    order: -1;
    flex: 1;
    margin-top: 0;
    align-items: center;
  }
  .home-category-grid .home-category-title {
    margin: 0;
    text-align: center;
    white-space: normal;
    text-wrap: balance;
    overflow: visible;
    overflow-wrap: anywhere;
    line-height: 1.4;
  }
  .home-category-grid img { display: block; max-width: 100%; margin: 0 auto; }
  .home-category-grid > .card-hover:nth-last-child(2):nth-child(3n + 1),
  .home-category-grid > .card-hover:last-child:nth-child(3n + 2) { grid-column: span 3; }
}

 .box{margin:0px -10px;height:auto;overflow:hidden;display:flex;flex-wrap:wrap}
 .box a{width:calc(25% - 30px);margin:15px;float:left;text-align:center;box-shadow:1px 5px 5px 1px #eee;background-color:#fff}
 .box a img{max-width:240px;max-height:240px;margin:30px 0;display: inline-block;}
 .box a h2{font-size:20px;color:#3d3e40;font-weight:800;margin-bottom:30px}
 .box a span{border:1px solid #eee;padding:8px 0;display:inline-block;width:90%;margin-bottom:30px;color:#333}
 .box a:hover{background:#223643}
 .box a:hover h2{color:#fff}
 .box a:hover span{color: #fff}

/* 轮播容器基础样式 */
.banner-container {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.banner-container .owl-carousel {
  width: 100%;
}

.banner-container .item {
  position: relative;
  width: 100%;
}

.banner-container .item img {
  width: 100%;
  height: auto;
  display: block;
}

.banner-container .owl-nav button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 60px;
  height: 160px;
  border-radius: 9999px;
  background: rgba(0,0,0,0.4) !important;
  color: #fff !important;
  transition: all 0.3s;
}

/* 左 */
.banner-container .owl-nav .owl-prev {
  left: 20px;
}

/* 右 */
.banner-container .owl-nav .owl-next {
  right: 20px;
}

/* hover效果 */
.banner-container .owl-nav button:hover {
  background: #ef4444 !important; /* 红色 */
  transform: translateY(-50%) scale(1.1);
}

/* 去掉默认 outline */
.banner-container .owl-nav button:focus {
  outline: none;
}
/*  */
.banner-container .owl-nav {
  opacity: 0;
  transition: opacity 0.3s;
}

.banner-container:hover .owl-nav {
  opacity: 1;
}
/*  */
.banner-container .owl-dots{
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 5%;
}
.banner-container .owl-dots > .owl-dot{
	margin-right: 16px;
}
.banner-container .owl-dots .owl-dot span{
	width: 72px !important;
	height: 8px !important;
	background: #fff !important;
}
.banner-container .owl-dots  .active span{
	background: red !important;
}
.banner-container .owl-dots > .owl-dot.owl-dot:hover span{
	background: red !important;
}
/*  */
#bg-img{
  background-image: url("/static/about.webp");
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  padding: 242px 0px 242px 0px;
  position: relative;
}
#bg-img::after{
  content: " ";
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  position: absolute;
  background-color: black;
  opacity: 0.1;
}
#bg-img ul{
  padding:20px;
  margin: 0;
  position: relative;
  z-index: 2;
}
#bg-img li{
  list-style-type: none;
  text-align: center;
  color: #fff;
}
/*  */
@media (max-width: 1028px) {

  .grid.grid-cols-2 > div:last-child:nth-child(odd) {
      grid-column: span 2;
  }

}
/*  */
#bg-img{
  background-image: url("/static/i4.jpg");
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  position: relative;
}
#bg-img::after{
  content: " ";
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  position: absolute;
  background-color: black;
  opacity: 0.05;
}
#bg-img ul{
  padding:20px;
  margin: 0;
  position: relative;
  z-index: 2;
}
#bg-img li{
  list-style-type: none;
  text-align: center;
  color: #fff;
}
/*  */
@media (max-width: 1028px) {

  .grid.grid-cols-2 > div:last-child:nth-child(odd) {
      grid-column: span 2;
  }
	#bg-img{
		background-attachment: scroll;
		background-size: cover;
	}
  .banner-container .owl-nav button{
    width: 30px;
    height: 80px;
  }
  .banner-container .owl-dots{
    display: none;
  }

}