@charset "utf-8";
/**
 * PT1958 首页样式
 * ---------------------------------------------------------------------------
 * 结构：首屏 Hero → 数据浮层 → 双受众价值（对齐主视觉海报）
 *      → 平台定位 → 四大铁律 → 四步上手 → 门店场景
 *      → 三重背书 → 发展历程 → 最新资讯 → 底部 CTA
 */

/* ===== 首屏轮播 =============================================================== */
.hero-slider {
  /* 高度 + 指示器距底是一对：数据条要上浮压住下沿（见 .home-figures），
     压入多少就得把指示器往上让多少，否则白卡会盖住进度条。
     520 是撤掉描述与双按钮后的复算值（内容高 240 + 呼吸 33 + 指示器 67 + 距底 76）。 */
  --hero-h: 660px;
  --hero-bar-b: 76px;
  --hero-dur: 4s;          /* 必须与生成器 pg_pages_a.py 的 HERO_INTERVAL 一致 */
  position: relative;
  height: var(--hero-h);
  background: var(--grad-ink);
  color: var(--c-on-ink);
  overflow: hidden;
  isolation: isolate;
}

.hero-slider__track { position: absolute; inset: 0; }

/* 非当前屏只用 opacity 叠起来，不用 visibility:hidden。
   原因：visibility:hidden（元素不参与绘制）+ fetchpriority="low" 会让 Chrome
   把该屏 <img> 的请求长期挂起，切过去时正好白屏；而且 visibility 翻转发生在
   淡入结束那一刻，会把交叉淡入切成硬切。改纯 opacity 后两点一起解决。
   键盘可达性由 JS 切 inert + aria-hidden 兜住。 */
.hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s ease;
}

.hero-slide.is-active {
  opacity: 1;
  pointer-events: auto;
}

/* 背景图：缓慢推近，避免静止画面发死 */
.hero-slide__media { position: absolute; inset: 0; overflow: hidden; }

.hero-slide__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.06);
  transition: transform 4.5s linear;
}

.hero-slide.is-active .hero-slide__media img { transform: scale(1); }

/* 左侧深色遮罩：保证白字可读，同时保持墨蓝体系 */
.hero-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(3, 17, 36, .95) 0%, rgba(4, 22, 46, .88) 46%, rgba(4, 22, 46, .6) 64%, rgba(4, 22, 46, .22) 84%, rgba(4, 22, 46, .42) 100%),
    linear-gradient(180deg, rgba(3, 17, 36, .5) 0%, transparent 22%, transparent 62%, rgba(3, 17, 36, .72) 100%);
  pointer-events: none;
}

.hero-slide__inner {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  align-items: center;
  /* 底部给指示器留高度、顶部留安全边——窄屏内容高，居中后会顶到 header 下面 */
  padding-top: 24px;
  padding-bottom: 96px;
}

.hero-slide__copy {
  width: 58%;
  max-width: 700px;
}

/* 逐项错峰进场 */
.hero-slide__copy > * {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .6s ease, transform .6s ease;
}

.hero-slide.is-active .hero-slide__copy > * { opacity: 1; transform: none; }
/* 进场延迟按子元素序号错开。这 5 条**全部留着**：
   当前首屏只渲染 3 块（eyebrow / title+sub / hint），后两条不生效；
   将来把描述或按钮加回来时，延迟序列不用再动。 */
.hero-slide.is-active .hero-slide__copy > *:nth-child(1) { transition-delay: .12s; }
.hero-slide.is-active .hero-slide__copy > *:nth-child(2) { transition-delay: .2s; }
.hero-slide.is-active .hero-slide__copy > *:nth-child(3) { transition-delay: .3s; }
.hero-slide.is-active .hero-slide__copy > *:nth-child(4) { transition-delay: .4s; }
.hero-slide.is-active .hero-slide__copy > *:nth-child(5) { transition-delay: .5s; }

.hero-slide__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-3);
  padding: 6px 16px 6px 8px;
  margin-bottom: var(--sp-5);
  border: 1px solid var(--c-neon-line);
  border-radius: 999px;
  background: rgba(47, 143, 255, .1);
  font-size: var(--fs-xs);
  letter-spacing: .09em;
  color: var(--c-neon-light);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.hero-slide__eyebrow::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--c-neon);
  box-shadow: 0 0 0 3px rgba(47, 143, 255, .25);
}

