﻿
    /* 通用按钮 */
    .btn {
      padding: 8px 16px;
      background: #ffae66;
      border: none;
      font-size: 13px;
      cursor: pointer;
      border-radius: 2px;
    }
    .btn-outline {
      background: transparent;
      border: 1px solid #111;
    }
    /* 顶部标题区 */
    .page-header {
      text-align: center;
      padding: 178px 0 32px;background:#F4F1EA;
    }
    .page-header .tiny-top {
      font-size: 18px;
      color: #444; text-align: left;
      margin-bottom: 4px;
    }
   

    /* 通用图文区块 移动端上下 PC左右 */
    .content-row {
      display: flex;
      flex-direction: column;
      gap: 32px;
      margin-bottom: 80px;
      align-items: center;
    }
    @media(min-width:768px) {
      .content-row { flex-direction: row; }
      .content-row.reverse { flex-direction: row-reverse; }
      .row-img, .row-text { flex: 1; }
    }
    .row-img img {
      width: 100%;
      height: auto;
      display: block;
    }
    .row-text h2 {
      font-size: 36px;
      margin-bottom: 12px;
    }
    .row-text p {
      font-size: 18px;
      margin-bottom: 16px;
      max-width: 440px;
    }
    .list-item {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 18px;
      margin-bottom: 6px;
    }
    .list-item::before { content: "○"; font-size: 10px; }

    /* 产品方案板块 */
    .solution-section {
      padding: 60px 0;
      background: #f8f5ee;
    }
    .solution-head {
      text-align: center;
      margin-bottom: 40px;
    }
    .solution-head .tiny {
      font-size: 16px;
      margin-bottom: 6px;
    }
    .solution-head h2 {
      font-size: 38px;
      margin-bottom: 12px;
    }
    .filter-tabs {
      display: flex;
      gap: 10px;
      margin-bottom: 32px;
      flex-wrap: wrap;
    }
    .filter-tabs span {
      font-size: 16px;
      margin-right: 8px;
      align-self: center;
    }
    .tab-btn {
      padding: 6px 20px;
      border: none;
      background: #ddd;
      font-size: 16px;
    }
    .tab-btn.active,.tab-btn:hover { background: #ffae66; }
    .product-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(460px, 1fr));
      gap: 24px;
    }
    .product-card {
      background: #fff;
      padding: 24px;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;position:relative;
    }
	
	 .diagonal-block {
            position: absolute;
            right: 0;
            top: 0;
            width: 26%;
            height: 100%;
            background: #ffae66;
            /* 斜切效果，模拟原图斜边 */
            clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
        }

	
	
    .prod-info h3 { font-size: 26px; margin: 24px 0; }
    .prod-info p { font-size: 16px; color:#444; max-width:350px}
    .prod-icon {
      width: 180px;
      height: 180px;overflow:hidden;
     z-index:9999;position:relative;
      
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .prod-icon img { width: 100%; border-radius: 50%; }
    .new-tag {
      color: #f00;
      font-weight: bold;
    }

   
  .testimonial-wrap {
            width: 100%;padding:80px 0;
            margin: 0 auto;
        }
		 .testimonial-wrap .container{}
        /* 顶部评价容器 */
        .testimonial-top {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 60px;
            margin-bottom: 50px;
        }
        .quote-text-area {
            flex: 1;
            max-width: 520px;
        }
        .quote-content {
            font-size:32px;
            line-height: 1.4;
            color: #000;
            margin-bottom: 24px;
        }
        .author-name {
            font-size:20px;
             color: #000;
            margin-bottom: 30px;
        }
        .read-full-btn {
            padding: 12px 28px;
            border: 1px solid #99c2d8;
            background: #fff;
            font-size: clamp(14px, 1.5vw, 18px);
            cursor: pointer;
            border-radius: 2px;
            transition: background 0.2s;
        }
        .read-full-btn:hover {
            background-color: #f0f7fc;
        }
        .avatar-block {
            position: relative;
            flex-shrink: 0;
        }
        .avatar-circle {
          
            object-fit: cover;
            display: block;
        }
        .cow-icon-badge {
            position: absolute;
            bottom: 0;
            right: 0;
            width: clamp(70px, 8vw, 110px);
            height: clamp(70px, 8vw, 110px);
            background-color: #24b886;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .cow-icon-badge svg {
            width: 55%;
            fill: #fff;
        }
		  /* 底部案例导航栏 */
        .case-tabs {
            display: flex;
            gap: 20px;
        }
        .case-tab-item {
          
            align-items: center;
            padding: 12px 20px;
            background: #f7f7f7;
       
            cursor: pointer;
            transition: background 0.2s;
            flex: 1;
        }
        .case-tab-item:hover {
            background: #eef5f2;
        }
        .tab-icon-circle {
           
           
          
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }
        .tab-icon-circle img {
           width: auto;
    height: 230px;
            fill: #fff;
        }
        .tab-text {
            font-size: clamp(14px, 1.4vw, 18px);
            color: #111;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .arrow-right {
            margin-left: 8px;
            font-size: clamp(16px, 1.6vw, 20px);
            color: #111;
            flex-shrink: 0;
        }

      
		
		
    /* Join the family */
        .block-partner {
            background: #f5eae1;
          -webkit-border-radius: 18px;
-moz-border-radius: 18px;
border-radius: 18px;
          
           overflow:hidden;
            margin-bottom: 48px;
            align-items: center;
        }
		.block-partner .container{ padding:0;display: flex;}
        .partner-img-wrap {width:55%;
          
        }
        .partner-img {
            max-width: 100%;
            display: block;
            
        }
		.partner-text{width:40%;margin-left:5%;margin-top:50px;}
        .partner-text h4 {
            font-size:16px;
            font-weight: normal;
            color: #333;
            margin-bottom: 8px;margin-top:80px;
        }
        .partner-text h2 {
            font-size: 48px;
            margin-bottom: 12px;
        }
        .partner-text p {
            font-size: 18px;
            line-height: 1.5;
            color: #333; margin-bottom: 42px;
            max-width: 420px;
        }
 /* 客户Logo滚动 */
        .client-wrap {
            padding: 60px 0;
            overflow: hidden;
        }
        .client-scroll {
            display: flex;
            gap: 30px;
            animation: scroll 25s linear infinite;
            width: max-content;
        }
		.client-scroll:hover{animation-play-state: paused;}
        .client-item {
            font-size: 20px;
            font-weight: 600;
            color: var(--gray);
            white-space: nowrap;
        }
		.client-item  img{height:240px}
		.client-item  p{width:100%;text-align:center;font-size:16px;}
        @keyframes scroll {
            0% { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }
    /* FAQ 区块 */
    .faq-section {
      max-width: 1200px;
      margin:0 auto 80px;
      padding:0 24px;
      display: flex;
      flex-direction: column;
      gap:80px;
    }
    @media(min-width:768px) {
      .faq-section { flex-direction: row; }
    
    }
	
	  .faq-right { max-width:650px; }
	
    .faq-left h2 { font-size:48px; margin-bottom:12px; }
    .faq-left p { font-size:18px; max-width:400px; }
      /* 单个折叠卡片容器 */
        .faq-item {
            border: 1px solid #e5e5e5;
            border-radius: 10px;
            margin-bottom: 20px;
            overflow: hidden;
        }
        /* 标题点击栏 */
        .faq-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 28px 32px;
            cursor: pointer;
        }
        .faq-title {
            font-size: 22px;
            font-weight: 600;
            color: #111111;
            line-height: 1.3;
        }
        /* 上下箭头图标 */
        .arrow {
            font-size: 14px!important;
            color: #111;font-weight:bold; 
            
        }
        .faq-item.active .arrow {
          
        }
        /* 折叠内容区域 */
        .faq-content {
            max-height: 0;
            padding: 0 32px;
            overflow: hidden;
           
        }
        .faq-item.active .faq-content {
            max-height: 400px;
            padding: 0 32px 32px 32px;
        }
        .faq-text {
            font-size: 16px;
            color: #222;
            line-height: 1.7;
        }

    /*  Contact Chat */
        .block-contact {
            background: #f5eae1; padding:50px 0;
         
        }
		
		 .block-contact .container{  display: flex;
            gap: 80px;align-items: center;}
		
		
        .contact-avatar-wrap {
            flex: 0 0 300px;
            position: relative;
        }
        .avatar-bg-circle {
            width: 400px;
            height: 400px;
            background: #ffae66;
            border-radius: 50%;
            position: relative;
            overflow: hidden;
        }
        .avatar-bg-circle::before {
            content: "";
            position: absolute;
            width: 100%;
            height: 100%;
            background-image: repeating-conic-gradient(transparent 0deg 15deg, #ffcfa4 15deg 30deg);
            opacity: 0.6;
        }
        .contact-avatar {
            width: 72%;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
           
        }
        .contact-text h4 {
            font-size: 16px;
            font-weight: normal;
            color: #333;
            margin-bottom: 8px;
        }
        .contact-text h2 {
            font-size: 48px;
            margin-bottom: 12px;
        }
        .contact-text p {
            font-size: 18px;
            line-height: 1.5;
            color: #444;
            max-width: 620px;margin-bottom:30px;
        }
		
		
		
	
	
	 /* 动物照明分类板块 */
        .animal-light {
            padding: 50px 0;background:#F4F1EA;
        }
        .sec-title {
            font-size: 34px;text-align:center;
            margin-bottom: 12px;
        }
        .sec-desc {
            font-size: 18px;text-align:center;
            color: var(--gray);
            margin-bottom: 50px;
           
        }
        .animal-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 30px;
        }
        .animal-card {
            background: var(--white);
            padding: 18px;
            border-radius: 8px;
            box-shadow: 0 4px 12px rgba(0,0,0,0.05);
            transition: transform .3s;
        }
        .animal-card:hover {
            transform: translateY(-6px);
        }
        .animal-card h3 {
            font-size: 22px;
            margin-bottom: 10px;
        }
        .animal-card p {
            color: var(--gray);
        }
		.animal-card p img{max-width:100%;width: 100%;}




  /* 移动端适配：768px以下切换垂直布局 */
        @media screen and (max-width: 768px) {
           .page-header{    padding: 117px 0 32px;}
		   .page-header .tiny-top{font-size:14px;}
		   .animal-light{padding:0 0 30px;}
		   .content-row{padding-top:30px;margin-bottom: 30px;}
		   .filter-tabs,.filter-tabs span{display:block;}
		   .tab-btn{font-size:14px;display:inline-block;margin:5px;}
		   	 .product-grid{display:block;}
		   .prod-info h3,.prod-info p{font-size:14px;}
		   .prod-info p{max-width:100%}
		   .prod-info h3{margin: 14px 0;}
		   .product-card{padding: 18px;margin-bottom: 20px;}
		   .prod-icon{height:auto;width:100%;}
		   .prod-icon img{height:auto;width:100%;}
		   .row-text h2{font-size:28px;}
		   .solution-head h2{font-size:30px;}
		   .testimonial-wrap{padding: 30px 0;}
		   .faq-left h2{font-size:26px;}
		.faq-section{    gap: 40px;}
		.faq-title{font-size:16px;}
            .testimonial-top {
                flex-direction: column-reverse;
                align-items: center;
                text-align: center;
                gap: 35px;
            }
            .quote-text-area {
                max-width: 100%;
                width: 100%;
            }
            .case-tabs {
                flex-direction: column;
                gap: 15px;
            }
            .read-full-btn {
                width: 100%;
            }
        }
.pageNum{width:100%;text-align:center;margin:50px 0 0!important;}

.pageNum li.active,.pageNum li:hover{background:#ffae66!important;color:#fff}
