/* 幻灯片样式 */
.slideshow {
    position: relative;
    width: 100%;
    height: 60vh;
    overflow: hidden;
    margin-top: 70px; /* 适配导航栏高度 */
}

.slides {
    position: relative;
    width: 100%;
    height: 100%;
}

.slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 1s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    background-position: center;
    z-index: 1;
}

.slide.active {
    opacity: 1;
}

.slide-content {
    text-align: center;
    max-width: 800px;
    padding: 0 20px;
    z-index: 3;
    position: relative;
}

.slide h2 {
    font-size: 3.5rem;
    margin-bottom: 20px;
    color: white;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
}

.slide p {
    font-size: 1.5rem;
    margin-bottom: 30px;
    color: white;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
}

.slide-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    z-index: 2;
}

.slide-nav {
    position: absolute;
    bottom: 30px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    z-index: 3;
}

.slide-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    margin: 0 8px;
    cursor: pointer;
    transition: var(--transition);
}

.slide-dot.active {
    background: white;
    transform: scale(1.2);
}

.slide-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.3);
    color: white;
    border: none;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition);
    z-index: 3;
}

.slide-arrow:hover {
    background: rgba(0, 0, 0, 0.6);
}

.slide-arrow.prev {
    left: 20px;
}

.slide-arrow.next {
    right: 20px;
}

/* 视频弹窗样式 */
.video-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 2000;
    align-items: center;
    justify-content: center;
}

.video-modal.active {
    display: flex;
}

.video-container {
    position: relative;
    width: 80%;
    max-width: 900px;
    background: var(--primary-dark);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

.video-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: var(--secondary-dark);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.video-title {
    font-size: 1.2rem;
    font-weight: 600;
}

.close-video {
    background: none;
    border: none;
    color: var(--text-primary);
    font-size: 1.5rem;
    cursor: pointer;
    transition: var(--transition);
}

.close-video:hover {
    color: var(--primary-accent);
}

.video-player {
    width: 100%;
    height: 500px;
    background: #000;
}

.video-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d);
    color: white;
}

.video-placeholder i {
    font-size: 4rem;
    margin-bottom: 20px;
}

.video-placeholder p {
    font-size: 1.2rem;
}

/* 页面容器 */
.page-container {
    padding: 40px 5% 40px; /* 手机端优化：减小内边距 */
    max-width: 1400px;
    margin: 0 auto;
}

/* 主内容区样式 */
.hero {
    padding: 30px 20px; /* 手机端优化：减小内边距 */
    text-align: center;
    max-width: 1200px;
    margin: 0 auto;
}

.hero h1 {
    font-size: 2.5rem; /* 手机端优化：缩小标题 */
    margin-bottom: 15px;
    line-height: 1.2;
    background: linear-gradient(to right, var(--primary-accent), var(--secondary-accent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hero p {
    font-size: 1.1rem; /* 手机端优化：缩小文字 */
    color: var(--text-secondary);
    max-width: 800px;
    margin: 0 auto 30px; /* 手机端优化：减小间距 */
}

.hero-buttons {
    display: flex;
    justify-content: center;
    gap: 15px; /* 手机端优化：减小间距 */
    margin-top: 20px;
}

.secondary-button {
    background: transparent;
    color: var(--primary-accent);
    padding: 9px 22px; /* 手机端优化：减小按钮 */
    border: 2px solid var(--primary-accent);
    border-radius: 30px;
    font-weight: 600;
    font-size: 0.9rem; /* 手机端优化：缩小文字 */
    cursor: pointer;
    transition: var(--transition);
}

.secondary-button:hover {
    background: rgba(0, 208, 255, 0.1);
    transform: translateY(-3px);
}

.light-theme .secondary-button:hover {
    background: rgba(0, 102, 204, 0.1);
}

/* 通用部分样式 */
.section {
    padding: 40px 0; /* 手机端优化：减小间距 */
}

.section-title {
    text-align: center;
    margin-bottom: 40px; /* 手机端优化：减小间距 */
}

.section-title h2 {
    font-size: 2rem; /* 手机端优化：缩小标题 */
    margin-bottom: 15px;
    position: relative;
    display: inline-block;
}

.section-title h2::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(to right, var(--primary-accent), var(--secondary-accent));
    border-radius: 2px;
}

.section-title p {
    color: var(--text-secondary);
    font-size: 1rem; /* 手机端优化：缩小文字 */
    max-width: 700px;
    margin: 15px auto 0; /* 手机端优化：减小间距 */
}

/* 工作流展示部分 */
.workflow-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); /* 手机端优化：减小最小宽度 */
    gap: 20px; /* 手机端优化：减小间距 */
    max-width: 1200px;
    margin: 0 auto;
}

