/* ==========================================
   1. 全局与基础样式
   ========================================== */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
li,
span,
div,
nav,
.c-menu,
.c-page_title,
.webfont1 {
  /*font-family: "SimSun", "宋体", "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", serif !important;*/
}


/* ===== Swiper 版心内满宽样式修正 ===== */
#bk80598725 .column,
#bk80598725 .c-none {
  width: 100% !important;
  display: block !important;
}

.swiper-container-custom {
  width: 100% !important;
  /*height: 768px;*/
  overflow: hidden;
  position: relative;
}

.swiper-container-custom .swiper-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

/* ===== 二级菜单基础样式支持 ===== */
.c-menu li {
  position: relative;
}

.dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #ffffff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  padding: 10px 0;
  list-style: none;
  z-index: 999;
  min-width: 160px;
  text-align: center;
  border-radius: 4px;
}

.dropdown-menu li {
  width: 100%;
}

.dropdown-menu li a {
  display: block;
  padding: 8px 16px !important;
  color: #333333 !important;
  font-size: 14px;
  text-decoration: none;
  transition: background-color 0.2s, color 0.2s;
}

.dropdown-menu li a:hover {
  background-color: #ebf2e6;
  color: #4a6b32 !important;
}

.c-menu li:hover .dropdown-menu {
  display: block;
}

/* ==========================================
   2. 主体布局与占位
   ========================================== */
.main-content-stream {
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* 小标题样式 */
.section-title {
  font-size: 20px;
  font-weight: bold;
  color: #333;
  margin-bottom: 5px;
  text-align: center;
}

/* 统一的图片占位基础样式 */
.img-placeholder {
  background-color: #f5f5f5;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  font-size: 15px;
  box-sizing: border-box;
  max-width: 1200px;
  margin: 50px auto;
}

/* 板块公共标题装饰样式 */
.section-divider-title {
  text-align: center;
  font-size: 20px;
  color: #4a6b32;
  font-weight: bold;
  letter-spacing: 2px;
  margin: 50px 0 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
}

.section-divider-title::before,
.section-divider-title::after {
  content: "";
  display: inline-block;
  width: 60px;
  height: 1px;
  background: radial-gradient(circle, #4a6b32 0%, rgba(255, 255, 255, 0) 100%);
}

/* ==========================================
   3. 福利养殖五大自由交互区域
   ========================================== */
#section2 {
  width: 100%;
}

#section2 .g-column {
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

#farm-interactive-row {
  display: flex;
  position: relative;
  width: 100%;
  min-height: 820px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  transition: background-image 0.4s ease-in-out;
}

/* 五张全宽大背景图路径 */
#farm-interactive-row.farm-bg-state-1 {
  background-image: url("https://cloud.shuntun.com/file/d7z2xYIqgrQm-4-ztWRtw.jpg?x-oss-process=image/format,webp");
}
#farm-interactive-row.farm-bg-state-2 {
  background-image: url("https://cloud.shuntun.com/file/vahujtwLHeU7zrg3K-jpq.jpg?x-oss-process=image/format,webp");
}
#farm-interactive-row.farm-bg-state-3 {
  background-image: url("https://cloud.shuntun.com/file/XueSW0U8bDb4pVJHS967Z.jpg?x-oss-process=image/format,webp");
}
#farm-interactive-row.farm-bg-state-4 {
  background-image: url("https://cloud.shuntun.com/file/kX8A72GuiYk-p6-BP916e.jpg?x-oss-process=image/format,webp");
}
#farm-interactive-row.farm-bg-state-5 {
  background-image: url("https://cloud.shuntun.com/file/ibf9T84WUvqUWd55GHE0X.jpg?x-oss-process=image/format,webp");
}

/* 每一列的默认样式 */
.farm-col {
  flex: 1;
  display: flex;
  background-color: rgba(0, 0, 0, 0.25);
  transition: all 0.35s cubic-bezier(0.25, 1, 0.5, 1);
  cursor: pointer;
  /*border-right: 1px solid rgba(255, 255, 255, 0.15);*/
}

.farm-col:last-child {
  border-right: none;
}

.farm-col-inner {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 40px 15px;
  box-sizing: border-box;
  position: relative;
}

.farm-icon-block {
  width: 128px;
  height: 128px;
  margin: 0 auto 15px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: background-image 0.3s ease;
}

/* 默认状态下的图标背景 */
.farm-col[data-bg-id="1"] .farm-icon-block { background-image: url("../picture/msjk.png"); }
.farm-col[data-bg-id="2"] .farm-icon-block { background-image: url("../picture/msbs.png"); }
.farm-col[data-bg-id="3"] .farm-icon-block { background-image: url("../picture/mssb.png"); }
.farm-col[data-bg-id="4"] .farm-icon-block { background-image: url("../picture/bdtx.png"); }
.farm-col[data-bg-id="5"] .farm-icon-block { background-image: url("../picture/mskj.png"); }

