@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('/zt/skin/fonts/inter-latin.woff2') format('woff2');}
.hero-h1{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei','Helvetica Neue',Arial,sans-serif;}
 * { font-family: -apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei','Helvetica Neue',Helvetica,Arial,sans-serif; } html { scroll-behavior: smooth; } /* 专业蓝绿色调 */ :root { --primary: #0891b2; --primary-dark: #0e7490; --primary-light: #06b6d4; --accent: #14b8a6; --accent-light: #2dd4bf; --dark: #164e63; --slate: #334155; } .hero-gradient { background: linear-gradient(135deg, #0c4a6e 0%, #0369a1 40%, #0891b2 70%, #06b6d4 100%); position: relative; overflow: hidden; } .hero-gradient::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: radial-gradient(ellipse at 30% 70%, rgba(14, 165, 233, 0.3) 0%, transparent 50%), radial-gradient(ellipse at 70% 30%, rgba(6, 182, 212, 0.2) 0%, transparent 50%); } .hero-pattern { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0.03; background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='1'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .glass-card { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(20px); border: 1px solid rgba(255, 255, 255, 0.1); } .stat-card { background: linear-gradient(135deg, #0c4a6e 0%, #0891b2 100%); } .product-card { transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); } .product-card:hover { transform: translateY(-8px); box-shadow: 0 25px 50px -12px rgba(8, 145, 178, 0.25); } .feature-icon { background: linear-gradient(135deg, #0891b2 0%, #06b6d4 100%); } .cta-gradient { background: linear-gradient(135deg, #0891b2 0%, #14b8a6 100%); } .mobile-menu { transform: translateX(100%); transition: transform 0.3s ease-in-out; } .mobile-menu.active { transform: translateX(0); } .product-scroll { scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; } .product-scroll > div { scroll-snap-align: center; } @keyframes float { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-10px); } } .{ animation: float 4s ease-in-out infinite; } . -delay { animation: float 4s ease-in-out infinite; animation-delay: 1s; } @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in { animation: fadeInUp 0.6s ease-out forwards; } .tab-btn.active { background-color: #0891b2; color: white; } 
/* === 塑料行业通用模板（common_suliao）新增类，只增不减 === */
.plastic-texture{position:absolute;top:0;left:0;right:0;bottom:0;opacity:0.08;pointer-events:none;overflow:hidden;}
.plastic-texture svg{width:100%;height:100%;}
.product-large-card{background:white;border-radius:1rem;box-shadow:0 4px 6px -1px rgba(0,0,0,0.1);overflow:hidden;transition:all 0.3s ease;}
.product-large-card:hover{transform:translateY(-4px);box-shadow:0 10px 25px -5px rgba(0,0,0,0.1);}
.product-small-card{background:white;border-radius:0.75rem;overflow:hidden;transition:all 0.3s ease;border:1px solid #e2e8f0;}
.product-small-card:hover{transform:translateY(-4px);box-shadow:0 15px 30px -5px rgba(0,0,0,0.1);}
.case-banner{position:relative;background-size:cover;background-position:center;overflow:hidden;}
.case-banner::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(12,74,110,0.85),rgba(8,145,178,0.75));}
.case-banner-content{position:relative;z-index:10;}
.highlight-number{font-size:4rem;font-weight:800;color:#fde047;text-shadow:0 4px 20px rgba(0,0,0,0.3);line-height:1;}
.condition-card{background:linear-gradient(135deg,#f8fafc 0%,#f1f5f9 100%);border-radius:1rem;padding:1.25rem;transition:all 0.3s ease;border:1px solid #e2e8f0;height:100%;}
.condition-card:hover{transform:translateY(-4px);box-shadow:0 15px 30px -5px rgba(0,0,0,0.1);border-color:#0891b2;}
.solution-card{border-left:4px solid var(--primary);}
.solution-card:hover{border-left-color:var(--accent);background:#f8fafc;}
.service-card{background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);}
.service-card:hover{background:rgba(255,255,255,0.2);}
.badge-tag{display:inline-flex;align-items:center;padding:0.375rem 0.75rem;background:linear-gradient(135deg,#f0f9ff 0%,#e0f2fe 100%);border:1px solid #bae6fd;border-radius:9999px;font-size:0.75rem;font-weight:500;color:#0891b2;margin:0.25rem;}
.product-type-card{background:white;border-radius:1rem;box-shadow:0 4px 6px -1px rgba(0,0,0,0.1);overflow:hidden;transition:all 0.3s ease;border:1px solid #e2e8f0;}
.product-type-card:hover{transform:translateY(-4px);box-shadow:0 20px 25px -5px rgba(0,0,0,0.1);}
.info-badge{background:linear-gradient(135deg,#0891b2,#06b6d4);color:white;padding:0.5rem 1rem;border-radius:0.5rem;font-size:0.75rem;font-weight:600;text-align:center;}
@media(max-width:768px){
  .scroll-container{display:flex;overflow-x:auto;gap:1rem;padding-bottom:1rem;-webkit-overflow-scrolling:touch;}
  .scroll-container::-webkit-scrollbar{display:none;}
}
/* === BNP产品页（style2）新增类，只增不减 === */
.product-img-wrap{background:#f0f9ff;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;}
.product-img-wrap img{position:relative;z-index:2;object-fit:contain;filter:drop-shadow(0 12px 24px rgba(8,145,178,0.18));}
/* === 船舶防污模板（common_chuanbo）新增类，只增不减 === */
.ocean-texture{position:absolute;top:0;left:0;right:0;bottom:0;opacity:0.08;pointer-events:none;overflow:hidden;}
.ocean-texture svg{width:100%;height:100%;}
.cpt97-section{background:linear-gradient(180deg,#f8fafc 0%,#f0f9ff 50%,#e0f2fe 100%);position:relative;}
.cpt97-section::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#0891b2,#06b6d4,#14b8a6);}
.feature-card{background:white;border-radius:1rem;overflow:hidden;transition:all 0.4s cubic-bezier(0.4,0,0.2,1);border:1px solid #e2e8f0;}
.feature-card:hover{transform:translateY(-8px);box-shadow:0 25px 50px -12px rgba(8,145,178,0.2);border-color:#0891b2;}
.panel-card{background:white;border-radius:1rem;overflow:hidden;transition:all 0.3s ease;box-shadow:0 4px 6px -1px rgba(0,0,0,0.1);}
.panel-card:hover{transform:scale(1.02);box-shadow:0 20px 25px -5px rgba(0,0,0,0.1);}
.highlight-stat{background:linear-gradient(135deg,#0891b2,#06b6d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.wave-decoration{position:absolute;bottom:0;left:0;right:0;height:60px;opacity:0.1;}
/* === zt 移动端：底部只保留 .hs-bottom 的96px让位，去掉body重复预留，消除底部大空白 === */
@media(max-width:860px){
  body{padding-bottom:0 !important;}
}

/* ===== 悬浮窗按钮自身 class=outline 与 Tailwind .outline 工具类撞车，
   被额外套上一圈 outline，叠加 tech.css 的 2px 边框后看起来边变厚；
   仅对悬浮窗按钮关闭该 outline，统一为官网的 2px 细边 ===== */
.hs-m-cta a,.hs-m-cta button{outline:none;}