.workflow-card {
    background: var(--card-bg);
    border-radius: 12px;
    overflow: hidden;
    transition: var(--transition);
    border: 1px solid rgba(255, 255, 255, 0.05);
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.workflow-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.3);
    border-color: rgba(0, 208, 255, 0.2);
}

.light-theme .workflow-card:hover {
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 102, 204, 0.2);
}

.workflow-image {
    height: 180px; /* 手机端优化：减小图片高度 */
    background-size: cover;
    background-position: center;
    position: relative;
}

.vip-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: linear-gradient(45deg, #ffd700, #ffed4e);
    color: #333;
    padding: 3px 8px; /* 手机端优化：减小徽章 */
    border-radius: 12px;
    font-size: 0.7rem; /* 手机端优化：缩小文字 */
    font-weight: 600;
    display: flex;
    align-items: center;
}

.vip-badge i {
    margin-right: 4px;
}

.workflow-content {
    padding: 18px; /* 手机端优化：减小内边距 */
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    position: relative;
}

.workflow-content h3 {
    font-size: 1.2rem; /* 手机端优化：缩小标题 */
    margin-bottom: 8px;
    color: var(--primary-accent);
}

.workflow-content p {
    color: var(--text-secondary);
    font-size: 0.9rem; /* 手机端优化：缩小文字 */
    margin-bottom: 35px;
    line-height: 1.5;
    flex-grow: 1;
}

.workflow-buttons {
    position: absolute;
    bottom: 18px;
    right: 18px;
    display: flex;
    gap: 8px; /* 手机端优化：减小间距 */
}

.workflow-button {
    background: linear-gradient(45deg, var(--primary-accent), var(--secondary-accent));
    color: var(--primary-dark);
    padding: 5px 12px; /* 手机端优化：减小按钮 */
    border: none;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.8rem; /* 手机端优化：缩小文字 */
    cursor: pointer;
    transition: var(--transition);
}

.preview-button {
    background: transparent;
    color: var(--primary-accent);
    border: 1px solid var(--primary-accent);
    padding: 5px 12px; /* 手机端优化：减小按钮 */
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.8rem; /* 手机端优化：缩小文字 */
    cursor: pointer;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 5px;
}

.preview-button i {
    font-size: 0.8rem; /* 手机端优化：缩小图标 */
}

.more-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: var(--card-bg);
    border-radius: 12px;
    transition: var(--transition);
    border: 2px dashed rgba(255, 255, 255, 0.1);
    cursor: pointer;
    height: 100%;
}

.more-card:hover {
    border-color: var(--primary-accent);
    background: rgba(0, 208, 255, 0.05);
}

.more-card i {
    font-size: 2rem; /* 手机端优化：缩小图标 */
    color: var(--primary-accent);
    margin-bottom: 12px;
}

.more-card h3 {
    font-size: 1.2rem; /* 手机端优化：缩小文字 */
    color: var(--primary-accent);
}

/* 插件展示部分 */
.plugins-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* 手机端优化：减小最小宽度 */
    gap: 30px; /* 手机端优化：减小间距 */
}

.plugin-card {
    background: var(--card-bg);
    border-radius: 15px;
    overflow: hidden;
    transition: var(--transition);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.plugin-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
    border-color: rgba(0, 208, 255, 0.2);
}

