/** Shopify CDN: Minification failed

Line 635:1 Unexpected "*"

**/
/* --- 1. 首页 Banner (首屏大图) 深度优化 --- */
.banner__heading { 
  color: #ffffff !important; 
  font-weight: 700 !important; 
  text-shadow: 0 2px 10px rgba(0,0,0,0.3); 
}

.banner__text.caption-with-letter-spacing { 
  color: #ffffff !important; 
  font-size: 1.4rem !important; 
  letter-spacing: 0.2rem !important; 
  text-transform: uppercase !important; 
  font-weight: 600 !important; 
  opacity: 0.9; 
  margin-bottom: 1.5rem !important;
}

/* Banner 品牌蓝按钮：方角 + 呼吸动效 */
.banner__buttons .button { 
  background: #0055FF !important; 
  color: #ffffff !important; 
  border-radius: 2px !important; 
  padding: 1.2rem 3rem !important; 
  transition: all 0.3s ease !important; 
  border: none !important;
  font-weight: 600 !important;
}

.banner__buttons .button:hover { 
  background: #0044CC !important; 
  transform: translateY(-2px); 
  box-shadow: 0 5px 15px rgba(0,85,255,0.3); 
}

/* Banner 左侧暗色渐变遮罩 (增强文字易读性) */
.banner__media::after { 
  content: ""; 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
  background: linear-gradient(90deg, rgba(0,0,0,0.35) 0%, transparent 60%); 
  pointer-events: none; 
}

/* --- 2. 产品区块 (Featured Collection) 高端定制 --- */

/* 区块标题居中 */
.collection__title.title-wrapper {
  display: flex !important;
  justify-content: center !important;
  text-align: center !important;
  margin-bottom: 4rem !important;
}

/* 产品卡片整体动效 */
.card-wrapper {
  background: #ffffff;
  border-radius: 4px;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

.card--standard {
  border: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}

/* 鼠标悬停：上浮 + 品牌蓝投影 */
.card-wrapper:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0, 85, 255, 0.1) !important;
}

/* 产品图片区微调 */
.card__inner {
  background-color: #fcfcfc !important;
  border-radius: 4px 4px 0 0;
  overflow: hidden;
}

.card-wrapper:hover .card__media img {
  transform: scale(1.05); /* 图片轻微缩放 */
  transition: transform 0.8s ease !important;
}

