/* ==========================================================================
   RefrioCore — main.css
   全站基础样式：reset / :root 设计令牌 / 通用组件 / 页头三种布局 /
   页脚 / 响应式 / 无障碍 / prefers-reduced-motion
   主题色由 PHP 在 wp_head 注入 :root{--rf-color-primary:...} 内联变量，
   此处提供一组冷工业蓝回退默认值。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Reset 基础
   -------------------------------------------------------------------------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--rf-font-body);
  font-size: var(--rf-fs-base);
  line-height: var(--rf-lh-body);
  color: var(--rf-color-text);
  background: var(--rf-color-bg);
  -webkit-font-smoothing: antialiased;
}

img,
svg,
video {
  max-width: 100%;
  height: auto;
  display: block;
}

img {
  border-style: none;
}

input,
button,
textarea,
select {
  font: inherit;
  color: inherit;
}

button {
  cursor: pointer;
}

a {
  color: var(--rf-color-primary);
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover,
a:focus-visible {
  color: var(--rf-color-primary-dark);
  text-decoration: underline;
}

ul,
ol {
  margin: 0 0 var(--rf-space-md);
  padding-inline-start: 1.25em;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--rf-font-heading);
  line-height: var(--rf-lh-heading);
  color: var(--rf-color-heading);
  margin: 0 0 var(--rf-space-sm);
  font-weight: 700;
  text-wrap: balance;
}

p {
  margin: 0 0 var(--rf-space-md);
}

hr {
  border: 0;
  border-top: 1px solid var(--rf-color-border);
  margin: var(--rf-space-lg) 0;
}

table {
  border-collapse: collapse;
  width: 100%;
}

blockquote {
  margin: 0 0 var(--rf-space-md);
  padding: var(--rf-space-sm) var(--rf-space-md);
  border-inline-start: 3px solid var(--rf-color-primary);
  color: var(--rf-color-text-muted);
}

code,
pre {
  font-family: var(--rf-font-mono, ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace);
  font-size: 0.9em;
}

pre {
  overflow: auto;
  padding: var(--rf-space-sm);
  background: var(--rf-color-bg-alt);
  border-radius: var(--rf-radius-sm);
}

figure {
  margin: 0 0 var(--rf-space-md);
}

/* 清除浮动（旧内容兼容） */
.rf-container::after,
.rf-section::after {
  content: "";
  display: table;
  clear: both;
}

/* --------------------------------------------------------------------------
   2. :root 设计令牌（颜色 / 字体 / 间距 / 圆角 / 断点 / 阴影 / 层级）
   -------------------------------------------------------------------------- */
:root {
  /* 颜色 —— 冷工业蓝默认回退，运行时可被 Locale 注入的 :root 覆盖 */
  --rf-color-primary: #0B5FFF;
  --rf-color-primary-dark: #0949C0;
  --rf-color-primary-light: #E8F0FF;
  --rf-color-accent: #00B4D8;
  --rf-color-heading: #0E1B2C;
  --rf-color-text: #2A3646;
  --rf-color-text-muted: #5A6B80;
  --rf-color-bg: #FFFFFF;
  --rf-color-bg-alt: #F4F7FB;
  --rf-color-bg-dark: #0E1B2C;
  --rf-color-border: #DCE4EE;
  --rf-color-success: #1E9E5A;
  --rf-color-danger: #D63638;
  --rf-color-warning: #E0A100;

  /* 字体 */
  --rf-font-heading: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --rf-font-body: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --rf-fs-xs: 0.75rem;
  --rf-fs-sm: 0.875rem;
  --rf-fs-base: 1rem;
  --rf-fs-lg: 1.125rem;
  --rf-fs-h1: clamp(1.875rem, 1.2rem + 2.6vw, 3rem);
  --rf-fs-h2: clamp(1.5rem, 1.05rem + 1.8vw, 2.25rem);
  --rf-fs-h3: clamp(1.25rem, 1rem + 1vw, 1.625rem);
  --rf-lh-body: 1.7;
  --rf-lh-heading: 1.25;

  /* 间距 */
  --rf-space-xs: 0.25rem;
  --rf-space-sm: 0.5rem;
  --rf-space-md: 1rem;
  --rf-space-lg: 1.5rem;
  --rf-space-xl: 2.5rem;
  --rf-space-2xl: 4rem;

  /* 圆角 */
  --rf-radius-sm: 4px;
  --rf-radius-md: 8px;
  --rf-radius-lg: 14px;
  --rf-radius-pill: 999px;

  /* 阴影 */
  --rf-shadow-sm: 0 1px 3px rgba(14, 27, 44, 0.08);
  --rf-shadow-md: 0 4px 14px rgba(14, 27, 44, 0.10);
  --rf-shadow-lg: 0 12px 32px rgba(14, 27, 44, 0.16);

  /* 层级 */
  --rf-z-header: 100;
  --rf-z-drawer: 300;
  --rf-z-overlay: 250;
  --rf-z-compare: 200;
  --rf-z-toast: 400;

  /* 断点（供 JS 与文档对照，CSS 中以媒体查询硬编码使用） */
  --rf-bp-sm: 480px;
  --rf-bp-md: 768px;
  --rf-bp-lg: 1024px;
  --rf-bp-xl: 1280px;
  --rf-bp-xxl: 1600px;
  --rf-bp-4k: 2200px;

  /* 过渡 */
  --rf-transition: 0.25s ease;
}