.light-theme .plugin-card:hover {
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 102, 204, 0.2);
}

.plugin-header {
    padding: 20px 20px 10px; /* 手机端优化：减小内边距 */
    text-align: center;
}

.plugin-icon {
    font-size: 3rem; /* 手机端优化：缩小图标 */
    margin-bottom: 12px;
    background: linear-gradient(to bottom, var(--primary-accent), var(--secondary-accent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.plugin-content {
    padding: 0 20px 25px; /* 手机端优化：减小内边距 */
}

.plugin-features {
    list-style: none;
    margin: 15px 0; /* 手机端优化：减小间距 */
}

.plugin-features li {
    padding: 8px 0; /* 手机端优化：减小间距 */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    display: flex;
    align-items: center;
    font-size: 0.9rem; /* 手机端优化：缩小文字 */
}

.plugin-features li:last-child {
    border-bottom: none;
}

.plugin-features li i {
    color: var(--primary-accent);
    margin-right: 8px; /* 手机端优化：减小间距 */
}

/* 客户留资部分 */
.customer-form-container {
    max-width: 600px;
    margin: 0 auto;
    background: var(--card-bg);
    border-radius: 20px;
    padding: 30px; /* 手机端优化：减小内边距 */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.customer-form {
    display: flex;
    flex-direction: column;
    gap: 20px; /* 手机端优化：减小间距 */
}

.form-group {
    display: flex;
    flex-direction: column;
}

.form-group label {
    margin-bottom: 8px; /* 手机端优化：减小间距 */
    font-weight: 500;
    color: var(--text-secondary);
    font-size: 0.95rem; /* 手机端优化：缩小文字 */
}

.form-group input, .form-group textarea {
    padding: 12px 15px; /* 手机端优化：减小内边距 */
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    color: var(--text-primary);
    font-size: 1rem; /* 手机端优化：缩小文字 */
    transition: var(--transition);
}

.light-theme .form-group input, .light-theme .form-group textarea {
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: rgba(255, 255, 255, 0.7);
    color: var(--text-primary);
}

.form-group input:focus, .form-group textarea:focus {
    outline: none;
    border-color: var(--primary-accent);
    box-shadow: 0 0 0 3px rgba(0, 208, 255, 0.2);
}

.light-theme .form-group input:focus, .light-theme .form-group textarea:focus {
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.2);
}

.form-group textarea {
    min-height: 100px; /* 手机端优化：减小高度 */
    resize: vertical;
}

/* 价格套餐部分 */
.pricing-plans {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* 手机端优化：减小最小宽度 */
    gap: 25px; /* 手机端优化：减小间距 */
}

.plan-card {
    background: var(--card-bg);
    border-radius: 20px;
    padding: 30px 25px; /* 手机端优化：减小内边距 */
    text-align: center;
    transition: var(--transition);
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.plan-card.popular {
    transform: scale(1.05);
    border: 1px solid var(--primary-accent);
    box-shadow: 0 0 30px rgba(0, 208, 255, 0.2);
}

.light-theme .plan-card.popular {
    box-shadow: 0 0 30px rgba(0, 102, 204, 0.2);
}

.popular-tag {
    position: absolute;
    top: 15px; /* 手机端优化：调整位置 */
    right: -30px;
    background: var(--primary-accent);
    color: var(--primary-dark);
    padding: 3px 40px; /* 手机端优化：减小内边距 */
    font-weight: 700;
    transform: rotate(45deg);
    font-size: 0.8rem; /* 手机端优化：缩小文字 */
}

.plan-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
    border-color: rgba(0, 208, 255, 0.2);
}

.plan-card.popular:hover {
    transform: scale(1.05) translateY(-10px);
}

.light-theme .plan-card:hover {
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 102, 204, 0.2);
}

.plan-name {
    font-size: 1.5rem; /* 手机端优化：缩小文字 */
    margin-bottom: 12px;
    color: var(--primary-accent);
}

.plan-price {
    font-size: 2.5rem; /* 手机端优化：缩小文字 */
    font-weight: 700;
    margin-bottom: 20px;
    background: linear-gradient(to right, var(--primary-accent), var(--secondary-accent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.plan-price span {
    font-size: 1rem; /* 手机端优化：缩小文字 */
    color: var(--text-secondary);
    font-weight: normal;
}

.plan-features {
    list-style: none;
    margin-bottom: 25px; /* 手机端优化：减小间距 */
}

.plan-features li {
    padding: 10px 0; /* 手机端优化：减小间距 */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    font-size: 0.9rem; /* 手机端优化：缩小文字 */
}

.plan-features li:last-child {
    border-bottom: none;
}

/* 开发计划部分 */
.roadmap-container {
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
}

.roadmap-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 4px;
    height: 100%;
    background: linear-gradient(to bottom, var(--primary-accent), var(--secondary-accent));
    border-radius: 2px;
    transform: translateX(-50%);
}

.roadmap-item {
    width: calc(50% - 40px);
    padding: 25px; /* 手机端优化：减小内边距 */
    background: var(--card-bg);
    border-radius: 15px;
    margin-bottom: 30px; /* 手机端优化：减小间距 */
    position: relative;
    transition: var(--transition);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.roadmap-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
    border-color: rgba(0, 208, 255, 0.2);
}

.light-theme .roadmap-item:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 102, 204, 0.2);
}

.roadmap-item:nth-child(odd) {
    margin-left: auto;
}

.roadmap-item:nth-child(even) {
    margin-right: auto;
}

.roadmap-item::after {
    content: '';
    position: absolute;
    top: 30px; /* 手机端优化：调整位置 */
    width: 18px; /* 手机端优化：缩小圆点 */
    height: 18px;
    border-radius: 50%;
    background: var(--primary-accent);
    box-shadow: 0 0 0 5px rgba(0, 208, 255, 0.2);
}

.roadmap-item:nth-child(odd)::after {
    right: -50px;
}

.roadmap-item:nth-child(even)::after {
    left: -50px;
}

.roadmap-date {
    color: var(--primary-accent);
    font-weight: 600;
    margin-bottom: 8px; /* 手机端优化：减小间距 */
    display: flex;
    align-items: center;
    font-size: 0.9rem; /* 手机端优化：缩小文字 */
}

.roadmap-date i {
    margin-right: 6px; /* 手机端优化：减小间距 */
}

.roadmap-item h3 {
    font-size: 1.3rem; /* 手机端优化：缩小文字 */
    margin-bottom: 12px;
}

.roadmap-features {
    list-style: none;
    margin-top: 12px; /* 手机端优化：减小间距 */
}

.roadmap-features li {
    padding: 6px 0; /* 手机端优化：减小间距 */
    display: flex;
    align-items: flex-start;
    font-size: 0.9rem; /* 手机端优化：缩小文字 */
}

.roadmap-features li i {
    color: var(--primary-accent);
    margin-right: 8px; /* 手机端优化：减小间距 */
    margin-top: 4px;
}

/* 精简版插件中心布局 */
.plugins-slim-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 15px; /* 手机端优化：减小间距 */
    padding: 10px 0;
}

.plugin-slim-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: calc(16.666% - 13px); /* 适配间隙 */
    padding: 15px 10px; /* 手机端优化：减小内边距 */
    background: var(--card-bg);
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transition: var(--transition);
    text-align: center;
}

