/**
 * ================================================
 * 法律提示：本程序/代码仅限合法用途使用，您可以修改自用，请保留版权
 * ================================================
 * 使用限制：禁止用于非法用途，作者不承担任何使用责任
 * ================================================
 * Copy right 2026 网博士网络工作室， 保留所有权利。
 * ================================================
 * 官方网址: www.网博士.com   联系：QQ: 570830288
 * ================================================
 */
/*
 * 首页在手机上的覆盖样式（template/default/index.php 用）。
 *
 * home-refresh.css 在 @media (max-width:767px) 里把首页这批板块写成了
 * display:none !important，配的是另一套移动专用块（.fk-mobile-*），
 * 所以这里要做两件事：
 *   1) 把桌面这套放出来 —— 对方是 !important，得比它更重（选择器前加 body）才行；
 *   2) 把桌面那套多列网格改成手机上放得下的列数（否则四列挤成一团）。
 */
@media (max-width:767px){
  /* 1) 解除 home-refresh.css 的隐藏。
     分类入口（.fk-categories）故意不在这里：卡片是「序号/内容/箭头」三列 + 一段
     卖点列表的富版式，手机上怎么压都很局促，按分类找商品本来也另有入口，
     所以让它继续吃 home-refresh.css 的 display:none（手机不显示）。 */
  body .fk-advantages,body .fk-tech,body .fk-partners,
  body .fk-onboarding,body .fk-security,body .fk-process,body .fk-data,
  body .fk-qx-feature{display:block !important;}

  /* 2) 板块留白：桌面上下 100px，手机上收一半多一点 */
  .fk-section{padding:44px 0;}
  .fk-qx-feature{padding:44px 0;}
  .fk-section-heading{margin-bottom:26px;}

  /* 3) 四列改两列 */
  .fk-scenario-grid,.fk-security-grid
  {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .fk-scenario-card,.fk-security-card{min-height:0;padding:15px 12px;}
  .fk-scenario-card img{width:52px;height:52px;}
  /* 精选商品选了「一行一个」的列表模式时，手机就一列 */
  .fk-security-grid.gc1{grid-template-columns:minmax(0,1fr);}

  /* 4) 购买流程：桌面是六步一条横线，手机上排三列两行，那条横线就没意义了 */
  .fk-process-line{width:100%;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 0;}
  .fk-process-line::before{display:none;}
  .fk-process-panels{margin-top:18px;}
  .fk-process-panel{padding:16px 14px;}

  /* 5) 数据证明、保障图标这两块（≤1080 已经是单列 / 两列，这里只收间距） */
  .fk-data-layout{gap:24px;}
  .fk-qx-cards{margin-top:28px;gap:12px;}
  .fk-qx-card{padding:18px 12px;}
}