/* ============================================================
   站点公共排版样式 site.css
   集中管理：布局类补丁 + 顶部导航 + 移动端适配
   所有模板与静态页面统一引用本文件，避免各页面样式不一致
   ============================================================ */

/* ---------- 布局类补丁（dist/style.css 为精简版，缺失的类在此补齐） ---------- */
.py-12 { padding-top: 48px; padding-bottom: 48px; }
.mb-10 { margin-bottom: 40px; }
.h-1 { height: 4px; }
.w-16 { width: 64px; }
.pt-36 { padding-top: 144px; }      /* 固定导航下内容顶部留白 */
.pb-24 { padding-bottom: 96px; }
.max-w-3xl { max-width: 48rem; }    /* 文章正文容器宽度 */
.max-w-4xl { max-width: 56rem; }    /* 文章正文容器宽度（加宽版） */
.max-w-5xl { max-width: 64rem; }    /* 文章正文容器宽度（宽版 1024px） */
.space-y-5 > * + * { margin-top: 20px; }
.gap-14 { gap: 56px; }
.items-center { align-items: center; }
.bg-[#0e1422] { background-color: #0e1422; }
.border-white\/10 { border-color: rgba(255, 255, 255, .1); }
.text-techCyan\/70 { color: rgba(34, 211, 238, .7); }
.bg-white\/30 { background-color: rgba(255, 255, 255, .3); }
.bg-techBlue\/20 { background-color: rgba(14, 165, 233, .2); }
.hover\:bg-techCyan:hover { background-color: #06b6d4; }
.hover\:bg-white\/15:hover { background-color: rgba(255, 255, 255, .15); }
.hover\:border-techCyan\/40:hover { border-color: rgba(34, 211, 238, .4); }
.bg-\[radial-gradient\(circle\,rgba\(14\,165\,233\,0\.2\)\,transparent_65\%\)\] { background: radial-gradient(circle, rgba(14, 165, 233, 0.2), transparent 65%); }
.text-\[clamp\(2rem\,5vw\,3\.5rem\)\] { font-size: clamp(2rem, 5vw, 3.5rem); }
.w-\[420px\] { width: 420px; }
.h-\[420px\] { height: 420px; }
.-translate-x-1\/2 { transform: translateX(-50%); }
.left-1\/2 { left: 50%; }

/* ---------- 顶部导航公共样式 ---------- */
header nav a { color: #e2e8f0 !important; font-size: 15px; font-weight: 500; text-decoration: none; transition: color .3s; }
header nav a:hover { color: #22d3ee !important; }
header nav ul { align-items: center; margin: 0; }
.brand-name { color: #fff; }

/* ---------- 移动端适配 ---------- */
@media (max-width: 767px) {
    header .max-w-7xl { flex-wrap: wrap; gap: 8px; }
    header nav.flex { order: 3; width: 100%; justify-content: center; }
    header nav.flex ul { justify-content: center; }
    header nav.flex ul li a { font-size: 14px; padding: 4px 8px; }
    .pt-36 { padding-top: 190px; }   /* 移动端导航换行为两行，需要更大留白 */
    .slideshow .slide > div[style*="position:absolute"] { left: 16px !important; right: 16px !important; bottom: 16px !important; }
}

/* ---------- 平板及以上 ---------- */
@media (min-width: 768px) {
    .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .md\:text-4xl { font-size: 36px; }
    .md\:block { display: block; }
}