.plugin-slim-icon {
    margin-bottom: 10px;
    width: 50px; /* 手机端优化：缩小图标 */
    height: 50px;
    border-radius: 50%;
    background: rgba(0, 208, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
}

.plugin-slim-name {
    font-size: 0.9rem; /* 手机端优化：缩小文字 */
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

.plugin-slim-tag {
    font-size: 0.75rem; /* 手机端优化：缩小文字 */
    padding: 2px 8px; /* 手机端优化：减小内边距 */
    border-radius: 20px;
    background: var(--primary-accent-light);
    color: var(--primary-accent);
}

/* 右下角漂浮视频按钮 */
.floating-video-btn {
    position: fixed;
    bottom: 25px; /* 手机端优化：调整位置 */
    right: 25px;
    width: 55px; /* 手机端优化：缩小按钮 */
    height: 55px;
    border-radius: 50%;
    background: linear-gradient(45deg, var(--primary-accent), var(--secondary-accent));
    color: var(--primary-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: 0 5px 15px rgba(0, 208, 255, 0.4);
    z-index: 999;
}

.floating-video-btn i {
    font-size: 1.8rem; /* 手机端优化：缩小图标 */
}

.floating-video-btn:hover {
    transform: scale(1.1);
    box-shadow: 0 8px 20px rgba(0, 208, 255, 0.6);
}

.btn-tooltip {
    position: absolute;
    right: 65px; /* 手机端优化：调整位置 */
    background: var(--secondary-dark);
    color: var(--text-primary);
    padding: 4px 10px; /* 手机端优化：减小内边距 */
    border-radius: 20px;
    font-size: 0.85rem; /* 手机端优化：缩小文字 */
    opacity: 0;
    visibility: hidden;
    transition: var(--transition);
    white-space: nowrap;
}

.floating-video-btn:hover .btn-tooltip {
    opacity: 1;
    visibility: visible;
    right: 70px;
}

/* 音频播放弹窗 */
.audio-player-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 2000;
    align-items: center;
    justify-content: center;
}

.audio-player-container {
    background: var(--primary-dark);
    border-radius: 12px;
    padding: 25px; /* 手机端优化：减小内边距 */
    width: 90%;
    max-width: 500px;
    text-align: center;
}

.audio-title {
    font-size: 1.1rem; /* 手机端优化：缩小文字 */
    margin-bottom: 15px;
    color: var(--primary-accent);
}

audio {
    width: 100%;
    margin-bottom: 12px;
}

/* 图片预览弹窗 */
.image-preview-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    z-index: 2000;
    align-items: center;
    justify-content: center;
    padding: 15px; /* 手机端优化：减小内边距 */
}

.image-preview-container {
    position: relative;
    max-width: 90%;
    max-height: 90%;
}

.close-preview {
    position: absolute;
    top: -35px; /* 手机端优化：调整位置 */
    right: 0;
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem; /* 手机端优化：缩小图标 */
    cursor: pointer;
    transition: var(--transition);
}

.close-preview:hover {
    color: var(--primary-accent);
}

.image-preview-title {
    position: absolute;
    bottom: -25px; /* 手机端优化：调整位置 */
    left: 50%;
    transform: translateX(-50%);
    color: white;
    font-size: 0.9rem; /* 手机端优化：缩小文字 */
    white-space: nowrap;
}

.image-preview-content img {
    max-width: 100%;
    max-height: 80vh;
    border-radius: 8px;
}

/* 响应式适配 */
@media (max-width: 1200px) {
    .plugin-slim-card {
        width: calc(20% - 12px); /* 一行5列 */
    }
}

@media (max-width: 992px) {
    .hero h1 {
        font-size: 2.2rem;
    }
    
    .hero p {
        font-size: 1rem;
    }
    
    .roadmap-container::before {
        left: 30px;
    }
    
    .roadmap-item {
        width: calc(100% - 80px);
        margin-left: 80px !important;
    }
    
    .roadmap-item:nth-child(even)::after,
    .roadmap-item:nth-child(odd)::after {
        left: -50px;
    }
    
    .slide h2 {
        font-size: 2.5rem;
    }
    
    .slide p {
        font-size: 1.2rem;
    }

    .plugin-slim-card {
        width: calc(25% - 11px); /* 一行4列 */
    }
}

@media (max-width: 768px) {
    .slide h2 {
        font-size: 1.8rem;
        margin-bottom: 12px;
        -webkit-line-clamp: 2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        line-height: 1.3;
    }
    
    .slide p {
        font-size: 0.95rem;
        margin-bottom: 15px;
        -webkit-line-clamp: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        line-height: 1.4;
    }
    
    .slide .cta-button {
        padding: 7px 18px;
        font-size: 0.85rem;
        border-radius: 25px;
    }
    
    .slide-arrow {
        width: 40px;
        height: 40px;
        font-size: 0.9rem;
    }
    
    .slide-nav {
        bottom: 15px;
    }
    
    .slide-dot {
        width: 10px;
        height: 10px;
        margin: 0 5px;
    }

    .video-container {
        width: 95%;
    }
    
    .video-player {
        height: 250px; /* 手机端优化：减小视频高度 */
    }

    .floating-video-btn {
        width: 50px;
        height: 50px;
        bottom: 20px;
        right: 20px;
    }
    
    .floating-video-btn i {
        font-size: 1.5rem;
    }
    
    .btn-tooltip {
        font-size: 0.8rem;
        padding: 3px 8px;
    }
    
    .floating-video-btn:hover .btn-tooltip {
        right: 60px;
    }

    .plugin-slim-card {
        width: calc(33.333% - 10px); /* 一行3列 */
    }
}

@media (max-width: 576px) {
    .slideshow {
        height: 25vh;
        margin-top: 60px;
    }
    
    .slide h2 {
        font-size: 1.5rem;
        margin-bottom: 10px;
    }
    
    .slide p {
        display: none !important; /* 隐藏描述文字 */
    }
    
    .hero h1 {
        font-size: 1.8rem;
    }
    
    .hero-buttons {
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }

    .section-title h2 {
        font-size: 1.7rem;
    }

    .plugin-slim-card {
        width: calc(50% - 8px); /* 一行2列 */
    }
}

@media (max-width: 480px) {
    .workflow-image {
        height: 150px;
    }

    .pricing-plans {
        gap: 20px;
    }
    
    .plan-card.popular {
        transform: scale(1);
    }

    .roadmap-item {
        width: calc(100% - 50px);
        margin-left: 50px !important;
        padding: 20px;
    }
    
    .roadmap-item::after {
        width: 15px;
        height: 15px;
        left: -35px;
    }
}

@media (max-width: 375px) {
    .slideshow {
        height: 22vh;
    }
    
    .slide h2 {
        font-size: 1.3rem;
        margin-bottom: 8px;
    }
    
    .slide .cta-button {
        padding: 5px 15px;
        font-size: 0.8rem;
    }

    .plugin-slim-card {
        padding: 12px 8px;
    }
    
    .plugin-slim-icon {
        width: 40px;
        height: 40px;
    }
}



/* 首页工作流卡片星级样式 */
.workflow-card-rating {
    display: flex;
    align-items: center;
    gap: 3px;
    margin-bottom: 8px;
}

.workflow-card-rating .star-group {
    display: flex;
    align-items: center;
    gap: 2px;
}

.workflow-card-rating .filled-star {
    color: #ffd700 !important;
    font-size: 0.85rem !important;
}

.workflow-card-rating .empty-star {
    color: #ccc !important;
    font-size: 0.85rem !important;
}

.workflow-card-rating .rating-text {
    margin-left: 5px;
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.workflow-card-rating .fa-star {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}


/* 标题+星级同行容器 */
.workflow-title-rating {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

/* 标题样式调整（避免被星级挤压） */
.workflow-title-rating h3 {
    margin: 0 !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: calc(100% - 80px); /* 给星级预留空间 */
}

/* 星级样式微调（保持与标题对齐） */
.workflow-card-rating {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-bottom: 0 !important; /* 取消底部间距 */
}

.workflow-card-rating .star-group {
    gap: 1px;
}

.workflow-card-rating .filled-star,
.workflow-card-rating .empty-star {
    font-size: 0.8rem !important;
}

.workflow-card-rating .rating-text {
    font-size: 0.75rem;
    margin-left: 3px;
}





/* 首页插件卡片星级样式 */
.plugin-slim-rating {
    display: flex;
    align-items: center;
    gap: 3px;
    margin-top: 6px;
}

.plugin-slim-rating .star-group {
    display: flex;
    align-items: center;
    gap: 2px;
}

.plugin-slim-rating .filled-star {
    color: #ffd700 !important;
    font-size: 0.8rem !important;
}

.plugin-slim-rating .empty-star {
    color: #ccc !important;
    font-size: 0.8rem !important;
}

.plugin-slim-rating .rating-text {
    margin-left: 4px;
    font-size: 0.75rem;
    color: var(--text-secondary);
}

.plugin-slim-rating .fa-star {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}




/* 插件卡片容器需要相对定位，作为VIP的父容器 */
.plugin-slim-card {
    position: relative; /* 关键：让VIP标识相对于卡片定位 */
    padding: 15px !important;
}

/* VIP小皇冠样式（右上角定位） */
.plugin-slim-vip {
    position: absolute; /* 绝对定位 */
    top: 8px; /* 右上角距离顶部8px */
    right: 8px; /* 右上角距离右侧8px */
    color: #ffd700; /* 金黄色皇冠 */
    font-size: 0.9rem !important;
    text-shadow: 0 0 2px rgba(255, 215, 0, 0.5); /* 发光效果 */
    background: transparent !important; /* 无背景色 */
    padding: 0 !important; /* 清除内边距 */
    border-radius: 0 !important; /* 清除圆角 */
}

/* 皇冠图标样式优化 */
.plugin-slim-vip i {
    display: block;
    transform: scale(0.9); /* 微调皇冠大小 */
}

/* 确保名称和星级不受定位影响 */
.plugin-slim-name {
    margin-top: 8px !important; /* 与图标保持距离 */
}

.plugin-slim-rating {
    margin-top: 5px !important;
}

/* 图片容器需要相对定位 */
.workflow-image {
    position: relative; /* 关键：作为徽章的父容器 */
    height: 180px;
    background-size: cover;
    background-position: center;
    display: block; /* 修复链接点击区域 */
}

/* 成功率徽章：左上角定位 */
.success-rate-badge {
    position: absolute;
    top: 10px; /* 左上角距离顶部10px */
    left: 10px; /* 左上角距离左侧10px */
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 4px;
    border: 1px solid;
    font-size: 0.8rem;
    font-weight: 600;
    z-index: 2; /* 确保在图片上方 */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* 增加阴影突出标签 */
}

/* 图标进一步缩小 */
.success-rate-badge .rate-icon {
    font-size: 0.85rem;
    width: auto; /* 取消固定宽度 */
}

/* 数值样式 */
.success-rate-badge .rate-value {
    font-size: 0.85rem;
    line-height: 1;
}

/* 各等级颜色与边框匹配 */
/* 优秀（≥90%） */
.excellent-icon { color: #219653; }
.excellent-rate { color: #219653; }
.success-rate-badge:has(.excellent-icon) {
    background: rgba(255, 255, 255, 0.9);
    border-color: #2ecc71;
}

/* 良好（80%-89%） */
.good-icon { color: #1e6091; }
.good-rate { color: #1e6091; }
.success-rate-badge:has(.good-icon) {
    background: rgba(255, 255, 255, 0.9);
    border-color: #3498db;
}

/* 一般（70%-79%） */
.fair-icon { color: #d35400; }
.fair-rate { color: #d35400; }
.success-rate-badge:has(.fair-icon) {
    background: rgba(255, 255, 255, 0.9);
    border-color: #f39c12;
}

/* 较差（<70%） */
.poor-icon { 
    color: #c0392b;
    animation: pulse 2s infinite;
}
.poor-rate { color: #c0392b; }
.success-rate-badge:has(.poor-icon) {
    background: rgba(255, 255, 255, 0.9);
    border-color: #e74c3c;
}

/* 红色图标动画调整 */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

/* VIP徽章位置调整（避免与成功率徽章重叠） */
.vip-badge {
    position: absolute;
    top: 10px;
    right: 10px; /* 右上角定位，与左侧成功率徽章错开 */
    background: linear-gradient(45deg, #ffd700, #ffed4e);
    color: #333;
    padding: 3px 8px;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    z-index: 2;
}

/* 响应式适配 */
@media (max-width: 768px) {
    .workflow-image {
        height: 150px;
    }
    .success-rate-badge {
        padding: 2px 6px;
        gap: 3px;
        font-size: 0.75rem;
    }
    .success-rate-badge .rate-icon {
        font-size: 0.8rem;
    }
}

@media (max-width: 480px) {
    .workflow-image {
        height: 130px;
    }
    .success-rate-badge {
        top: 8px;
        left: 8px;
    }
    .vip-badge {
        top: 8px;
        right: 8px;
        padding: 2px 6px;
        font-size: 0.65rem;
    }
}




/* 成功率徽章：左上角定位（核心修改） */
.success-rate-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 4px;
    border: 1px solid;
    font-size: 0.8rem;
    font-weight: 600;
    z-index: 10; /* 提升层级，避免被卡片内容遮挡 */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    transform: translateZ(0); /* 开启硬件加速，脱离卡片动画流 */
    pointer-events: auto; /* 确保鼠标事件只作用于标签本身 */
}

/* 同时优化卡片hover动画，避免过渡冲突 */
.workflow-card {
    background: var(--card-bg);
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease; /* 统一过渡属性，避免分步动画 */
    border: 1px solid rgba(255, 255, 255, 0.05);
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    transform: translateZ(0); /* 卡片也开启硬件加速，动画更流畅 */
}




/* 视频弹窗样式（核心修改） */
.video-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 2000;
    align-items: center;
    justify-content: center;
    padding: 20px; /* 增加内边距，避免视频贴边 */
    box-sizing: border-box;
    overflow-y: auto; /* 允许弹窗内容垂直滚动 */
}

.video-modal.active {
    display: flex;
}

.video-container {
    position: relative;
    width: 100%; /* 改为100%，配合max-width限制 */
    max-width: 900px;
    max-height: 90vh; /* 限制弹窗最大高度为视口90% */
    background: var(--primary-dark);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column; /* 垂直布局，让播放器自适应容器 */
}

.video-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: var(--secondary-dark);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    flex-shrink: 0; /* 头部不收缩 */
}

.video-title {
    font-size: 1.2rem;
    font-weight: 600;
}

.close-video {
    background: none;
    border: none;
    color: var(--text-primary);
    font-size: 1.5rem;
    cursor: pointer;
    transition: var(--transition);
}

.close-video:hover {
    color: var(--primary-accent);
}

/* 核心修复：视频播放器尺寸限制 */
.video-player {
    width: 100%;
    flex-grow: 1; /* 自适应剩余空间 */
    background: #000;
    position: relative; /* 作为视频的父容器 */
    min-height: 200px; /* 设置最小高度，避免太矮 */
}

/* 关键样式：确保视频完整显示 */
.video-player video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain; /* 核心属性：保持宽高比，完整显示视频 */
    background: #000; /* 黑背景，填充视频未覆盖区域 */
}

/* 占位符样式适配 */
.video-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d);
    color: white;
}

.video-placeholder i {
    font-size: 4rem;
    margin-bottom: 20px;
}

.video-placeholder p {
    font-size: 1.2rem;
}

/* 响应式适配（补充） */
@media (max-width: 768px) {
    .video-container {
        max-width: 95%;
        max-height: 85vh; /* 移动端降低最大高度 */
    }
    
    .video-player {
        min-height: 180px; /* 移动端最小高度 */
    }
    
    .video-placeholder i {
        font-size: 3rem;
    }
    
    .video-placeholder p {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .video-player {
        min-height: 150px; /* 小屏最小高度 */
    }
    
    .video-header {
        padding: 10px 15px;
    }
    
    .video-title {
        font-size: 1rem;
    }
    
    .close-video {
        font-size: 1.2rem;
    }
}