/* ============================================================
 * Bulma 主题层（全站框架协调）
 * 在 bulma.min.css 与 base.css 之后加载：
 *  1) 品牌主色映射到 Bulma 变量（#ec1717）
 *  2) Bulma 组件与站点自定义组件的协调（navbar / columns / card / section…）
 *  3) 双端（桌面 1024+ / 手机）微调
 * ============================================================ */
:root{
  --bulma-primary-h: 4; --bulma-primary-s: 84%; --bulma-primary-l: 51%;
  --bulma-link-h: 4; --bulma-link-s: 84%; --bulma-link-l: 51%;
  --bulma-family-primary: var(--sans);
  --bulma-family-secondary: var(--serif);
  --bulma-body-font-size: 1em;
  --bulma-radius: 8px;
  --bulma-radius-small: 6px;
  --bulma-card-radius: 14px;
  --bulma-control-radius: 10px;
}

/* ---------- 顶部导航：Bulma navbar 与站点 hd 协调 ---------- */
.hd.navbar{
  min-height: 64px;
  padding: 0 max(16px, calc((100vw - 1080px) / 2));
  background: var(--paper);
  border-bottom: 3px solid var(--red);
  box-shadow: 0 6px 14px -6px rgba(25,24,22,.18);
}
.hd.navbar .navbar-brand{ align-items: center; min-height: 64px; }
.hd.navbar .hd__brand{ display: flex; align-items: center; gap: .16rem; }
.hd.navbar .navbar-menu{ flex-grow: 1; }
.hd.navbar .navbar-end{ margin-left: auto; align-items: center; }
.hd.navbar .navbar-item{
  font-size: 15px;
  color: var(--ink-2);
  border-radius: 999px;
  margin: 0 2px;
  padding: 9px 16px;
  transition: background .2s ease, color .2s ease;
}
.hd.navbar .navbar-item:hover{ background: #ec171712; color: var(--red); }
.hd.navbar .hd__right{ display: flex; align-items: center; margin-left: 10px; flex-shrink: 0; }
.hd.navbar .hd__menu,
.hd.navbar .hd__back{
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 600;
  color: var(--red); border: 1px solid rgba(236,23,23,.4);
  border-radius: 999px; padding: 8px 16px;
  cursor: pointer; transition: all .2s ease; white-space: nowrap;
}
.hd.navbar .hd__menu:hover,
.hd.navbar .hd__back:hover{ background: var(--red); color: #fff; }
@media (max-width: 1023px){
  /* 手机端导航折叠（保持改造前行为：仅品牌+右侧入口） */
  .hd.navbar .navbar-menu{ display: none; }
  .hd.navbar .hd__right{ margin-left: auto; }
}
@media (min-width: 1024px){
  .hd.navbar{
    position: sticky; top: 0; z-index: 100;
    background: #fffffff0; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--line);
  }
}

/* ---------- 底部导航 tabbar：Bulma 无此组件，基于工具类定制 ---------- */
.tabbar{
  flex-shrink: 0; height: 3.2rem;
  background: #fffffff5; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-top: 1px solid var(--line); display: flex; z-index: 50;
}
.tabbar .item{ flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--ink-3); font-size: 12px; cursor: pointer; }
.tabbar .item.on{ color: var(--red); font-weight: 600; }
.tabbar .item svg{ width: 22px; height: 22px; }
@media (min-width: 1024px){ .tabbar{ display: none; } }

/* ---------- 通用容器/分区 ---------- */
.quce-section{ padding: .4rem .3rem; }
.quce-container{ max-width: 1080px; margin: 0 auto; }
@media (min-width: 1024px){
  .quce-section{ padding: 2rem 28px 2.4rem; }
}

/* ---------- Bulma 卡片与站点视觉协调 ---------- */
.card.quce-card{
  border-radius: 14px; box-shadow: 0 6px 20px rgba(25,24,22,.08);
  transition: transform .28s ease, box-shadow .28s ease;
  overflow: hidden; border: none;
}
.card.quce-card:hover{ transform: translateY(-3px); box-shadow: 0 14px 34px rgba(25,24,22,.13); }
.card.quce-card .card-content{ padding: 1.1rem; }
/* 文章/栏目卡片：内容区占满定制 padding */
.card.quce-card.item .card-content,
.card.quce-card.hot .card-content,
.card.quce-card.side .card-content{ padding: 0; }

/* ---------- 按钮统一 ---------- */
.button.quce-btn{ border-radius: 999px; font-weight: 600; letter-spacing: .05em; }
.button.is-primary.quce-btn{ background: var(--red); border-color: var(--red); }
.button.is-primary.quce-btn:hover{ background: #d41414; border-color: #d41414; }

/* ---------- 表单 ---------- */
.field .label{ font-size: .92em; color: var(--ink-2); font-weight: 600; }
.input.quce-input, .select.quce-select select, .textarea.quce-textarea{
  border-color: var(--line); border-radius: 10px; box-shadow: none;
}
.input.quce-input:focus, .textarea.quce-textarea:focus{ border-color: var(--red); box-shadow: 0 0 0 .125em rgba(236,23,23,.15); }

/* ---------- 进度条 / 标签 ---------- */
.progress.quce-progress{ height: 6px; border-radius: 3px; background: var(--line); }
.progress.quce-progress::-webkit-progress-value{ background: var(--red); border-radius: 3px; }
.progress.quce-progress::-moz-progress-bar{ background: var(--red); border-radius: 3px; }
.tags.quce-tags .tag{ border-radius: 999px; height: auto; line-height: 1.5; }

/* ---------- 通知/提示 ---------- */
.notification.quce-notice{ border-radius: 12px; }

/* ---------- 表格 ---------- */
.table.quce-table th{ color: var(--ink-2); }
.table.quce-table td{ vertical-align: middle; }

/* ---------- 首页组件协调 ---------- */
.cats.columns{ margin-left: 0; margin-right: 0; display: flex; }
.cats.columns .column{ padding-left: .06rem; padding-right: .06rem; }
.hero__cta.button{ border: none; height: auto; line-height: 1.25; }
.section.list{ padding: 0 .26rem; }
@media (min-width: 1024px){
  .cats.columns .column{ padding-left: .3rem; padding-right: .3rem; }
  .section.list{ padding: 0; }
}