/* 元速科技官网 - 自定义样式（补充 Tailwind） */

:root {
    --ys-blue: #1E40AF;
    --ys-blue-light: #2563EB;
    --ys-cyan: #06B6D4;
    --ys-cyan-light: #22D3EE;
}

* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html { scroll-behavior: smooth; }

body {
    font-family: 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Arial, sans-serif;
    color: #1e293b;
}

/* ===== 渐变背景 ===== */
.bg-hero-gradient {
    background: linear-gradient(135deg, #0F172A 0%, #1E3A8A 45%, #1E40AF 100%);
}
.bg-brand-gradient {
    background: linear-gradient(135deg, #1E40AF 0%, #06B6D4 100%);
}
.text-gradient {
    background: linear-gradient(90deg, #06B6D4 0%, #22D3EE 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* ===== Hero 光晕动效 ===== */
.hero-glow::before,
.hero-glow::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.4;
    pointer-events: none;
}
.hero-glow::before {
    width: 480px; height: 480px;
    background: radial-gradient(circle, #06B6D4 0%, transparent 70%);
    top: -120px; right: -80px;
    animation: float 8s ease-in-out infinite;
}
.hero-glow::after {
    width: 400px; height: 400px;
    background: radial-gradient(circle, #3B82F6 0%, transparent 70%);
    bottom: -100px; left: -100px;
    animation: float 10s ease-in-out infinite reverse;
}
@keyframes float {
    0%, 100% { transform: translate(0, 0); }
    50% { transform: translate(30px, -30px); }
}

/* ===== 网格背景 ===== */
.bg-grid {
    background-image:
        linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
    background-size: 50px 50px;
}

/* ===== 滚动渐入动画 =====
   安全机制：只有当 html 拥有 .js 类（即 main.js 成功执行）时，
   [data-aos] 才默认隐藏。若 JS 失败/被拦截，元素保持可见，避免整页空白。
*/
[data-aos] {
    transition: opacity 0.7s ease, transform 0.7s ease;
}
/* 仅在 JS 生效时才隐藏元素（等待 IntersectionObserver 唤醒） */
html.js [data-aos]:not(.aos-animate) {
    opacity: 0;
}
[data-aos="fade-up"] { transform: translateY(40px); }
[data-aos="fade-down"] { transform: translateY(-40px); }
[data-aos="fade-left"] { transform: translateX(40px); }
[data-aos="fade-right"] { transform: translateX(-40px); }
[data-aos="zoom-in"] { transform: scale(0.9); }
[data-aos].aos-animate {
    opacity: 1;
    transform: translate(0,0) scale(1);
}
/* 依次延迟 */
[data-aos-delay="100"] { transition-delay: 0.1s; }
[data-aos-delay="200"] { transition-delay: 0.2s; }
[data-aos-delay="300"] { transition-delay: 0.3s; }
[data-aos-delay="400"] { transition-delay: 0.4s; }

/* AOS 兜底：3 秒后若仍有未唤醒的 data-aos，强制显示（防极端情况） */
@keyframes aos-fallback-show {
    to { opacity: 1 !important; transform: none !important; }
}
html.js [data-aos]:not(.aos-animate) {
    animation: aos-fallback-show 0s 5s forwards;
}

/* ===== 卡片悬浮效果 ===== */
.card-hover {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card-hover:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px -10px rgba(30, 64, 175, 0.25);
}

/* ===== 按钮光泽 ===== */
.btn-shine {
    position: relative;
    overflow: hidden;
}
.btn-shine::after {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
    transition: left 0.5s;
}
.btn-shine:hover::after { left: 100%; }

/* ===== 导航栏滚动效果 =====
   单一真相源：所有导航文字颜色由 .nav-scrolled 状态驱动，
   不再用服务端 path 判断（避免两套逻辑打架）。
   默认（透明导航栏，浮在深色Hero上）= 白字；
   滚动后（白底导航栏）= 深字。
*/
#navbar {
    /* 默认透明状态：文字白色（浮在深色背景上） */
}
#navbar .nav-link-text { color: #ffffff; transition: color 0.3s ease; }
#navbar .nav-logo-text { color: #ffffff; transition: color 0.3s ease; }
#navbar .nav-sub-text  { color: rgba(219, 234, 254, 1); transition: color 0.3s ease; } /* blue-100 */
#navbar .nav-toggle    { color: #ffffff; transition: color 0.3s ease; }

/* 滚动后 / 非首页：白底导航栏，文字改深色 */
.nav-scrolled {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(12px);
    box-shadow: 0 2px 20px rgba(0,0,0,0.08);
}
.nav-scrolled .nav-link-text { color: #334155; }   /* slate-700 */
.nav-scrolled .nav-link-text:hover { color: #1E40AF; } /* brand-800 */
.nav-scrolled .nav-logo-text { color: #1E40AF; }   /* brand-800 */
.nav-scrolled .nav-sub-text  { color: #94a3b8; }   /* slate-400 */
.nav-scrolled .nav-toggle    { color: #334155; }   /* slate-700 */

/* ===== 服务图标背景 ===== */
.icon-bubble {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    transition: transform 0.3s ease;
}
.card-hover:hover .icon-bubble { transform: scale(1.1) rotate(-5deg); }

/* ===== FAQ 手风琴 ===== */
.faq-item { border-bottom: 1px solid #e2e8f0; }
.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
/* 由 JS 根据内容 scrollHeight 动态设置 max-height */
.faq-item.faq-open .faq-icon { transform: rotate(45deg); }

/* ===== 数字滚动 ===== */
.stat-number { font-variant-numeric: tabular-nums; }

/* ===== 悬浮工具栏 ===== */
.float-toolbar {
    position: fixed;
    right: 20px;
    bottom: 80px;
    z-index: 40;  /* 低于导航层 z-50，避免遮挡导航下拉菜单 */
}
.float-btn {
    width: 48px; height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transition: transform 0.3s;
    cursor: pointer;
    color: #fff;
    margin-bottom: 12px;
}
.float-btn:hover { transform: scale(1.1); }

/* ===== 富文本内容样式 ===== */
.prose-content h3 { font-size: 1.5rem; font-weight: 700; margin: 1.5em 0 0.6em; color: #0f172a; }
.prose-content h4 { font-size: 1.2rem; font-weight: 600; margin: 1.2em 0 0.5em; color: #1e293b; }
.prose-content p { margin: 0.8em 0; line-height: 1.8; color: #475569; }
.prose-content ul { margin: 0.8em 0; padding-left: 1.5em; }
.prose-content li { margin: 0.4em 0; line-height: 1.8; color: #475569; list-style: disc; }
.prose-content strong { color: #1E40AF; font-weight: 600; }

/* ===== 表单输入聚焦 ===== */
.form-input:focus {
    border-color: #06B6D4;
    box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.15);
    outline: none;
}

/* ===== 分页 ===== */
.page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px; height: 40px;
    border-radius: 0.5rem;
    padding: 0 0.75rem;
    color: #475569;
    transition: all 0.2s;
}
.page-link:hover { background: #E0F2FE; color: #1E40AF; }
.page-link.active { background: #1E40AF; color: #fff; }

/* ===== 响应式 ===== */
@media (max-width: 768px) {
    .hero-glow::before, .hero-glow::after { display: none; }
    [data-aos] { opacity: 1; transform: none; }
}