/* --------------------------------------------------------------------------
   3. 无障碍工具类
   -------------------------------------------------------------------------- */
.screen-reader-text {
  border: 0;
  clip-path: inset(50%);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  width: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background: var(--rf-color-bg);
  clip-path: none;
  clip: auto;
  color: var(--rf-color-primary-dark);
  display: block;
  font-size: var(--rf-fs-sm);
  font-weight: 700;
  height: auto;
  width: auto;
  left: var(--rf-space-sm);
  line-height: normal;
  padding: var(--rf-space-sm) var(--rf-space-md);
  text-decoration: none;
  top: var(--rf-space-sm);
  z-index: 100000;
  border-radius: var(--rf-radius-sm);
  box-shadow: var(--rf-shadow-md);
}

.rf-skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
}

.rf-skip-link:focus {
  left: var(--rf-space-sm);
  top: var(--rf-space-sm);
  z-index: 100000;
  background: var(--rf-color-bg);
  color: var(--rf-color-primary);
  padding: var(--rf-space-sm) var(--rf-space-md);
  border-radius: var(--rf-radius-sm);
  box-shadow: var(--rf-shadow-md);
}

:focus-visible {
  outline: 2px solid var(--rf-color-primary);
  outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   4. 布局通用：容器 / 区块 / 网格 / 卡片
   -------------------------------------------------------------------------- */
.rf-container {
  width: 100%;
  max-width: 1320px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 3vw, 2rem);
}

.rf-section {
  padding-block: clamp(var(--rf-space-xl), 5vw, var(--rf-space-2xl));
}

.rf-section--alt {
  background: var(--rf-color-bg-alt);
}

.rf-section--tight {
  padding-block: clamp(var(--rf-space-lg), 3vw, var(--rf-space-xl));
}

.rf-grid {
  display: grid;
  gap: var(--rf-space-lg);
}