/* 产品标题与价格同步 CUCIR 规范 */
.card__heading a {
  color: #1A1A1A !important;
  font-size: 1.6rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.card__heading a:hover {
  color: #0055FF !important;
}

.price__container, .price {
  color: #0055FF !important; /* 核心价格蓝色 */
  font-size: 1.8rem !important;
  font-weight: 700 !important;
}

/* 销售标签样式 */
.badge--bottom-left {
  background-color: #0055FF !important;
  border-radius: 2px !important;
  border: none !important;
}

/* “查看全部”按钮优化 */
.collection__view-all .button {
  background: transparent !important;
  color: #0055FF !important;
  border: 1.5px solid #0055FF !important;
  border-radius: 2px !important;
  padding: 1rem 3.5rem !important;
  transition: 0.3s !important;
}

.collection__view-all .button:hover {
  background: #0055FF !important;
  color: #fff !important;
}

/* --- 5. 极致极简 B2C 信任区块 (无圆圈版) --- */

/* 1. 区块大标题居中与品牌线 */
.section-template--current-multicolumn .title-wrapper-with-link {
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  margin-bottom: 30px !important;
}

.section-template--current-multicolumn .title::after {
  content: "";
  display: block;
  width: 30px;
  height: 2px;
  background: #0055FF; /* 品牌蓝 */
  margin: 10px auto 0;
}

/* 2. 去掉圆圈，强制图标容器居中并修复对齐 */
.section-template--current-multicolumn .multicolumn-card__image-wrapper {
  background: transparent !important; /* 去掉圆圈背景 */
  border: none !important;
  margin: 0 auto 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: 60px !important; /* 给图标留出固定的垂直空间 */
}

/* 3. 强制图标尺寸与位置 (电脑端) */
.section-template--current-multicolumn .multicolumn-card__image-wrapper .media,
.section-template--current-multicolumn .multicolumn-card__image-wrapper img {
  position: relative !important;
  padding-bottom: 0 !important;
  width: 48px !important; /* 图标稍大一点，显高端 */
  height: 48px !important;
  object-fit: contain !important;
  transition: transform 0.3s ease !important;
}

/* 4. 手机端适配：一行显示两个，防止图标过大 */
@media screen and (max-width: 749px) {
  .section-template--current-multicolumn .multicolumn-list {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important; /* 强制手机端一行两个 */
    gap: 15px !important;
    padding: 0 10px !important;
  }

  .section-template--current-multicolumn .multicolumn-card__image-wrapper {
    height: 50px !important;
  }

  .section-template--current-multicolumn .multicolumn-card__image-wrapper img {
    width: 36px !important; /* 手机端图标缩小 */
    height: 36px !important;
  }
}

/* 5. 文字样式 */
.multicolumn-card__info .inline-richtext {
  color: #1A1A1A !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  margin-top: 5px !important;
}

/* 6. 隐藏描述文字 */
.multicolumn-card__info .rte, 
.multicolumn-card__info .link {
  display: none !important;
}

/* 7. 悬停效果：图标变品牌蓝并轻微上浮 */
.multicolumn-card:hover img {
  transform: translateY(-5px);
  /* 如果是黑色图标，悬停时转为品牌蓝 */
  filter: invert(24%) sepia(91%) saturate(5431%) hue-rotate(225deg) brightness(98%) contrast(105%) !important;
}

/* --- 7. 首页产品区块 (Featured Collections) 整体美化 --- */

/* 1. 标题区定制：让 Inductive Proximity Sensor 这种标题更有科技感 */
.section-template--current-featured-collection .title-wrapper-with-link {
  margin-bottom: 3rem !important;
  border-left: 4px solid #0055FF; /* 左侧品牌蓝装饰条 */
  padding-left: 1.5rem !important;
  justify-content: space-between !important;
}

.section-template--current-featured-collection .title {
  font-size: 2.2rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* 2. 产品卡片微调：增加轻微投影，让白色背景的产品更有层次 */
.card-wrapper {
  background: #ffffff !important;
  transition: all 0.3s ease !important;
  border: 1px solid #f0f0f0 !important;
}

.card-wrapper:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 85, 255, 0.05) !important;
  border-color: #0055FF !important;
}

/* 3. 价格标签：加粗并改为品牌色（可选） */
.price-item--regular {
  color: #0055FF !important;
  font-weight: 700 !important;
  font-size: 1.8rem !important;
}

/* 4. "Choose options" 按钮：改为硬核工业风格 */
.card__content .button {
  background: transparent !important;
  border: 1.5px solid #1A1A1A !important;
  color: #1A1A1A !important;
  border-radius: 0 !important; /* 方形按钮更有工业精密感 */
  font-weight: 600 !important;
  transition: all 0.3s !important;
}

.card__content .button:hover {
  background: #1A1A1A !important;
  color: #ffffff !important;
}

/* --- 8. 产品标题统一高度与自动省略 --- */

.card__heading {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important; /* 这里设置显示的行数，2行通常最美观 */
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  
  /* 关键：设定一个最小高度，确保标题短的产品也能撑开同样的高度 */
  min-height: 4.4rem !important; 
  line-height: 1.2 !important;
  margin-bottom: 1rem !important;
}

/* 如果你想让标题在鼠标移上去时显示全名，可以加上这段（可选） */
.card-wrapper:hover .card__heading {
  -webkit-line-clamp: unset !important;
  display: block !important;
}

/* --- 9. 压缩产品区块标题与列表之间的间距 --- */

/* 1. 针对电脑端：大幅减小标题下方的外边距 */
.section-template--current-featured-collection .title-wrapper-with-link {
  margin-bottom: 1.5rem !important; /* 原本可能是 4rem 或 5rem，这里改为 1.5rem */
}

/* 2. 针对手机端：进一步微调，让布局更紧凑 */
@media screen and (max-width: 749px) {
  .section-template--current-featured-collection .title-wrapper-with-link {
    margin-bottom: 1rem !important;
  }
  
  /* 压缩区块顶部的内边距，让页面节奏更快 */
  .section-template--current-featured-collection {
    padding-top: 2rem !important;
  }
}