.hero-slide__title {
  /* 固定 56px 在 12 字的长标题上会溢出换行，改成随视口缩放 */
  font-size: clamp(38px, 4vw, 56px);
  font-weight: 700;
  line-height: 1.14;
  letter-spacing: -.01em;
  background: var(--grad-metal);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hero-slide__title span {
  display: block;
  font-size: .46em;
  font-weight: 500;
  letter-spacing: .05em;
  margin-top: var(--sp-4);
  color: var(--c-neon-light);
  -webkit-text-fill-color: var(--c-neon-light);
}

/* 首屏描述：2026-09-21 起**不再渲染**（手机端占 3~4 行太拥挤，用户要求删）。
   样式保留以备恢复——把 pg_pages_a.py::build_hero() 里的 <p class="hero-slide__desc">
   那行加回去即可，注意同时补回第 5 段进场延迟 nth-child(5)。 */
.hero-slide__desc {
  max-width: 560px;
  margin-top: var(--sp-4);
  font-size: var(--fs-md);
  line-height: 1.8;
  color: var(--c-on-ink-dim);
  /* 背景是照片，遮罩再厚也难免有亮区，加投影兜底 */
  text-shadow: 0 1px 14px rgba(3, 17, 36, .9);
  /* 窄屏换行时避免最后一行只剩两三个字 */
  text-wrap: pretty;
}

/* 首屏双 CTA 按钮：与描述段一同于 2026-09-21 撤下（手机端首屏太拥挤）。
   样式保留以备恢复——把 pg_pages_a.py::build_hero() 里的 .hero-slide__actions
   那两行 <a> 加回去即可。首屏 CTA 目前靠顶栏「在线申请入驻」+ 右侧浮标承接。 */
.hero-slide__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-4);
  margin-top: var(--sp-6);
}

/* 首屏信任标签行：2026-09-28 起**不再渲染**（压缩首屏文字，用户要求删）。
   样式保留以备恢复——把 pg_pages_a.py::build_hero() 里的 <ul class="hero-slide__hint">
   那几行加回去即可。 */
.hero-slide__hint {
  display: flex;
  align-items: center;
  gap: var(--sp-5);
  flex-wrap: wrap;
  margin-top: var(--sp-5);
  padding-top: var(--sp-4);
  border-top: 1px solid rgba(120, 190, 255, .18);
  font-size: var(--fs-sm);
  color: var(--c-on-ink-dim);
  list-style: none;
}

.hero-slide__hint b {
  font-family: var(--font-num);
  font-size: var(--fs-md);
  color: #fff;
  margin-right: 2px;
}