.rf-grid--2 { grid-template-columns: repeat(2, 1fr); }
.rf-grid--3 { grid-template-columns: repeat(3, 1fr); }
.rf-grid--4 { grid-template-columns: repeat(4, 1fr); }
.rf-grid--series { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rf-grid--products { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rf-grid--solutions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rf-grid--documents { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rf-grid--news { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* 区块标题风格 */
.rf-section__header {
  max-width: 720px;
  margin: 0 auto var(--rf-space-xl);
  text-align: center;
}

.rf-section__header--left {
  margin-inline: 0;
  text-align: start;
}

.rf-section__eyebrow {
  display: inline-block;
  font-size: var(--rf-fs-sm);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rf-color-primary);
  margin-bottom: var(--rf-space-xs);
}

.rf-section__title {
  font-size: var(--rf-fs-h2);
  margin-bottom: var(--rf-space-sm);
}

.rf-section__desc {
  color: var(--rf-color-text-muted);
  margin: 0;
}

/* 卡片 */
.rf-card {
  background: var(--rf-color-bg);
  border: 1px solid var(--rf-color-border);
  border-radius: var(--rf-radius-md);
  padding: var(--rf-space-lg);
  box-shadow: var(--rf-shadow-sm);
  transition: transform var(--rf-transition), box-shadow var(--rf-transition),
    border-color var(--rf-transition);
}

a.rf-card:hover,
a.rf-card:focus-visible,
.rf-card--hover:hover {
  transform: translateY(-4px);
  box-shadow: var(--rf-shadow-lg);
  border-color: var(--rf-color-primary-light);
  text-decoration: none;
}

.rf-card__title {
  font-size: var(--rf-fs-h3);
  margin-bottom: var(--rf-space-xs);
}

.rf-card__title a {
  color: inherit;
}

.rf-card__meta {
  font-size: var(--rf-fs-sm);
  color: var(--rf-color-text-muted);
}

.rf-card__excerpt {
  color: var(--rf-color-text-muted);
  margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   5. 按钮
   -------------------------------------------------------------------------- */
.rf-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--rf-space-sm);
  padding: 0.7em 1.5em;
  font-family: var(--rf-font-heading);
  font-size: var(--rf-fs-sm);
  font-weight: 600;
  line-height: 1.2;
  border-radius: var(--rf-radius-sm);
  border: 1px solid transparent;
  text-decoration: none;
  transition: background var(--rf-transition), color var(--rf-transition),
    border-color var(--rf-transition), transform var(--rf-transition),
    box-shadow var(--rf-transition);
  cursor: pointer;
  white-space: nowrap;
}

.rf-btn:hover,
.rf-btn:focus-visible {
  text-decoration: none;
  transform: translateY(-1px);
}

.rf-btn:active {
  transform: translateY(0);
}

.rf-btn[disabled],
.rf-btn.is-disabled {
  opacity: 0.55;
  pointer-events: none;
}

.rf-btn--primary {
  background: var(--rf-color-primary);
  color: #fff;
}

.rf-btn--primary:hover,
.rf-btn--primary:focus-visible {
  background: var(--rf-color-primary-dark);
  color: #fff;
  box-shadow: var(--rf-shadow-md);
}

.rf-btn--ghost {
  background: transparent;
  color: var(--rf-color-primary);
  border-color: var(--rf-color-primary);
}

.rf-btn--ghost:hover,
.rf-btn--ghost:focus-visible {
  background: var(--rf-color-primary);
  color: #fff;
}

.rf-btn--small {
  padding: 0.4em 0.9em;
  font-size: var(--rf-fs-xs);
}

/* --------------------------------------------------------------------------
   6. 表单基础
   -------------------------------------------------------------------------- */
.rf-form label,
.rf-field label {
  display: block;
  font-size: var(--rf-fs-sm);
  font-weight: 600;
  margin-bottom: var(--rf-space-xs);
}

.rf-form input[type="text"],
.rf-form input[type="email"],
.rf-form input[type="tel"],
.rf-form input[type="number"],
.rf-form input[type="search"],
.rf-form input[type="url"],
.rf-form select,
.rf-form textarea,
.rf-input,
.rf-select,
.rf-textarea {
  width: 100%;
  padding: 0.6em 0.85em;
  border: 1px solid var(--rf-color-border);
  border-radius: var(--rf-radius-sm);
  background: var(--rf-color-bg);
  color: var(--rf-color-text);
  transition: border-color var(--rf-transition), box-shadow var(--rf-transition);
}

.rf-form input:focus,
.rf-form select:focus,
.rf-form textarea:focus,
.rf-input:focus,
.rf-select:focus,
.rf-textarea:focus {
  outline: none;
  border-color: var(--rf-color-primary);
  box-shadow: 0 0 0 3px var(--rf-color-primary-light);
}

.rf-form textarea,
.rf-textarea {
  min-height: 8em;
  resize: vertical;
}

.rf-required {
  color: var(--rf-color-danger);
  margin-inline-start: 2px;
}

.rf-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 0.5em;
  font-weight: 400;
}

.rf-checkbox input[type="checkbox"],
.rf-checkbox input[type="radio"] {
  flex: 0 0 auto;
  margin-top: 0.25em;
  accent-color: var(--rf-color-primary);
  width: 1.05em;
  height: 1.05em;
}

/* 搜索表单 */
.rf-search-form {
  display: flex;
  gap: var(--rf-space-xs);
}

.rf-search-form__input {
  flex: 1 1 auto;
  min-width: 0;
}

.rf-search-form.is-focused .rf-search-form__input {
  border-color: var(--rf-color-primary);
  box-shadow: 0 0 0 3px var(--rf-color-primary-light);
}

/* --------------------------------------------------------------------------
   7. 页面头部（面包屑之前的内容页头）与分页
   -------------------------------------------------------------------------- */
.rf-page-header {
  background: var(--rf-color-bg-alt);
  padding-block: var(--rf-space-lg) var(--rf-space-lg);
  border-block-end: 1px solid var(--rf-color-border);
}

.rf-page-header__title {
  font-size: var(--rf-fs-h1);
  margin: 0 0 var(--rf-space-xs);
}

.rf-page-header__desc {
  color: var(--rf-color-text-muted);
  margin: 0;
  max-width: 720px;
}

.rf-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--rf-space-xs);
  margin-block-start: var(--rf-space-xl);
}

