/* ============================================
   RUOKES Supplement CSS
   仅补充旧底版(style.css)未覆盖的 RUOKES 专属组件：
   证书墙 / 产品详情特性图标 / 规格尺寸表 / 合作伙伴网格 / 关于页图标卡片
   全局布局/导航/页脚/按钮/Banner 一律由旧底版 style.css 负责
   ============================================ */

/* --- 区块标题（设计稿：蓝色 + 左右装饰短线伪元素）--- */
.rk-section{ padding:50px 0; }
/* About US 四块卡片区：全屏灰底 + container 内顶部 1px 线 */
.rk-about-cards-wrap{ background:#FBFBFB; border-top:1px solid #D2D2D2; padding:20px 0; margin-top:80px; }
.rk-section-title{ text-align:center; margin-bottom:36px; }
.rk-section-title h2{
  font-size:30px; font-weight:700; color:#1890ff; letter-spacing:1px;
  display:inline-block; position:relative; padding:0 56px;
}
.rk-section-title h2:before,
.rk-section-title h2:after{
  content:""; position:absolute; top:50%; width:40px; height:3px;
  background:#1890ff; border-radius:2px;
  transform:translateY(-50%);
}
.rk-section-title h2:before{ left:0; }
.rk-section-title h2:after{ right:0; }
.rk-section-title .sub{ color:#999; font-size:14px; margin-top:10px; }

/* --- 关于页：4 图标卡片（PSD 切图 + 4 种形状外框 + hover 换图变色 + 上移）--- */
.rk-about-card{
  text-align:center; padding:36px 20px 30px; 
  transition:transform .3s ease; height:100%; cursor:pointer;
}
.rk-about-card:hover{ transform:translateY(-6px); }
/* 图标区：只放图片，无边框无形状裁剪 */
.rk-about-card-icon{
  width:150px;  margin:0 auto 18px;
  position:relative; /* hover 图叠放定位基准 */
  display:flex; align-items:center; justify-content:center;
}
/* 图标 img：宽度与图标区一致，hover 换图切换 */
.rk-about-card-icon img{
  width:100%; height:auto; display:block;
  transition:opacity .3s ease;
}
/* hover 换图：正常图与 hover 图叠放，鼠标移入切换 */
.rk-about-card-icon .rk-about-img-hover{
  position:absolute; left:50%; top:50%;
  transform:translate(-50%,-50%); margin:0;
  opacity:0; pointer-events:none;
}
.rk-about-card:hover .rk-about-img{ opacity:0; }
.rk-about-card:hover .rk-about-img-hover{ opacity:1; }
/* 默认：第 1 个文字高亮 */
/* .col-12.col-sm-6.col-lg-3:nth-child(1) .rk-about-card p{ color:#1890ff; } */
/* hover：文字变蓝 */
.rk-about-card:hover p{ color:#1890ff; }
/* 描述文字：大写 */
.rk-about-card p{
  color:#999; font-size:12px; line-height:1.7;
  text-transform:uppercase; letter-spacing:.5px;
  margin:0; padding:0 8px;
  transition:color .3s ease;
}
/* 卡片文字链接：继承文字样式，去掉默认下划线 */
.rk-about-card p a{ color:inherit; text-decoration:none; }

/* --- 证书墙 --- */
.rk-cert-row{ display:flex; flex-wrap:wrap; gap:18px; justify-content:center; }
.rk-cert-item{
  width:200px; border:6px solid #d4af37; background:#fff; padding:6px;
  box-shadow:0 4px 14px rgba(0,0,0,.08); transition:all .25s ease;
}
.rk-cert-item:hover{ transform:scale(1.04); box-shadow:0 8px 22px rgba(0,0,0,.14); }
.rk-cert-item img{ width:100%; display:block; }
.rk-cert-caption{ text-align:center; font-size:13px; color:#555; margin-top:8px; }

/* --- 产品详情：特性图标网格 --- */
.rk-feature-grid{ display:flex; flex-wrap:wrap; }
.rk-feature-item{ width:25%; padding:18px 10px; text-align:center; box-sizing:border-box; }
.rk-feature-icon{
  width:64px; height:64px; margin:0 auto 12px; border-radius:12px; overflow:hidden;
  background:#eef5ff; display:flex; align-items:center; justify-content:center;
}
.rk-feature-icon img{ width:40px; height:40px; object-fit:contain; }
.rk-feature-item h5{ font-size:14px; color:#333; font-weight:600; }

/* --- 产品详情：规格 / 尺寸表 --- */
.rk-spec-table{ width:100%; border-collapse:collapse; margin-top:10px; }
.rk-spec-table th, .rk-spec-table td{ border:1px solid #e5e7eb; padding:10px 14px; font-size:14px; }
.rk-spec-table th{ background:#f4f7fb; color:#1a3a5c; text-align:left; width:200px; font-weight:600; }
.rk-spec-table td{ color:#555; }
.rk-spec-table tr:nth-child(even) td{ background:#fafbfc; }

/* --- 产品详情：图库缩略图 --- */
.rk-pd-thumbs{ display:flex; gap:10px; margin-top:12px; }
.rk-pd-thumb{ width:70px; height:70px; border:2px solid #e5e7eb; border-radius:6px; overflow:hidden; cursor:pointer; }
.rk-pd-thumb.active{ border-color:#1890ff; }
.rk-pd-thumb img{ width:100%; height:100%; object-fit:cover; }

/* --- 合作伙伴 Logo 网格 --- */
.rk-partner-grid{ display:flex; flex-wrap:wrap; gap:16px; justify-content:center; }
.rk-partner-item{
  width:160px; height:80px; border:1px solid #e8ebf0; border-radius:8px; background:#fff;
  display:flex; align-items:center; justify-content:center; padding:12px;
  transition:all .25s ease; box-sizing:border-box;
}
.rk-partner-item:hover{ border-color:#1890ff; box-shadow:0 6px 16px rgba(24,144,255,.1); }
.rk-partner-item img{ max-width:100%; max-height:100%; object-fit:contain; }
.rk-partner-item .rk-partner-name{ font-size:15px; font-weight:600; color:#444; }

/* --- 首页 Hero 幻灯片：整幅铺底 + 右侧文字浮层（参考 bann1.jpg 设计稿）--- */
.rk-hero{ position:relative; overflow:hidden; }
.rk-hero .slick_ban, .rk-hero .slick-list{ width:100%; }
/* banner 高度由内容自适应撑开，不设固定 height/min-height */
.rk-hero-slide{
  position:relative; overflow:hidden;
  background-size:cover; background-position:center center; background-repeat:no-repeat;
}
/* wap 图：用真实 <img> 按原始比例完整显示（文字已合成进图），默认 PC 隐藏 */
.rk-hero-img-wap{ display:none; width:100%; height:auto; }
/* 手机端：设置了 wap 图的幻灯片（.rk-hero-has-wap）只显示图片，
   隐藏 PC 背景/遮罩/文字；高度由图片自身撑开。未设 wap 图的幻灯片自动回退用 PC 背景+文字，不会空白 */
@media (max-width:767px){
  .rk-hero-has-wap{ background-image:none !important; }
  .rk-hero-has-wap .rk-hero-img-wap{ display:block; }
  .rk-hero-has-wap .rk-hero-mask,
  .rk-hero-has-wap .rk-hero-inner{ display:none; }
}
/* PC 端：幻灯片高度按视口宽度等比撑开（900/1920=46.875vw），
   但保证 ≥720px 让所有 PC 视口都能看到完整图；移动端仍走下方媒体查询 */
@media (min-width:992px){
  .rk-hero-slide{ height:46.875vw; min-height:720px; }
}
/* 轻微左侧遮罩提亮产品区，右侧干净不遮 */
.rk-hero-mask{
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.08) 45%, transparent 70%);
}
/* 文字内层：右侧文字区；垂直定位由各视口媒体查询控制（PC 绝对居中 / 移动端对称 padding） */
.rk-hero-inner{
  position:relative; z-index:2; width:100%; padding-left:57%; box-sizing:border-box;
}
/* PC 端：幻灯片高度固定（46.875vw/min-height:720px），文字定位在容器 30% 高度处
   （文字块中心位于 30%，1920/1440/1366/1024 等任何分辨率下位置比例一致） */
@media (min-width:992px){
  .rk-hero-inner{
    position:absolute; left:0; top:30%;
    transform:translateY(-50%);
  }
}
/* 文字块：右边留边距 */
.rk-hero-text{ padding-right:12%; }
/* 标题：蓝色大写粗体，字号按可用宽度自适应，PC 大屏单行完整显示 */
.rk-hero-title{
  font-size:clamp(20px, 2.5vw, 48px); font-weight:800; color:#1890ff; line-height:1.15;
  text-transform:uppercase; letter-spacing:0.5px; margin-bottom:0;
  white-space:nowrap;
}
/* 窄屏（≤1280px）：文字区收窄，允许标题换行，防止横向溢出被裁切 */
@media (max-width:1280px){
  .rk-hero-title{ white-space:normal; }
}
/* 标题下方蓝色装饰线（宽度也随屏自适应） */
.rk-hero-title-bar{
  width:clamp(36px, 4vw, 60px); height:4px; background:#1890ff; border-radius:2px; margin-top:12px; margin-bottom:18px;
}
/* 副标题/描述：深色文字，字号自适应 */
.rk-hero-subtitle{
  color:#333; font-size:clamp(11px, 0.9vw, 16px); line-height:1.5; opacity:.92;
}
@media (max-width:991px){
  .rk-hero-inner{ padding-left:8%; padding-top:90px; padding-bottom:90px; }
  .rk-hero-text{ padding-right:8%; }
}
@media (max-width:767px){
  .rk-hero-inner{ padding-left:6%; padding-right:6%; padding-top:70px; padding-bottom:70px; }
  .rk-hero-text{ padding-right:0; }
  .rk-hero-title-bar{ height:3px; margin-top:8px; margin-bottom:12px; }
}

/* --- 首页 Hero 幻灯片：长条形底部指示器 --- */
.rk-hero{ padding-bottom:0; }
.rk-hero .slick-dots{
  position:absolute; left:0; right:0; bottom:24px;
  display:flex !important; justify-content:center; align-items:center;
  gap:12px; padding:0; margin:0;
  z-index:5;
}
.rk-hero .slick-dots li{ width:auto; height:auto; margin:0; }
/* 去掉 slick-theme.css 默认圆点 + style2.css 红色背景/边框 */
.rk-hero .slick-dots li button:before{ content:none !important; }
.rk-hero .slick-dots li button,
.rk-hero .slick-dots li.slick-active button{
  border:none !important;
  background:transparent !important;
  border-radius:0 !important;
  width:auto !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
}
.rk-hero .rk-hero-dot{
  border:none; background:transparent; padding:0; cursor:pointer;
  display:block; width:60px; height:4px; position:relative;
}
.rk-hero .rk-hero-dot-bar{
  display:block; width:60px; height:4px;
  background:rgba(255,255,255,.45); border-radius:2px;
  transition:background .3s ease, width .3s ease;
}
.rk-hero .slick-dots li.slick-active .rk-hero-dot-bar{
  background:#1890ff; width:80px;
}
.rk-hero .rk-hero-dot:hover .rk-hero-dot-bar{ background:rgba(255,255,255,.8); }
.rk-hero .slick-dots li.slick-active .rk-hero-dot:hover .rk-hero-dot-bar{ background:#40a9ff; }

/* --- 确保 Hero 多张幻灯都能正确显示 --- */
.rk-hero .slick-list, .rk-hero .slick-track{ height:auto; }

/* --- SERVICE CENTER：三张服务卡片（设计稿：白底卡片 + 图片 + 大写标题 + hover上移阴影）--- */
.rk-serv-section .dong{ padding-top:0; padding-bottom:0; }
.rk-serv-section .dongtair{ margin-top:0; margin-bottom:16px; }
.rk-serv-section .imgk{ overflow:hidden; border-radius:8px; background:#fff;
	box-shadow:0 2px 12px rgba(0,0,0,.06); transition:all .35s ease; }
.rk-serv-section .imgk:hover{ box-shadow:0 10px 30px rgba(24,144,255,.14); transform:translateY(-4px); }
.rk-serv-section .imgk .ssbox{ display:block; border:none; box-shadow:none; }
.rk-serv-section .imgk:hover img{ transform:scale(1.05); }
.rk-serv-section .imgk img.img_s{ width:100%; height:auto; aspect-ratio:4/3; object-fit:cover;
	transition:transform .5s ease; }

/* 服务卡标题：大写、居中、深色 */
.rk-serv-cap{ text-align:center; padding:14px 10px 2px; }
.rk-serv-cap a{ font-size:15px; color:#1a3a5c; font-weight:700; text-transform:uppercase;
	letter-spacing:.6px; text-decoration:none; transition:color .25s ease; display:inline-block; }
.rk-serv-cap a:hover{ color:#1890ff; }

/* 服务区卡片间距 */
.rk-serv-section .row.no-gutter > [class*=col-]{ padding-left:12px; padding-right:12px; }
@media (max-width:991px){
	.rk-serv-section .row.no-gutter > [class*=col-]{ padding-left:10px; padding-right:10px; margin-bottom:24px; }
}
@media (max-width:767px){
	.rk-serv-section .row.no-gutter > [class*=col-]{ padding-left:8px; padding-right:8px; margin-bottom:18px; }
}

/* --- 在线购买 / 联系我们：双卡片区（设计稿：白色卡片 + 右箭头）--- */
.rk-contact-bar{ padding:30px 0 50px; }
.rk-contact-card{
	background:#fff; border-radius:10px; padding:28px 32px;
	display:flex; align-items:center; justify-content:space-between;
	box-shadow:0 2px 14px rgba(0,0,0,.06); transition:all .3s ease;
	text-decoration:none; position:relative; overflow:hidden;
	height:100%;
}
.rk-contact-card:hover{ box-shadow:0 8px 28px rgba(24,144,255,.12); transform:translateY(-3px); }
.rk-contact-card-body h3{ font-size:18px; color:#1a3a5c; font-weight:700; margin:0 0 6px; }
.rk-contact-card-body p{ font-size:13px; color:#888; margin:0; line-height:1.6; }
.rk-contact-arrow{
	width:36px; height:36px; border-radius:50%; background:#f0f5ff;
	display:flex; align-items:center; justify-content:center; flex-shrink:0;
	transition:all .3s ease; color:#1890ff; font-size:16px;
}
.rk-contact-card:hover .rk-contact-arrow{ background:#1890ff; color:#fff; }

@media (max-width:767px){
	.rk-contact-bar{ padding:20px 0 30px; }
	.rk-contact-card{ padding:22px 20px; margin-bottom:16px; }
	.rk-contact-card-body h3{ font-size:16px; }
}

/* --- 视频区 --- */
.rk-video-wrap{ position:relative; padding-top:56.25%; border-radius:10px; overflow:hidden; background:#000; }
.rk-video-wrap iframe, .rk-video-wrap video{ position:absolute; inset:0; width:100%; height:100%; border:0; }

/* --- 通用 More 按钮 --- */
.rk-btn-more{
  display:inline-block; padding:9px 26px; border-radius:30px; background:#1890ff; color:#fff;
  font-size:14px; transition:all .25s ease;
}
.rk-btn-more:hover{ background:#096dd9; color:#fff; }

/* --- 在线反馈表单 --- */
.rk-form-row{ margin-bottom:18px; }
.rk-form-row label{ display:block; font-size:14px; color:#333; margin-bottom:6px; }
.rk-form-control{
  width:100%; height:44px; border:1px solid #d9dee5; border-radius:6px; padding:0 14px;
  font-size:14px; box-sizing:border-box;
}
textarea.rk-form-control{ height:120px; padding:10px 14px; resize:vertical; }
.rk-form-control:focus{ border-color:#1890ff; outline:none; }
.rk-btn-submit{
  display:inline-block; padding:12px 40px; border:0; border-radius:30px; background:#1890ff;
  color:#fff; font-size:16px; cursor:pointer; transition:all .25s ease;
}
.rk-btn-submit:hover{ background:#096dd9; }

/* --- 联系信息 --- */
.rk-contact-row{ margin-bottom:14px; font-size:15px; color:#555; }
.rk-contact-row .label{ color:#1a3a5c; font-weight:600; display:inline-block; min-width:120px; }

/* --- 新闻卡片 --- */
.rk-news-item{ display:flex; gap:22px; padding:22px 0; border-bottom:1px solid #eee; }
.rk-news-thumb{ width:240px; flex:0 0 240px; border-radius:8px; overflow:hidden; }
.rk-news-thumb img{ width:100%; height:160px; object-fit:cover; }
.rk-news-info h3{ font-size:19px; color:#1a3a5c; margin-bottom:10px; }
.rk-news-meta{ color:#999; font-size:13px; margin-bottom:10px; }
.rk-news-excerpt{ color:#666; font-size:14px; line-height:1.8; }

/* --- 页脚（设计稿：3列 + 居中标题 + 1px淡灰分隔线 + 列间竖线 + 同色contact-bar + 深色底栏）--- */
/* rk-contact-bar 与 rk-footer 同背景色（浅灰）；footer 顶部加 1px 淡灰分隔线 */
.rk-contact-bar{ background:#f6f6f6; padding:40px 0 45px; }
.rk-footer{ background:#f6f6f6; padding-top:45px; border-top:1px solid #e5e5e5; }

.rk-foot-nav{ margin-bottom:35px; }
/* 覆盖旧底版 .footnnav ul{max-width:278px}，让 ul 占满列宽，标题下划线才整列贯通 */
.rk-foot-nav ul{ max-width:100%; }

/* 标题：左右居中 + 下方 1px 淡灰分隔线（整列宽） */
.rk-foot-nav ul h4{
	color:#1a3a5c; font-size:18px; font-weight:700;
	text-transform:uppercase; letter-spacing:.8px;
	text-align:center;
	border-bottom:1px solid #e5e5e5;
	padding-bottom:14px; margin-bottom:18px;
	line-height:1.2;
}
.rk-foot-nav ul li{ text-align:center; padding:4px 0; }
.rk-foot-nav ul li a{
	color:#888; font-size:13px; transition:color .2s ease; text-decoration:none;
	display:block;               /* 让 text-overflow:ellipsis 生效 */
	max-width:100%;
	white-space:nowrap;          /* 强制不折行 */
	overflow:hidden;
	text-overflow:ellipsis;      /* 超出部分用 … 表示 */
	text-transform:lowercase;    /* 其余字母转小写 */
}
/* 首字母大写（英文首字大写、其它小写） */
.rk-foot-nav ul li a::first-letter{
	text-transform:uppercase;
}
.rk-foot-nav ul li a:hover{ color:#1890ff; }

/* 三列之间竖向淡灰分隔线（仅桌面 3 列并排时显示） */
@media (min-width:992px){
	.rk-foot-nav .rk-foot-col + .rk-foot-col{ border-left:1px solid #e5e5e5; }
}

/* 页脚联系信息区 */
.rk-footer .foottit{ color:#1a3a5c; font-size:15px; font-weight:700; margin-right:8px; }
.rk-footer .foottxt{ color:#777; font-size:13px; line-height:38px; }

/* 深色底栏（页面最底部，整屏宽）— 特异性高于遗留 footer .banqu_di，覆盖其 #3b3b3b/28px */
.rk-footer .rk-copyright{ background:#333333; padding:15px 0; margin-top:0; }
.rk-copyright p{ font-size:12px; color:#cccccc; text-align:center; margin:0; line-height:1.6; letter-spacing:.3px; }

@media (max-width:991px){
	/* 平板/手机：去掉竖线，块间留间距 */
	.rk-foot-nav .rk-foot-col{ margin-bottom:26px; }
	.rk-foot-nav .rk-foot-col + .rk-foot-col{ border-left:none; }
}
@media (max-width:767px){
	.rk-footer{ padding-top:35px; }
	.rk-foot-nav ul h4{ font-size:16px; padding-bottom:10px; margin-bottom:14px; }
	.rk-footer .foottxt{ line-height:32px; font-size:12px; }
	.rk-footer .rk-copyright{ padding:13px 0; }
	.rk-copyright p{ font-size:11px; }
}

/* --- 关于页 Tab（设计稿 4 Tab）--- */
.rk-page-tabs{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin:30px 0; }
.rk-page-tab{
  padding:10px 28px; border:1px solid #d9dee5; border-radius:30px; color:#555; cursor:pointer;
  font-size:15px; transition:all .25s ease;
}
.rk-page-tab.active{ background:#1890ff; color:#fff; border-color:#1890ff; }