/* 3. 去掉标题容器可能自带的额外内边距 */
.featured-collection__title {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* --- 10. 页脚 (Footer) 专业化处理 --- */
.footer {
  background-color: #f8f9fa !important; /* 浅灰色背景，增加层次感 */
  border-top: 1px solid #e5e5e5 !important;
}

.footer__heading {
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
}

/* 确保支付图标在手机端居中 */
.footer__payment {
  margin-top: 2rem !important;
  text-align: center !important;
}

/* --- 11. 应用实拍图 Gallery 样式 --- */

/* 1. 强制图片正方形并增加圆角 */
.section-template--current-multicolumn .multicolumn-card__image-wrapper--third-width {
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  border-radius: 12px !important; /* 稍微大一点的圆角，显现代感 */
}

/* 2. 悬停微缩放效果 */
.section-template--current-multicolumn .multicolumn-card:hover img {
  transform: scale(1.1);
  transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

/* 3. 增加极轻的阴影，让实拍图浮现出来 */
.section-template--current-multicolumn .multicolumn-card {
  box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important;
}

/* --- 14. 针对独立 Page 页面的深度强制样式 --- */

/* 1. 强制 About Us 标题居中并加粗 (精准定位大标题) */
.main-page-title, 
h1.main-page-title,
.template-page .main-page-title {
  text-align: center !important;
  font-weight: 800 !important;
  font-size: 3.5rem !important;
  margin: 50px auto !important;
  display: block !important;
  width: 100% !important;
}

/* 2. 强制限制内容宽度，避免横向拉伸过长 */
.main-page-title + .rte,
.template-page .page-width,
.template-page .rte {
  max-width: 800px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  line-height: 1.8 !important;
}

/* 3. 为文字段落增加工业质感间距 */
.template-page .rte p {
  margin-bottom: 2.5rem !important;
  color: #333 !important;
}

/* 4. 蓝条高亮块 (确保 class 名匹配) */
.about-highlight {
  background: #F8FAFF !important;
  border-left: 6px solid #0055FF !important;
  padding: 30px !important;
  margin: 40px 0 !important;
  border-radius: 0 4px 4px 0;
  text-align: left !important;
}

/* --- 17. 页脚布局重塑：从线性到矩阵 --- */

/* 1. 强制版权信息区域背景加深，建立视觉底座 */
.footer__content-bottom {
  background-color: #f4f4f4 !important;
  padding-top: 40px !important;
  padding-bottom: 40px !important;
  margin-top: 0 !important;
}

/* 2. 让原本挤在一行的政策链接变为整齐的网格/列表 */
.footer__localization-form + .footer__column--info,
.footer__content-bottom-wrapper {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 20px !important;
}

/* 3. 针对图片中那一排链接 (Policies) 的美化 */
.policies.list-inline {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 15px 30px !important; /* 增加横向和纵向间距 */
  margin-top: 20px !important;
}

.policies.list-inline li a {
  font-size: 1.3rem !important;
  color: #888 !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.policies.list-inline li a:hover {
  color: #0055FF !important; /* 悬停时变品牌蓝 */
}

/* 4. 隐藏 "Powered by Shopify"，让站点看起来更像独立大品牌 */
.footer__copyright.caption small {
  font-size: 1.2rem !important;
  color: #999 !important;
}
/* 如果你想彻底去掉 Powered by Shopify 字样，取消下面注释 */
/* .footer__copyright.caption small a { display: none !important; } */

/* 5. 支付图标美化：稍微放大并居中 */
.footer__payment {
  margin-top: 0 !important;
  margin-bottom: 10px !important;
}

.footer__payment .list-payment__item {
  padding: 0 5px !important;
}

/* --- 20. 多属性药丸样式美化 --- */

/* 未选中的药丸：灰色细边框，等宽字体 */
.product-form__input input[type='radio'] + label {
  border: 1px solid #d1d1d1 !important;
  border-radius: 4px !important; /* 方圆角更有工业感 */
  padding: 8px 15px !important;
  font-size: 1.4rem !important;
  font-family: 'Courier New', Courier, monospace !important;
  background-color: #f9f9f9 !important;
  color: #333 !important;
  transition: all 0.2s ease;
}

/* 选中的药丸：品牌蓝背景，白色文字 */
.product-form__input input[type='radio']:checked + label {
  background-color: #0055FF !important; /* CUCIR 品牌蓝 */
  border-color: #0055FF !important;
  color: #ffffff !important;
  box-shadow: 0 2px 4px rgba(0,85,255,0.2) !important;
}

/* 缺货或不存在的组合：虚线边框，斜杠划掉 */
.product-form__input input[type='radio'].disabled + label,
.product-form__input input[type='radio']:disabled + label {
  border: 1px dashed #e1e1e1 !important;
  color: #ccc !important;
  text-decoration: line-through;
  opacity: 0.6;
}
/* =======================================================
   SHOPIFY DAWN 主题博客详情页【无死角强力拓宽】终极补丁
   ======================================================= */

/* 1. 强制击穿并重置所有级别的内容和标题包装容器 */
.article-template__header.page-width,
.article-template__header.page-width--narrow,
.article-template__content.page-width,
.article-template__content.page-width--narrow,
.article-template .page-width,
.article-template .page-width--narrow {
  max-width: 1200px !important;
  width: 100% !important;
  padding-left: 2rem !important;
  padding-right: 2rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 2. 移除任何可能导致居中缩紧的固定宽度限制 */
.article-template__content.rte,
.article-template__header {
  max-width: 1200px !important;
}

/* 3. 优化技术标题：大气舒展的大厂风 */
.article-template__title {
  font-size: 38px !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 25px !important;
  color: #121212 !important;
}

/* 4. 优化文章正文排版（提升海外工程师的阅读体验） */
.article-template__content p, 
.article-template__content li {
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: #2b2b2b !important;
}

/* 5. 确保你刚生成的英文高清图能够完美平铺，撑满 1200px 容器 */
.article-template__content img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 30px auto !important;
  display: block !important;
}
/* =======================================================
   CUCIR 博客列表页：【无边框 1200px 大气横向列表】
   ======================================================= */

/* 1. 彻底打破 Dawn 的窄屏和卡片容器限制 */
.main-blog.page-width {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* 2. 移除所有默认的卡片背景、边框、阴影和圆角 */
.blog-articles__article .card-wrapper,
.blog-articles__article .card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* 3. 强制布局为横向：左侧图片，右侧内容 */
.blog-articles {
  display: flex !important;
  flex-direction: column !important;
  gap: 70px !important; /* 增加行与行之间的呼吸感 */
}

.blog-articles__article .card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
}

/* 4. 图片区域锁定：大气、清晰、工业感 */
.blog-articles__article .card__inner {
  width: 450px !important; /* 锁定图片宽度 */
  min-width: 450px !important;
  aspect-ratio: 16 / 10 !important;
  background: #f0f0f0 !important; /* 图片未加载时的极淡底色 */
  overflow: hidden !important;
}

/* 5. 文字区域：彻底去除内边距，实现视觉对齐 */
.blog-articles__article .card__content {
  flex-grow: 1 !important;
  padding: 0 0 0 50px !important; /* 仅保留左侧间距，其余留白 */
  text-align: left !important;
}

/* 6. 标题样式升级：加大字号，更显权威 */
.article-card__heading {
  font-size: 28px !important;
  font-weight: 600 !important;
  color: #121212 !important;
  margin-bottom: 20px !important;
  line-height: 1.2 !important;
}

/* 摘要文字：放宽行高，增加易读性 */
.article-card__excerpt {
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: #4b5563 !important;
  margin-bottom: 25px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important; /* 允许显示更多文字，更具画册感 */
}

/* 7. 科技蓝 View Details 按钮：去掉所有多余装饰 */
.article-card__footer .link {
  color: #0055FF !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  text-decoration: none !important;
  border-bottom: 2px solid #0055FF; /* 标志性的底线 */
  padding-bottom: 5px;
  display: inline-block !important;
}

/* 8. 响应式适配：手机端自动切换回垂直堆叠 */
@media (max-width: 989px) {
  .blog-articles__article .card {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .blog-articles__article .card__inner {
    width: 100% !important;
    min-width: 100% !important;
  }
  .blog-articles__article .card__content {
    padding: 25px 0 0 0 !important;
  }
}

/* 9. 顶部页面标题对齐修正 */
.main-blog__title {
  text-align: left !important;
  max-width: 1200px !important;
  margin: 0 auto 60px !important;
  font-size: 40px !important;
  border-left: 10px solid #0055FF;
  padding-left: 25px;
}

**为什么这次会更“大气”？**
1. **去盒化：** 删除了所有灰色的底色块和阴影，让白色背景贯穿全场，视觉上不再有束缚感。
2. **黄金分割：** 图片占约 40%，文字占 60%，这是国际主流技术周刊最常用的“大气”比例。
3. **视觉焦点：** 蓝色的下划线按钮是唯一的色彩焦点，指引客户深入阅读。

保存后刷新页面，看看现在的列表页是不是瞬间有了顶级工业厂牌