.rf-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5em;
  height: 2.5em;
  padding-inline: 0.6em;
  border: 1px solid var(--rf-color-border);
  border-radius: var(--rf-radius-sm);
  color: var(--rf-color-text);
  font-size: var(--rf-fs-sm);
  text-decoration: none;
  transition: background var(--rf-transition), color var(--rf-transition),
    border-color var(--rf-transition);
}

.rf-pagination .page-numbers:hover,
.rf-pagination .page-numbers:focus-visible {
  border-color: var(--rf-color-primary);
  color: var(--rf-color-primary);
  text-decoration: none;
}

.rf-pagination .page-numbers.current {
  background: var(--rf-color-primary);
  border-color: var(--rf-color-primary);
  color: #fff;
  pointer-events: none;
}

.rf-pagination .page-numbers.dots {
  border: 0;
  pointer-events: none;
}

/* 面包屑 */
.rf-breadcrumbs {
  font-size: var(--rf-fs-sm);
  color: var(--rf-color-text-muted);
  padding-block: var(--rf-space-sm);
}

.rf-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  list-style: none;
  margin: 0;
  padding: 0;
}

.rf-breadcrumbs li:not(:last-child)::after {
  content: "/";
  margin-inline-start: 0.5em;
  color: var(--rf-color-border);
}

.rf-breadcrumbs a {
  color: var(--rf-color-text-muted);
}

.rf-breadcrumbs a:hover {
  color: var(--rf-color-primary);
}

.rf-breadcrumbs [aria-current="page"] {
  color: var(--rf-color-text);
  font-weight: 600;
}

/* --------------------------------------------------------------------------
   8. 顶部工具条 Topbar
   -------------------------------------------------------------------------- */
.rf-topbar {
  background: var(--rf-color-bg-dark);
  color: rgba(255, 255, 255, 0.85);
  font-size: var(--rf-fs-xs);
}

.rf-topbar__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--rf-space-sm);
  min-height: 2.4em;
  padding-block: 0.25em;
}

.rf-topbar a {
  color: rgba(255, 255, 255, 0.85);
}

.rf-topbar a:hover {
  color: #fff;
}

.rf-topbar__group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--rf-space-md);
}

/* --------------------------------------------------------------------------
   9. 站点页头：三种布局
   -------------------------------------------------------------------------- */
.rf-site-header {
  position: sticky;
  top: 0;
  z-index: var(--rf-z-header);
  background: var(--rf-color-bg);
  border-block-end: 1px solid var(--rf-color-border);
  transition: box-shadow var(--rf-transition);
}

.rf-site-header.is-scrolled {
  box-shadow: var(--rf-shadow-md);
}

.rf-header__inner {
  display: flex;
  align-items: center;
  gap: var(--rf-space-lg);
  min-height: 76px;
}

.rf-header__logo {
  display: inline-flex;
  align-items: center;
  gap: var(--rf-space-sm);
  font-family: var(--rf-font-heading);
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--rf-color-heading);
  text-decoration: none;
  flex: 0 0 auto;
}

.rf-header__logo img {
  max-height: 48px;
  width: auto;
}