/* 左右箭头 */
.hero-slider__arrow {
  position: absolute;
  top: calc(50% - 28px);
  z-index: 4;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(120, 190, 255, .3);
  border-radius: 50%;
  background: rgba(4, 20, 42, .5);
  color: #fff;
  cursor: pointer;
  opacity: 0;
  transition: opacity .3s ease, background .25s ease, border-color .25s ease;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.hero-slider__arrow--prev { left: var(--sp-5); }
.hero-slider__arrow--next { right: var(--sp-5); }

.hero-slider:hover .hero-slider__arrow { opacity: 1; }
.hero-slider__arrow:hover { background: rgba(47, 143, 255, .9); border-color: var(--c-neon); }
.hero-slider__arrow:focus-visible { opacity: 1; outline: 2px solid var(--c-neon); outline-offset: 2px; }

/* 触屏设备没有 hover，箭头常驻（否则 iPad 这类宽屏触控永远看不到入口） */
@media (hover: none) {
  .hero-slider__arrow { opacity: .85; }
}

/* 指示器：纯进度条段（2026-09-28 起序号与屏名撤下，压缩首屏文字；
   屏名保留在按钮的 aria-label / title 上，读屏与悬停仍可达）。
   位置由 --hero-bar-b 控制（不是写死 24px）——数据条要上浮压住轮播下沿，
   指示器必须同步上移让位，否则会被白色卡片盖住。
   注意：这里必须靠外层 .barmask + .container 来对齐，
   直接给 bar 写 left/right:0 的话，绝对定位的包含块是整个轮播，
   会忽略 .container 的内距，文字直接怼到屏幕左边。 */
.hero-slider__barmask {
  position: absolute;
  left: 0;
  right: 0;
  bottom: var(--hero-bar-b);
  z-index: 3;
}

.hero-slider__bar {
  display: flex;
  gap: var(--sp-5);
}

.hero-slider__dot {
  flex: 1 1 0;
  min-width: 0;
  max-width: 180px;
  display: flex;
  flex-direction: column;
  padding: 0 0 8px;
  border: 0;
  background: none;
  cursor: pointer;
}

/* 序号与屏名样式保留以备恢复（把 pg_pages_a.py::build_hero() 里
   被注释掉的两行 <span> 加回模板即可）。 */
.hero-slider__dot-num {
  font-family: var(--font-num);
  font-size: var(--fs-xs);
  letter-spacing: .12em;
  opacity: .85;
  color: var(--c-on-ink-dim);
  text-shadow: 0 1px 10px rgba(3, 17, 36, .9);
}

.hero-slider__dot-text { font-size: var(--fs-sm); letter-spacing: .02em; color: var(--c-on-ink-dim); }

.hero-slider__dot-bar {
  display: block;
  height: 3px;
  border-radius: 2px;
  background: rgba(180, 214, 248, .38);
  overflow: hidden;
}

.hero-slider__dot:hover .hero-slider__dot-bar { background: rgba(180, 214, 248, .62); }

.hero-slider__dot-bar::after {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  background: var(--c-neon);
  transform: scaleX(0);
  transform-origin: left center;
}

.hero-slider__dot.is-active { color: #fff; }
.hero-slider__dot.is-active .hero-slider__dot-num { opacity: 1; color: var(--c-neon-light); }
.hero-slider__dot.is-active .hero-slider__dot-bar::after {
  animation: heroBar var(--hero-dur) linear forwards;
}

.hero-slider.is-paused .hero-slider__dot.is-active .hero-slider__dot-bar::after {
  animation-play-state: paused;
}

@keyframes heroBar {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-slide__media img { transform: none; transition: none; }
  .hero-slide__copy > * { opacity: 1; transform: none; transition: none; }
  .hero-slider__dot.is-active .hero-slider__dot-bar::after { animation: none; transform: scaleX(1); }
}

/* ===== 数据浮层 ====================================================== */
/* 上浮压住轮播下沿（白卡骑在深色区与浅色区交界上），视觉上有浮层感。
   上浮量必须小于 .hero-slider 的 --hero-bar-b，留出呼吸位，
   否则白卡会盖住轮播的进度条指示器（这个坑踩过两次）。 */
.home-figures {
  position: relative;
  z-index: 2;
  margin-top: -60px;
}

.home-figures .stat-strip { box-shadow: 0 24px 60px rgba(3, 14, 32, .28); }

/* ===== 双受众价值（对齐主视觉海报的双栏） ===================================================== */
.value-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-6);
}

.value-panel {
  position: relative;
  padding: var(--sp-7) var(--sp-6);
  border-radius: var(--radius-xl);
  border: 1px solid var(--c-neon-line);
  background: var(--grad-glass);
  overflow: hidden;
}

.value-panel::before {
  content: "";
  position: absolute;
  top: 0;
  left: var(--sp-6);
  right: var(--sp-6);
  height: 2px;
  background: var(--grad-neon);
  opacity: .7;
}