/* 鼠标移入卡片时，切换为高亮图标 */
.farm-col[data-bg-id="1"]:hover .farm-icon-block { background-image: url("../picture/msjk-1.png"); }
.farm-col[data-bg-id="2"]:hover .farm-icon-block { background-image: url("../picture/msbs-1.png"); }
.farm-col[data-bg-id="3"]:hover .farm-icon-block { background-image: url("../picture/mssb-1.png"); }
.farm-col[data-bg-id="4"]:hover .farm-icon-block { background-image: url("../picture/bdtx-1.png"); }
.farm-col[data-bg-id="5"]:hover .farm-icon-block { background-image: url("../picture/mskj-1.png"); }

/* 默认标题：白色 */
.farm-title {
  font-size: 16px;
  color: #ffffff;
  font-weight: 500;
  margin: 0;
  transition: color 0.3s;
}

/* 辅助文本和按钮 */
.hover-top-text {
  font-size: 12px;
  color: #4a6b32;
  margin-bottom: 30px;
  opacity: 0;
  transform: translateY(-10px);
  transition: all 0.3s ease;
  white-space: nowrap;
}

.hover-more-btn {
  font-size: 12px;
  color: #4a6b32;
  text-decoration: none;
  border-bottom: 1px solid #4a6b32;
  padding-bottom: 2px;
  margin-top: 40px;
  opacity: 0;
  transform: translateY(10px);
  transition: all 0.3s ease;
}

/* 核心交互：当鼠标移入该列时 */
.farm-col:hover {
  background-color: #f9f5e8 !important;
}

.farm-col:hover .farm-title {
  color: #4a6b32 !important;
  font-weight: 700;
}

.farm-col:hover .farm-icon-block {
  transform: scale(1.05);
}

.farm-col:hover .hover-top-text,
.farm-col:hover .hover-more-btn {
  opacity: 1;
  transform: translateY(0);
}

/* ==========================================
   4. 一行4列图片区域
   ========================================== */
.four-cols-grid {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  width: 100%;
  max-width: 1200px;
  margin: 30px auto;
  box-sizing: border-box;
}

.four-cols-grid .grid-item {
  flex: 1;
  overflow: hidden;
  border-radius: 6px;
  background-color: #f5f5f5;
}

.four-cols-grid .grid-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.four-cols-grid .grid-item img:hover {
  transform: scale(1.05);
}

/* ==========================================
   5. 底部资质证书与Logo
   ========================================== */
.cert-section {
  width: 100%;
  text-align: center;
  margin-top: 20px;
}

.cert-grid {
  display: flex;
  justify-content: center;
  gap: 15px;
  margin-top: 15px;
}

.cert-item {
  width: 120px;
  height: 150px;
  background-color: #f0f0f0;
  border: 1px solid #e0e0e0;
}

.footer-logo {
  margin-top: 40px;
  text-align: center;
}

.footer-logo img {
  opacity: 0.6;
}

/* ==========================================
   6. 响应式布局自适应 (Media Queries)
   ========================================== */
@media (max-width: 767px) {
  .swiper-container-custom {
    height: auto;
    aspect-ratio: 1200 / 768;
  }

  .dropdown-menu {
    position: static;
    transform: none;
    box-shadow: none;
    background-color: rgba(0, 0, 0, 0.03);
    padding: 5px 0;
    margin-top: 5px;
  }

  .c-menu li:hover .dropdown-menu {
    display: block;
  }

  .main-content-stream {
    /*padding: 25px 15px;*/
    gap: 25px;
  }

  .cert-item {
    width: 70px;
    height: 90px;
  }

  #farm-interactive-row {
    flex-direction: column !important;
    min-height: auto;
    background-image: none !important;
  }

  .farm-col {
    border-right: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    min-height: 180px;
  }

  .hover-top-text,
  .hover-more-btn {
    opacity: 1 !important;
    transform: none !important;
  }

  .farm-col:nth-child(1) { background-image: url("https://cloud.shuntun.com/file/d7z2xYIqgrQm-4-ztWRtw.jpg?x-oss-process=image/format,webp"); background-size: cover; }
  .farm-col:nth-child(2) { background-image: url("https://cloud.shuntun.com/file/vahujtwLHeU7zrg3K-jpq.jpg?x-oss-process=image/format,webp"); background-size: cover; }
  .farm-col:nth-child(3) { background-image: url("https://cloud.shuntun.com/file/XueSW0U8bDb4pVJHS967Z.jpg?x-oss-process=image/format,webp"); background-size: cover; }
  .farm-col:nth-child(4) { background-image: url("https://cloud.shuntun.com/file/kX8A72GuiYk-p6-BP916e.jpg?x-oss-process=image/format,webp"); background-size: cover; }
  .farm-col:nth-child(5) { background-image: url("https://cloud.shuntun.com/file/ibf9T84WUvqUWd55GHE0X.jpg?x-oss-process=image/format,webp"); background-size: cover; }

  .four-cols-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    padding: 0 15px;
  }
}