.rf-header__logo:hover {
  color: var(--rf-color-primary);
  text-decoration: none;
}

.rf-header__actions {
  display: flex;
  align-items: center;
  gap: var(--rf-space-md);
  margin-inline-start: auto;
  flex: 0 0 auto;
}

.rf-header__search {
  width: 200px;
}

/* 主导航 */
.rf-main-nav {
  flex: 1 1 auto;
}

.rf-main-nav__menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--rf-space-xs);
  list-style: none;
  margin: 0;
  padding: 0;
}

.rf-main-nav__menu > li {
  position: relative;
}

.rf-main-nav__menu a {
  display: block;
  padding: 0.6em 0.9em;
  font-family: var(--rf-font-heading);
  font-size: var(--rf-fs-sm);
  font-weight: 600;
  color: var(--rf-color-heading);
  border-radius: var(--rf-radius-sm);
  text-decoration: none;
  transition: color var(--rf-transition), background var(--rf-transition);
}

.rf-main-nav__menu a:hover,
.rf-main-nav__menu a:focus-visible,
.rf-main-nav__menu .current-menu-item > a,
.rf-main-nav__menu .current_page_item > a,
.rf-main-nav__menu .current-menu-ancestor > a {
  color: var(--rf-color-primary);
  background: var(--rf-color-primary-light);
  text-decoration: none;
}

/* 下拉子菜单：hover + :focus-within 键盘可达 */
.rf-main-nav__menu .sub-menu {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  min-width: 220px;
  margin: 0;
  padding: var(--rf-space-xs) 0;
  list-style: none;
  background: var(--rf-color-bg);
  border: 1px solid var(--rf-color-border);
  border-radius: var(--rf-radius-md);
  box-shadow: var(--rf-shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity var(--rf-transition), transform var(--rf-transition), visibility var(--rf-transition);
  z-index: 10;
}

.rf-main-nav__menu li:hover > .sub-menu,
.rf-main-nav__menu li:focus-within > .sub-menu,
.rf-main-nav__menu .is-open > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.rf-main-nav__menu .sub-menu a {
  padding: 0.5em 1.1em;
  border-radius: 0;
}

.rf-main-nav__menu .sub-menu .sub-menu {
  top: 0;
  inset-inline-start: 100%;
}

.rf-main-nav__menu .menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin-inline-start: 0.45em;
  border-inline-start: 4px solid currentColor;
  border-block-start: 4px solid transparent;
  border-block-end: 4px solid transparent;
  vertical-align: middle;
  opacity: 0.6;
}

/* --- 布局 1：左 logo，右导航（默认） --- */
.rf-header--layout-1 .rf-header__inner {
  justify-content: space-between;
}

.rf-header--layout-1 .rf-main-nav {
  flex: 0 1 auto;
}

/* --- 布局 2：居中 logo，上下两行导航 --- */
.rf-header--layout-2 .rf-header__inner {
  flex-direction: column;
  gap: var(--rf-space-xs);
  padding-block: var(--rf-space-sm);
  min-height: 0;
}

.rf-header--layout-2 .rf-main-nav__menu {
  justify-content: center;
}

/* --- 布局 3：logo 左，搜索与工具右 --- */
.rf-header--layout-3 .rf-header__search {
  width: 260px;
}

/* --------------------------------------------------------------------------
   10. 汉堡与移动抽屉
   -------------------------------------------------------------------------- */
.rf-nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 10px;
  background: transparent;
  border: 1px solid var(--rf-color-border);
  border-radius: var(--rf-radius-sm);
  cursor: pointer;
}

.rf-nav-toggle__bar {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--rf-color-heading);
  border-radius: var(--rf-radius-pill);
  transition: transform var(--rf-transition), opacity var(--rf-transition);
}

.rf-nav-toggle[aria-expanded="true"] .rf-nav-toggle__bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.rf-nav-toggle[aria-expanded="true"] .rf-nav-toggle__bar:nth-child(2) {
  opacity: 0;
}

.rf-nav-toggle[aria-expanded="true"] .rf-nav-toggle__bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