.value-panel--store::before { background: linear-gradient(90deg, #79c2ff, #2f8fff, transparent); }
.value-panel--brand::before { background: linear-gradient(90deg, #d8b06a, #f0d7a4, transparent); }

.value-panel__head {
  display: flex;
  align-items: baseline;
  gap: var(--sp-3);
  flex-wrap: wrap;
  padding-bottom: var(--sp-5);
  margin-bottom: var(--sp-5);
  border-bottom: 1px solid rgba(120, 190, 255, .16);
}

.value-panel__role {
  font-size: var(--fs-xs);
  letter-spacing: .16em;
  color: var(--c-on-ink-dim);
}

.value-panel__title {
  font-size: var(--fs-xl);
  color: #fff;
  letter-spacing: .01em;
}

.value-panel--brand .value-panel__title { color: #f0d7a4; }

.value-list { display: grid; gap: var(--sp-3); }

.value-item {
  display: flex;
  gap: var(--sp-4);
  padding: var(--sp-4) var(--sp-5);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(120, 190, 255, .1);
  transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}

.value-item:hover {
  background: rgba(47, 143, 255, .1);
  border-color: rgba(120, 190, 255, .34);
  transform: translateX(4px);
}

.value-item__icon {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(47, 143, 255, .16);
  color: var(--c-neon-light);
  font-size: 15px;
  box-shadow: inset 0 0 0 1px rgba(120, 190, 255, .28);
}

.value-panel--brand .value-item__icon {
  background: rgba(216, 176, 106, .14);
  color: #f0d7a4;
  box-shadow: inset 0 0 0 1px rgba(216, 176, 106, .3);
}

.value-item__name { font-size: var(--fs-base); font-weight: 600; color: #fff; }

.value-item__text {
  margin-top: 2px;
  font-size: var(--fs-sm);
  line-height: 1.65;
  color: var(--c-on-ink-dim);
}

/* ===== 发展历程（首页精简版 · 横向时间线） ===============================================
   2026-09-28 由卡片墙改成横轴时间线（参考稿样式，配色按本站墨蓝体系）：
   年份在上、圆点压线、标题与释义在下；底部跟一条墨蓝「名字释义」条。
   几何是写死的：年份槽高 40px + 圆点槽高 28px ⇒ 轴线中心 54px（top:53px 线高 2px），
   改槽高必须同步改 ::before 的 top。≤900px 降级为左侧竖轴。 */
.history-line {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--sp-5);
  margin: 0;
  padding: 0;
  list-style: none;
}

.history-line::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 53px;
  height: 2px;
  background: linear-gradient(90deg, rgba(28, 109, 208, .25), rgba(47, 143, 255, .6) 50%, rgba(28, 109, 208, .25));
}

.history-line__item { text-align: center; }

.history-line__year {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-num);
  font-size: var(--fs-xl);
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--c-accent);
}

.history-line__dot {
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.history-line__dot::after {
  content: "";
  position: relative;
  z-index: 1;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--c-neon);
  /* 实心描边把背后的轴线遮住，外圈再加光晕 */
  border: 3px solid var(--c-bg-soft);
  box-shadow: 0 0 0 4px rgba(47, 143, 255, .18);
}

.history-line__title { margin-top: var(--sp-2); font-size: var(--fs-base); color: var(--c-primary); font-weight: 600; }

.history-line__text {
  margin: var(--sp-2) auto 0;
  max-width: 230px;
  font-size: var(--fs-xs);
  line-height: 1.75;
  color: var(--c-text-muted);
}

/* 名字释义条：墨蓝底 + 1px 间隙当分隔线（容器底色即分隔色，列数变化不用改边框） */
.history-mean {
  margin-top: var(--sp-7);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  background: rgba(120, 190, 255, .18);
  border: 1px solid rgba(120, 190, 255, .18);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.history-mean__item {
  display: flex;
  gap: var(--sp-3);
  align-items: flex-start;
  padding: var(--sp-5);
  background: linear-gradient(168deg, #061224 0%, #0a2a4d 100%);
}

.history-mean__icon { flex: 0 0 auto; margin-top: 2px; color: var(--c-neon-light); }
.history-mean__title { font-size: var(--fs-base); font-weight: 600; color: #fff; }
.history-mean__text { margin-top: 3px; font-size: var(--fs-xs); line-height: 1.6; color: var(--c-on-ink-dim); }

/* ===== 合作伙伴 ===========================================================
   2026-09-28 起合作伙伴是独立栏目页 /partners/，首页不再引用；
   .partner-* 样式已整体迁至 pages/partners.css。 */

/* ===== 最新资讯 ================================================================== */
.news-mini-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-5); }

.news-mini {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease);
}

.news-mini:hover {
  transform: translateY(-5px);
  border-color: rgba(28, 109, 208, .3);
  box-shadow: var(--shadow-lg);
}

.news-mini__thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  background: linear-gradient(140deg, #0a203c, #103463);
  overflow: hidden;
}

.news-mini__thumb img { width: 100%; height: 100%; object-fit: cover; }

.news-mini__cat {
  position: absolute;
  left: var(--sp-4);
  top: var(--sp-4);
  padding: 3px 10px;
  border-radius: var(--radius-sm);
  background: rgba(4, 14, 30, .72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  font-size: var(--fs-xs);
  color: #fff;
}

.news-mini__body { padding: var(--sp-5); display: flex; flex-direction: column; flex: 1; }

.news-mini__title {
  font-size: var(--fs-base);
  color: var(--c-primary);
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.news-mini:hover .news-mini__title { color: var(--c-accent); }

.news-mini__desc {
  margin-top: var(--sp-3);
  font-size: var(--fs-sm);
  line-height: 1.7;
  color: var(--c-text-secondary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.news-mini__meta {
  margin-top: auto;
  padding-top: var(--sp-4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--fs-xs);
  color: var(--c-text-muted);
}


/* ===== 响应式 =================================================================== */
@media (max-width: 1200px) {
  /* 与 PC 档同高：撤掉描述和按钮后三屏内容高度完全一致，没有换行差异了 */
  .hero-slider { --hero-h: 620px; }
  .hero-slide__copy { width: 64%; }

  .history-mean { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news-mini-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  /* 这档高度与底部内距是量出来的，别凭感觉改：
     指示器（现仅进度条）+ 距底 24px，内距必须盖住它；
     窄屏不做「数据条上浮压首屏」：首屏本身已经被高度限制，压进去会挤掉文案。
     所以这里把指示器放回贴底 24px，上浮量在下面归零。 */
  .hero-slider { --hero-h: 560px; --hero-bar-b: 24px; }
  .hero-slide__inner { padding-bottom: 108px; }
  .hero-slide__copy { width: 80%; }
  .hero-slider__bar { gap: var(--sp-4); }
  .home-figures { margin-top: 0; }

  /* 合作品牌：每屏 3 张 */

  /* 时间线降级为左侧竖轴：轴在左 8px，圆点槽固定 18px 宽，
     年份/标题/释义全部进右列 */
  .history-line { grid-template-columns: 1fr; gap: var(--sp-6); }
  .history-line::before {
    left: 8px;
    right: auto;
    top: 8px;
    bottom: 8px;
    width: 2px;
    height: auto;
    background: linear-gradient(180deg, rgba(28, 109, 208, .25), rgba(47, 143, 255, .6) 50%, rgba(28, 109, 208, .25));
  }
  .history-line__item { display: grid; grid-template-columns: 18px 1fr; column-gap: var(--sp-4); text-align: left; }
  .history-line__year { grid-column: 2; grid-row: 1; height: auto; justify-content: flex-start; }
  .history-line__dot { grid-column: 1; grid-row: 1 / span 3; height: auto; align-items: flex-start; padding-top: 8px; }
  .history-line__title { grid-column: 2; margin-top: var(--sp-1); }
  .history-line__text { grid-column: 2; max-width: none; margin-left: 0; }
}

@media (max-width: 768px) {
  /* 首屏轮播：文案通栏、指示器只留数字。
     460 是撤掉描述与双按钮后按实测定的（内容 ~190 + 指示器 38 + 距底 24 + 留白）。 */
  .hero-slider { --hero-h: 540px; }
  .hero-slide__inner { padding-top: 20px; padding-bottom: 96px; }

  /* 窄屏文案占满宽度，左侧压暗那套不管用了，改成整体压暗 */
  .hero-slide::after {
    background: linear-gradient(180deg,
      rgba(3, 17, 36, .84) 0%,
      rgba(3, 17, 36, .68) 40%,
      rgba(3, 17, 36, .74) 68%,
      rgba(3, 17, 36, .92) 100%);
  }
  .hero-slide__copy { width: 100%; }
  .hero-slide__eyebrow { margin-bottom: var(--sp-4); padding: 5px 14px 5px 8px; letter-spacing: .06em; }
  .hero-slide__title { line-height: 1.2; }
  .hero-slide__title span { font-size: .5em; margin-top: var(--sp-3); }
  .hero-slide__desc { margin-top: var(--sp-3); font-size: var(--fs-base); line-height: 1.75; }
  .hero-slide__actions { flex-direction: column; align-items: stretch; gap: var(--sp-3); margin-top: var(--sp-5); }
  .hero-slide__actions .btn { width: 100%; }
  .hero-slide__hint { gap: var(--sp-2) var(--sp-4); margin-top: var(--sp-4); padding-top: var(--sp-3); font-size: var(--fs-xs); }
  /* 窄屏只留两条承诺，避免换行把内容撑高 */
  .hero-slide__hint li:nth-child(n + 3) { display: none; }

  /* 触屏没有 hover，箭头常驻 */
  .hero-slider__arrow { opacity: .9; width: 38px; height: 38px; }
  .hero-slider__arrow--prev { left: var(--sp-3); }
  .hero-slider__arrow--next { right: var(--sp-3); }

  .hero-slider__bar { gap: var(--sp-3); }
  .hero-slider__dot { max-width: none; }

  .value-split { grid-template-columns: 1fr; }
  .value-panel { padding: var(--sp-6) var(--sp-4); }
  .value-item { padding: var(--sp-4); gap: var(--sp-3); }
  .value-item__icon { width: 30px; height: 30px; font-size: 14px; }

  .news-mini-grid { grid-template-columns: 1fr; }
  .news-mini__body { padding: var(--sp-4); }
}

@media (max-width: 420px) {
  .hero-slider__arrow { display: none; }
  .history-mean { grid-template-columns: 1fr; }
}