.rf-mobile-nav {
  position: fixed;
  inset-block: 0;
  inset-inline-start: 0;
  width: min(88vw, 340px);
  background: var(--rf-color-bg);
  box-shadow: var(--rf-shadow-lg);
  transform: translateX(-102%);
  visibility: hidden;
  transition: transform 0.3s ease, visibility 0.3s ease;
  z-index: var(--rf-z-drawer);
  overflow-y: auto;
  padding: var(--rf-space-lg) var(--rf-space-md);
}

[dir="rtl"] .rf-mobile-nav {
  transform: translateX(102%);
}

.rf-mobile-nav.is-open {
  transform: translateX(0);
  visibility: visible;
}

.rf-mobile-nav__close {
  position: absolute;
  top: var(--rf-space-md);
  inset-inline-end: var(--rf-space-md);
  width: 40px;
  height: 40px;
  border: 1px solid var(--rf-color-border);
  border-radius: var(--rf-radius-sm);
  background: var(--rf-color-bg);
  font-size: 1.1rem;
  line-height: 1;
}

.rf-mobile-nav__menu {
  list-style: none;
  margin: var(--rf-space-lg) 0 0;
  padding: 0;
}

.rf-mobile-nav__menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8em 0.5em;
  font-family: var(--rf-font-heading);
  font-weight: 600;
  color: var(--rf-color-heading);
  border-block-end: 1px solid var(--rf-color-border);
  text-decoration: none;
}

.rf-mobile-nav__menu .sub-menu {
  list-style: none;
  margin: 0;
  padding-inline-start: 1em;
  display: none;
}

.rf-mobile-nav__menu .is-open > .sub-menu {
  display: block;
}

.rf-mobile-nav__menu .sub-menu a {
  font-weight: 400;
  color: var(--rf-color-text-muted);
}

.rf-mobile-nav__toggle {
  background: none;
  border: 0;
  padding: 0.5em;
  color: var(--rf-color-primary);
  font-size: 1rem;
}

/* 抽屉打开时页面锁定 */
body.rf-nav-lock {
  overflow: hidden;
}

/* --------------------------------------------------------------------------
   11. Hero 区块
   -------------------------------------------------------------------------- */
.rf-hero {
  background:
    linear-gradient(135deg, rgba(11, 95, 255, 0.92) 0%, rgba(0, 180, 216, 0.85) 100%),
    var(--rf-color-bg-dark);
  color: #fff;
  padding-block: clamp(var(--rf-space-2xl), 8vw, 7rem);
  text-align: center;
}

.rf-hero__inner {
  max-width: 820px;
  margin-inline: auto;
}

.rf-hero__eyebrow {
  display: inline-block;
  font-size: var(--rf-fs-sm);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: var(--rf-radius-pill);
  padding: 0.3em 1em;
  margin-bottom: var(--rf-space-md);
}

.rf-hero__title {
  color: #fff;
  font-size: clamp(2rem, 1.2rem + 3.5vw, 3.5rem);
  margin-bottom: var(--rf-space-md);
}

.rf-hero__desc {
  color: rgba(255, 255, 255, 0.88);
  font-size: var(--rf-fs-lg);
  margin-bottom: var(--rf-space-xl);
}

.rf-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--rf-space-md);
}

.rf-hero .rf-btn--primary {
  background: #fff;
  color: var(--rf-color-primary-dark);
}

.rf-hero .rf-btn--ghost {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.7);
}

.rf-hero .rf-btn--ghost:hover {
  background: rgba(255, 255, 255, 0.15);
}

/* --------------------------------------------------------------------------
   12. 回到顶部按钮（JS 自动插入）
   -------------------------------------------------------------------------- */
.rf-to-top {
  position: fixed;
  inset-inline-end: var(--rf-space-md);
  inset-block-end: calc(var(--rf-space-lg) + 64px); /* 避开 compare-bar */
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--rf-color-bg);
  color: var(--rf-color-primary);
  border: 1px solid var(--rf-color-border);
  border-radius: var(--rf-radius-pill);
  box-shadow: var(--rf-shadow-md);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity var(--rf-transition), transform var(--rf-transition), visibility var(--rf-transition);
  z-index: var(--rf-z-compare);
}

.rf-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.rf-to-top:hover {
  color: var(--rf-color-primary-dark);
  border-color: var(--rf-color-primary);
}

/* --------------------------------------------------------------------------
   13. 页脚
   -------------------------------------------------------------------------- */
.rf-site-footer {
  background: var(--rf-color-bg-dark);
  color: rgba(255, 255, 255, 0.75);
  margin-block-start: var(--rf-space-2xl);
  font-size: var(--rf-fs-sm);
}

.rf-site-footer a {
  color: rgba(255, 255, 255, 0.75);
}

.rf-site-footer a:hover {
  color: #fff;
}

.rf-footer__widgets {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--rf-space-xl);
  padding-block: var(--rf-space-2xl) var(--rf-space-xl);
}

.rf-footer__col .widget-title,
.rf-footer__col h2,
.rf-footer__col h3 {
  color: #fff;
  font-size: var(--rf-fs-base);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: var(--rf-space-md);
}

.rf-footer__col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rf-footer__col li + li {
  margin-block-start: var(--rf-space-xs);
}

.rf-footer__col .rf-search-form input {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.rf-footer__bottom {
  border-block-start: 1px solid rgba(255, 255, 255, 0.12);
  padding-block: var(--rf-space-md);
}

.rf-footer__bottom .rf-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--rf-space-sm);
}

.rf-footer__bottom p {
  margin: 0;
}

/* --------------------------------------------------------------------------
   14. 文章内容区
   -------------------------------------------------------------------------- */
.rf-content-area {
  padding-block: var(--rf-space-xl);
}

.entry-content > * + * {
  margin-block-start: var(--rf-space-md);
}

.entry-content img {
  border-radius: var(--rf-radius-md);
}

.alignwide {
  width: min(1100px, 100%);
  margin-inline: auto;
}

.alignfull {
  width: 100%;
  margin-inline: calc(var(--rf-space-md) * -1);
}

.alignleft {
  float: left;
  margin-inline: 0 var(--rf-space-md) var(--rf-space-sm) 0;
}

.alignright {
  float: right;
  margin-inline: 0 0 var(--rf-space-sm) var(--rf-space-md);
}

.aligncenter {
  display: block;
  margin-inline: auto;
}

/* --------------------------------------------------------------------------
   15. 响应式 —— 480 / 768 / 1024 / 1280 / 1600 / 2200 全覆盖
   -------------------------------------------------------------------------- */

/* ≤ 480px：单列为主 */
@media (max-width: 479.98px) {
  .rf-grid--2,
  .rf-grid--3,
  .rf-grid--4 {
    grid-template-columns: 1fr;
  }

  .rf-header__actions .rf-btn span.rf-btn__label {
    display: none;
  }

  .rf-hero__actions {
    flex-direction: column;
  }

  .rf-footer__widgets {
    gap: var(--rf-space-lg);
  }
}

/* ≤ 768px：平板，网格降列，页脚降两列 */
@media (max-width: 767.98px) {
  .rf-grid--3,
  .rf-grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }

  .rf-footer__widgets {
    grid-template-columns: repeat(2, 1fr);
  }

  .rf-section__header {
    text-align: start;
    margin-inline: 0;
  }

  .rf-header--layout-2 .rf-header__inner {
    flex-direction: row;
  }
}

/* ≤ 1024px：导航折叠为抽屉，页脚单列 */
@media (max-width: 1023.98px) {
  .rf-nav-toggle {
    display: flex;
  }

  .rf-main-nav,
  .rf-header__search {
    display: none;
  }

  .rf-header__inner {
    min-height: 64px;
  }

  .rf-grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }

  .rf-footer__widgets {
    grid-template-columns: 1fr;
  }

  .rf-mobile-nav .rf-search-form {
    display: flex;
    margin-block-start: var(--rf-space-md);
  }
}

/* ≥ 1280px */
@media (min-width: 1280px) {
  .rf-section {
    padding-block: var(--rf-space-2xl);
  }
}

/* ≥ 1600px：更大留白 */
@media (min-width: 1600px) {
  :root {
    --rf-fs-base: 1.0625rem;
  }
}

/* ≥ 2200px（4K）：容器加宽至 1680px */
@media (min-width: 2200px) {
  .rf-container {
    max-width: 1680px;
  }
}

/* --------------------------------------------------------------------------
   16. 动画偏好
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}