/**
 * 移动端专属响应式样式
 * 针对移动设备的全面优化
 */

/* ==================== 基础移动端重置 ==================== */
@media (max-width: 991.98px) {
  html {
    font-size: 14px;
  }
  
  body {
    overflow-x: hidden;
  }
}

@media (max-width: 767.98px) {
  html {
    font-size: 13px;
  }
}

@media (max-width: 575.98px) {
  html {
    font-size: 12px;
  }
}

/* ==================== 导航栏移动端优化 ==================== */
@media (max-width: 991.98px) {
  .navbar {
    padding: 14px 0 !important;
    min-height: 56px !important;
  }
  
  .navbar.scrolled {
    padding: 10px 0 !important;
  }
  
  .navbar-brand {
    font-size: 15px !important;
    gap: 8px !important;
  }
  
  .navbar-brand svg {
    width: 22px !important;
    height: 22px !important;
    flex-shrink: 0 !important;
  }
  
  .brand-logo-text {
    display: inline-block !important;
    max-width: 120px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  
  /* 汉堡按钮 */
  .navbar-toggler {
    padding: 10px !important;
    border: none !important;
    border-radius: 12px !important;
    min-height: 44px !important;
    min-width: 44px !important;
    background: rgba(0, 0, 0, 0.04) !important;
    transition: all 0.2s ease !important;
  }
  
  .navbar-toggler:hover,
  .navbar-toggler:focus {
    background: rgba(0, 0, 0, 0.08) !important;
    outline: none !important;
    box-shadow: none !important;
  }
  
  .navbar-toggler[aria-expanded="true"] {
    background: var(--primary-color, #a1a1aa) !important;
  }
  
  .navbar-toggler[aria-expanded="true"] svg path {
    stroke: #ffffff !important;
  }
  
  /* 导航折叠容器 */
  .navbar-collapse {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 16px !important;
    right: 16px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: saturate(180%) blur(20px);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    border-radius: 16px !important;
    margin-top: 0 !important;
    padding: 16px !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 
      0 1px 3px rgba(0, 0, 0, 0.03),
      0 12px 32px rgba(0, 0, 0, 0.1),
      0 0 0 1px rgba(255, 255, 255, 0.8) inset !important;
    max-height: calc(100vh - 100px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  
  .navbar-collapse.collapsing {
    transition: height 0.35s ease, transform 0.25s ease !important;
  }
  
  /* 导航列表 */
  .navbar-nav {
    flex-direction: column !important;
    gap: 4px !important;
    padding: 0 !important;
    width: 100% !important;
  }
  
  /* 导航项 */
  .nav-item.nav-dropdown-item {
    width: 100% !important;
    position: relative !important;
  }
  
  /* 导航链接 - 主级菜单 */
  .navbar-nav .nav-link {
    font-size: 16px !important;
    font-weight: 500 !important;
    padding: 14px 16px !important;
    border-radius: 12px !important;
    width: 100% !important;
    justify-content: space-between !important;
    align-items: center !important;
    color: #1d1d1f !important;
    display: flex !important;
    transition: all 0.2s ease !important;
    min-height: 52px !important;
  }
  
  .navbar-nav .nav-link:hover {
    background: rgba(161,161,170, 0.06) !important;
  }
  
  .navbar-nav .nav-link:active {
    background: rgba(161,161,170, 0.1) !important;
  }
  
  /* 显示下拉箭头图标 */
  .navbar-nav .nav-link svg {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
    transition: transform 0.25s ease !important;
  }
  
  /* 下拉箭头旋转状态 */
  .nav-dropdown-item.dropdown-expanded > .nav-link svg {
    transform: rotate(180deg) !important;
  }
  
  /* ====== 关键修复：下拉菜单默认隐藏 ====== */
  .nav-dropdown {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    
    /* 默认隐藏 */
    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
    
    transition: 
      max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1),
      opacity 0.25s ease,
      padding 0.25s ease,
      margin 0.25s ease,
      visibility 0.25s ease !important;
  }
  
  /* 展开状态下显示 */
  .nav-dropdown-item.dropdown-expanded > .nav-dropdown {
    max-height: 500px !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    padding: 8px 0 0 12px !important;
    margin: 4px 0 8px 0 !important;
  }
  
  /* 下拉菜单内容容器 */
  .nav-dropdown-content {
    background: rgba(241, 245, 249, 0.85) !important;
    border-radius: 12px !important;
    padding: 10px !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  }
  
  /* 用户下拉菜单特殊样式 */
  .user-dropdown-content {
    background: #f8fafc !important;
    padding: 12px !important;
  }
  
  /* 下拉菜单项链接 */
  .nav-dropdown-item-link {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 13px 14px !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    color: #374151 !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    min-height: 48px !important;
  }
  
  .nav-dropdown-item-link:hover,
  .nav-dropdown-item-link:active {
    background: rgba(161,161,170, 0.08) !important;
    color: #71717a !important;
  }
  
  .nav-dropdown-item-link .nav-dropdown-item-label {
    flex: 1 !important;
  }
  
  .nav-dropdown-item-link .nav-dropdown-item-arrow {
    width: 16px !important;
    height: 16px !important;
    color: #9ca3af !important;
    opacity: 0.7 !important;
  }
  
  /* 用户信息头部 */
  .user-info-header {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, rgba(161,161,170, 0.08), rgba(113,113,122, 0.04)) !important;
    margin-bottom: 10px !important;
  }
  
  .user-info-header i {
    font-size: 24px !important;
    color: #a1a1aa !important;
  }
  
  .user-info-header span {
    font-weight: 600 !important;
    color: #1d1d1f !important;
    font-size: 15px !important;
  }
  
  /* 操作按钮 */
  .dropdown-action-btn {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    padding: 13px 16px !important;
    margin-bottom: 6px !important;
    border-radius: 10px !important;
    background: transparent !important;
    border: none !important;
    color: #374151 !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    min-height: 48px !important;
  }
  
  .dropdown-action-btn:hover,
  .dropdown-action-btn:active {
    background: rgba(161,161,170, 0.08) !important;
  }
  
  .dropdown-action-btn svg {
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
  }
  
  /* 分隔线 */
  .dropdown-divider {
    height: 1px !important;
    margin: 12px 0 !important;
    background: rgba(148, 163, 184, 0.2) !important;
    border: none !important;
  }
  
  /* 登出链接 */
  .logout-link {
    color: #ef4444 !important;
    font-weight: 500 !important;
  }
  
  .logout-link:hover {
    background: rgba(239, 68, 68, 0.08) !important;
  }
}

/* 小屏手机导航优化 */
@media (max-width: 575.98px) {
  .navbar .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  
  .navbar-brand {
    font-size: 14px !important;
  }
  
  .brand-logo-text {
    max-width: 90px !important;
  }
  
  .navbar-collapse {
    left: 12px !important;
    right: 12px !important;
    padding: 12px !important;
    border-radius: 14px !important;
  }
  
  .navbar-nav .nav-link {
    font-size: 15px !important;
    padding: 12px 14px !important;
    min-height: 48px !important;
  }
  
  .nav-dropdown-item-link {
    font-size: 14px !important;
    padding: 11px 12px !important;
    min-height: 44px !important;
  }
}

/* ==================== Hero区域移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 关键修复：固定背景图片，防止滚动跳变 */
  .portfolio-hero-section {
    min-height: 100vh !important;
    min-height: 100dvh !important;
    background-attachment: scroll !important;
    background-position: center center !important;
    background-size: cover !important;
  }
  
  /* 禁止JS修改背景位置和大小导致的跳变 */
  .portfolio-hero-section[data-parallax="true"] {
    background-attachment: scroll !important;
    background-position: center center !important;
    background-size: cover !important;
  }
  
  .portfolio-hero-content {
    padding-top: 100px !important;
    padding-bottom: 80px !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
  }
  
  .portfolio-hero-container {
    max-width: 100% !important;
    text-align: center !important;
  }
  
  /* 标题层级强化 - 主标题最突出 */
  .portfolio-hero-title {
    font-size: clamp(2rem, 8vw, 3rem) !important;
    line-height: 1.2 !important;
    margin-bottom: 24px !important;
    font-weight: 500 !important;
    letter-spacing: -0.02em !important;
  }
  
  .hero-title-line {
    display: block !important;
  }
  
  .title-line-1 {
    font-size: 0.85em !important;
    opacity: 0.9 !important;
    font-weight: 400 !important;
  }
  
  .title-line-2 {
    font-size: 1em !important;
    font-weight: 600 !important;
  }
  
  /* 副标题层级弱化 - 与标题形成明显对比 */
  .portfolio-hero-subtitle {
    font-size: clamp(0.9rem, 3vw, 1rem) !important;
    line-height: 1.7 !important;
    max-width: 100% !important;
    margin-bottom: 32px !important;
    color: rgba(255, 255, 255, 0.65) !important;
    font-weight: 300 !important;
  }
  
  .subtitle-text {
    display: block !important;
    margin-bottom: 8px !important;
    font-size: 0.95em !important;
  }
  
  .subtitle-accent {
    font-size: 0.9em !important;
    opacity: 0.8 !important;
  }
  
  /* 装饰线缩小 */
  .portfolio-hero-divider {
    width: 40px !important;
    margin-bottom: 28px !important;
  }
  
  /* 情绪体验入口 - 移到按钮前面，弱化处理 */
  .portfolio-playground-preview {
    width: 100% !important;
    margin-bottom: 24px !important;
    order: -1 !important;
  }
  
  .playground-link-premium {
    width: auto !important;
    justify-content: center !important;
    font-size: 12px !important;
    padding: 8px 16px !important;
    background: rgba(255, 255, 255, 0.1) !important;
    border-radius: 20px !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: rgba(255, 255, 255, 0.7) !important;
  }
  
  .playground-link-text {
    font-size: 12px !important;
  }
  
  .playground-link-arrow {
    width: 14px !important;
    height: 14px !important;
  }
  
  /* 按钮组 - 主按钮突出，次按钮弱化 */
  .portfolio-hero-buttons {
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
    margin-bottom: 60px !important;
  }
  
  .portfolio-hero-button {
    width: 100% !important;
    padding: 16px 24px !important;
    font-size: 15px !important;
    border-radius: 8px !important;
    min-height: 52px !important;
  }
  
  /* 主按钮更醒目 */
  .portfolio-hero-button-primary {
    background: #ffffff !important;
    color: #000000 !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
  }
  
  /* 次按钮弱化 */
  .portfolio-hero-button-secondary {
    background: transparent !important;
    color: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    font-weight: 400 !important;
    font-size: 14px !important;
  }
  
  /* 滚动指示器 - 紧凑简洁样式 */
  .portfolio-hero-scroll-indicator {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin-top: 32px !important;
    z-index: 10 !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: rgba(255,255,255,0.1) !important;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-left: 0 !important;
    border-radius: 0 !important;
    animation: mobileScrollBounce 2s ease-in-out infinite !important;
  }
  
  .portfolio-hero-scroll-indicator:hover,
  .portfolio-hero-scroll-indicator:active {
    background: transparent !important;
    transform: none !important;
  }
  
  /* 竖线 - 简洁样式 */
  .portfolio-hero-scroll-line {
    width: 1px !important;
    height: 36px !important;
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.5) 0%,
      rgba(255, 255, 255, 0.15) 100%
    ) !important;
    border-radius: 0 !important;
    position: relative !important;
    box-shadow: none !important;
  }
  
  .portfolio-hero-scroll-line::after {
    content: '' !important;
    position: absolute !important;
    top: -2px !important;
    left: -2px !important;
    width: 5px !important;
    height: 5px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.4) !important;
    animation: scrollDotMove 2s ease-in-out infinite !important;
  }
  
  /* 文字 - 简洁样式 */
  .portfolio-hero-scroll-text {
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 0.12em !important;
    color: rgba(255, 255, 255, 0.5) !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
    display: block !important;
    margin-bottom: 0 !important;
  }
  
  /* 移动端滚动指示器动画 */
  @keyframes mobileScrollBounce {
    0%, 100% { 
      transform: translateY(0); 
      opacity: 1;
    }
    50% { 
      transform: translateY(8px); 
      opacity: 0.8;
    }
  }
  
  @keyframes scrollDotMove {
    0% { 
      top: -2px; 
      opacity: 1; 
    }
    75% { 
      top: calc(100% - 3px); 
      opacity: 0.4; 
    }
    100% { 
      top: -2px; 
      opacity: 1; 
    }
  }
}

@media (max-width: 767.98px) {
  .portfolio-hero-section {
    min-height: 100vh !important;
    min-height: 100dvh !important;
  }
  
  .portfolio-hero-content {
    padding-top: 90px !important;
    padding-bottom: 60px !important;
  }
  
  /* 标题进一步调整 */
  .portfolio-hero-title {
    font-size: clamp(1.75rem, 9vw, 2.5rem) !important;
    margin-bottom: 20px !important;
  }
  
  .title-line-1 {
    font-size: 0.8em !important;
  }
  
  /* 副标题进一步弱化 */
  .portfolio-hero-subtitle {
    font-size: 0.9rem !important;
    margin-bottom: 28px !important;
    color: rgba(255, 255, 255, 0.6) !important;
  }
  
  /* 隐藏装饰元素以提升性能 */
  .hero-ambient-glow,
  .hero-particles,
  .hero-grid-decoration {
    display: none !important;
  }
  
  .portfolio-hero-scroll-indicator {
    margin-top: 24px !important;
  }
  
  .portfolio-hero-line-left,
  .portfolio-hero-line-right {
    display: none !important;
  }
}

@media (max-width: 575.98px) {
  .portfolio-hero-section {
    min-height: 100vh !important;
    min-height: 100dvh !important;
  }
  
  .portfolio-hero-content {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
    padding-top: 80px !important;
    padding-bottom: 50px !important;
  }
  
  .portfolio-hero-title {
    font-size: clamp(1.5rem, 10vw, 2rem) !important;
    margin-bottom: 16px !important;
  }
  
  .title-line-1 {
    font-size: 0.75em !important;
    opacity: 0.85 !important;
  }
  
  .title-line-2 {
    font-size: 1em !important;
    font-weight: 700 !important;
  }
  
  .portfolio-hero-subtitle {
    font-size: 0.85rem !important;
    margin-bottom: 24px !important;
    color: rgba(255, 255, 255, 0.55) !important;
  }
  
  .portfolio-hero-divider {
    width: 32px !important;
    margin-bottom: 20px !important;
  }
  
  .portfolio-hero-button {
    padding: 14px 20px !important;
    font-size: 14px !important;
    min-height: 48px !important;
  }
  
  .portfolio-hero-button-primary {
    font-size: 15px !important;
    font-weight: 600 !important;
  }
  
  .portfolio-hero-button-secondary {
    font-size: 13px !important;
  }
  
  .playground-link-premium {
    font-size: 11px !important;
    padding: 6px 12px !important;
  }
}

/* ==================== 数据统计区域移动端优化 ==================== */
@media (max-width: 991.98px) {
  .portfolio-stats-section {
    padding: 68px 0 !important;
  }
  
  .portfolio-stats-scale,
  .portfolio-stats-results {
    flex-direction: column !important;
    gap: 36px !important;
  }
  
  .portfolio-stats-scale {
    margin-bottom: 36px !important;
  }
  
  .portfolio-stat-divider {
    display: none !important;
  }
  
  .portfolio-stat-item {
    text-align: center !important;
    padding: 20px !important;
  }
  
  .portfolio-stat-value {
    font-size: clamp(40px, 8vw, 56px) !important;
  }
  
  .portfolio-stat-label {
    font-size: 14px !important;
  }
}

@media (max-width: 575.98px) {
  .portfolio-stats-section {
    padding: 48px 0 !important;
  }
  
  .portfolio-stat-value {
    font-size: clamp(36px, 10vw, 44px) !important;
  }
  
  .portfolio-stat-label {
    font-size: 13px !important;
  }
}

/* ==================== 滚动叙事区域移动端优化 ==================== */
@media (max-width: 991.98px) {
  .scrollytelling-section {
    padding: 64px 0 !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .scrollytelling-header {
    margin-bottom: 40px !important;
  }

  .scrollytelling-title {
    font-size: 2rem !important;
    margin-bottom: 0.6rem !important;
  }

  .scrollytelling-subtitle {
    font-size: 1rem !important;
  }

  .scrollytelling-steps {
    touch-action: pan-y !important;
  }

  .scrollytelling-steps::before {
    display: none !important;
  }

  .scrollytelling-step {
    flex-direction: column !important;
    gap: 28px !important;
    padding: 36px 0 !important;
    touch-action: pan-y !important;
  }

  .scrollytelling-step::before {
    display: none !important;
  }

  .step-image {
    flex: none !important;
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 auto !important;
    aspect-ratio: 1 / 1 !important;
    touch-action: pan-y !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    -webkit-user-drag: none !important;
    pointer-events: none !important;
    position: relative !important;
  }

  .step-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    touch-action: pan-y !important;
    pointer-events: none !important;
    -webkit-touch-callout: none !important;
    -webkit-user-drag: none !important;
    user-drag: none !important;
  }

  .step-icon,
  .step-decor,
  .step-image::before,
  .step-image::after {
    pointer-events: none !important;
  }

  .step-text {
    width: 100% !important;
    text-align: center !important;
  }

  .scrollytelling-step .step-description {
    max-width: none !important;
    font-size: 0.95rem !important;
  }

  .scrollytelling-step .step-number {
    font-size: 3.2rem !important;
  }

  .scrollytelling-step .step-title {
    font-size: 1.5rem !important;
  }

  .scrollytelling-step:hover .step-title {
    color: #1d1d1f !important;
  }
}

@media (max-width: 575.98px) {
  .scrollytelling-section {
    padding: 40px 0 !important;
    touch-action: pan-y !important;
  }
  
  .scrollytelling-header {
    padding: 0 1rem !important;
  }
  
  .scrollytelling-title {
    font-size: 1.75rem !important;
  }
  
  .scrollytelling-steps {
    padding: 0 1rem !important;
    touch-action: pan-y !important;
  }
  
  .step-decor {
    display: none !important;
  }
  
  .step-icon {
    width: 60px !important;
    height: 60px !important;
  }
  
  .step-icon svg {
    width: 30px !important;
    height: 30px !important;
  }
}

/* ==================== 核心功能区域移动端优化 ==================== */
@media (max-width: 991.98px) {
  .portfolio-features-section {
    padding: 72px 0 !important;
  }
  
  .portfolio-features-header {
    text-align: center !important;
    margin-bottom: 44px !important;
  }
  
  .portfolio-features-title {
    font-size: clamp(28px, 4.5vw, 36px) !important;
    line-height: 1.2 !important;
  }
  
  .portfolio-features-subtitle {
    font-size: 15px !important;
  }
  
  .portfolio-features-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  
  .portfolio-feature-item {
    max-width: 500px !important;
    margin: 0 auto !important;
  }
  
  .features-controls {
    display: flex !important;
    justify-content: center !important;
    gap: 16px !important;
    margin-top: 32px !important;
  }
  
  .features-control-btn {
    width: 48px !important;
    height: 48px !important;
  }
}

@media (max-width: 767.98px) {
  .portfolio-features-section {
    padding: 56px 0 !important;
  }
  
  .portfolio-features-title {
    font-size: 26px !important;
  }
  
  .portfolio-feature-item {
    padding: 24px !important;
  }
  
  .feature-image-wrapper {
    margin-bottom: 20px !important;
  }
}

@media (max-width: 575.98px) {
  .portfolio-features-section {
    padding: 48px 0 !important;
  }
  
  .portfolio-features-header {
    padding: 0 1rem !important;
  }
  
  .portfolio-features-grid {
    padding: 0 1rem !important;
  }
  
  .portfolio-feature-item {
    padding: 20px !important;
  }
  
  .feature-title {
    font-size: 17px !important;
  }
  
  .feature-description {
    font-size: 0.95rem !important;
  }
}

/* ==================== 案例区域移动端优化 ==================== */
@media (max-width: 991.98px) {
  .pentagram-case-section {
    padding: 72px 0 !important;
  }
  
  .pentagram-case-header {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
    margin-bottom: 40px !important;
  }
  
  .pentagram-case-title {
    font-size: clamp(28px, 4.5vw, 36px) !important;
  }
  
  .pentagram-case-description {
    font-size: 14px !important;
  }
  
  .pentagram-case-count {
    font-size: 13px !important;
  }
  
  .pentagram-case-slide {
    flex: 0 0 calc(50% - 10px) !important;
    min-width: 220px !important;
  }
  
  .pentagram-case-footer {
    flex-direction: column !important;
    gap: 20px !important;
    align-items: stretch !important;
  }
  
  .pentagram-case-scrollbar {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  .pentagram-case-more {
    align-self: flex-end !important;
  }
}

@media (max-width: 767.98px) {
  .pentagram-case-section {
    padding: 56px 0 !important;
  }
  
  .pentagram-case-header {
    padding: 0 1rem !important;
  }
  
  .pentagram-case-title {
    font-size: 26px !important;
  }
  
  .pentagram-case-carousel {
    padding: 0 1rem !important;
  }
  
  .pentagram-case-slide {
    flex: 0 0 85% !important;
    min-width: auto !important;
  }
  
  .pentagram-case-footer {
    padding: 0 1rem !important;
  }
}

@media (max-width: 575.98px) {
  .pentagram-case-section {
    padding: 48px 0 !important;
  }
  
  .pentagram-case-more {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ==================== CTA区域移动端优化 - 高级质感 ==================== */
@media (max-width: 991.98px) {
  .cta-section-final {
    padding: 80px 0 !important;
  }
  
  .cta-content {
    text-align: center !important;
  }
  
  .cta-content h2 {
    font-size: clamp(1.75rem, 4vw, 2.5rem) !important;
    line-height: 1.2 !important;
    margin-bottom: 16px !important;
  }
  
  .cta-subtitle {
    font-size: 1rem !important;
    margin-bottom: 32px !important;
  }
  
  .cta-features {
    flex-direction: column !important;
    gap: 12px !important;
    align-items: center !important;
    margin-bottom: 32px !important;
  }
  
  .cta-feature {
    font-size: 0.95rem !important;
  }
  
  .cta-actions {
    flex-direction: column !important;
    gap: 14px !important;
  }
  
  .btn-primary-cta {
    width: 100% !important;
    padding: 15px 32px !important;
    font-size: 15px !important;
    justify-content: center !important;
  }
  
  .cta-note {
    font-size: 0.85rem !important;
  }
}

@media (max-width: 767.98px) {
  .cta-section-final {
    padding: 64px 0 !important;
  }
  
  .cta-content h2 {
    font-size: 1.65rem !important;
  }
  
  .cta-content {
    padding: 0 1rem !important;
  }
}

@media (max-width: 575.98px) {
  .cta-section-final {
    padding: 52px 0 !important;
  }
  
  .cta-badge {
    font-size: 0.8rem !important;
    padding: 5px 14px !important;
  }
}

/* ==================== 底部移动端优化 ==================== */
@media (max-width: 991.98px) {
  .footer-glass {
    padding: 64px 0 32px !important;
  }
  
  .footer-content {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 36px !important;
    margin-bottom: 48px !important;
  }
  
  .footer-brand {
    grid-column: 1 / -1 !important;
    text-align: center !important;
    align-items: center !important;
  }
  
  .footer-description {
    max-width: 100% !important;
    margin: 0 auto !important;
  }
  
  .footer-links,
  .footer-contact {
    text-align: center !important;
  }
  
  .footer-links ul,
  .footer-contact ul {
    align-items: center !important;
  }
}

@media (max-width: 767.98px) {
  .footer-content {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  
  .footer-brand {
    padding-bottom: 8px !important;
  }
  
  .footer-logo {
    justify-content: center !important;
  }
}

@media (max-width: 575.98px) {
  .footer-glass {
    padding: 52px 0 28px !important;
  }
  
  .footer-content {
    padding: 0 1rem !important;
  }
  
  .footer-tagline {
    font-size: 13px !important;
  }
  
  .footer-description {
    font-size: 12px !important;
  }
  
  .footer-bottom {
    flex-direction: column !important;
    gap: 14px !important;
    text-align: center !important;
    padding-top: 24px !important;
  }
  
  .footer-legal {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 14px !important;
  }
}

/* ==================== 触摸交互优化 ==================== */
@media (hover: none) and (pointer: coarse) {
  /* 增大触摸目标 */
  .nav-link,
  .btn,
  .nav-dropdown-item-link,
  .dropdown-action-btn {
    min-height: 44px !important;
    min-width: 44px !important;
  }
  
  /* 移除悬停效果，改为点击效果 */
  .navbar-nav .nav-link:hover {
    background: transparent !important;
  }
  
  .navbar-nav .nav-link:active {
    background: rgba(161,161,170, 0.1) !important;
  }
  
  .btn:hover {
    transform: none !important;
  }
  
  .btn:active {
    transform: scale(0.98) !important;
  }
  
  /* 卡片点击反馈 */
  .portfolio-feature-item:hover,
  .case-preview-card:hover,
  .feature-card-item:hover {
    transform: none !important;
  }
  
  .portfolio-feature-item:active,
  .case-preview-card:active,
  .feature-card-item:active {
    transform: scale(0.98) !important;
  }
  
  /* 移除复杂动画以提升性能 */
  .glass-card-shine::before,
  .btn-primary-new::before,
  .btn-outline-new::before {
    display: none !important;
  }
}

/* ==================== 性能优化 - 移动端 ==================== */
@media (max-width: 767.98px) {
  /* 禁用视差效果 */
  .portfolio-hero-section[data-parallax="true"] {
    background-attachment: scroll !important;
  }
  
  /* 简化动画 */
  .hero-illustration {
    transform: none !important;
  }
  
  /* 减少阴影复杂度 */
  .shadow-xl,
  .shadow-2xl {
    box-shadow: var(--shadow-md) !important;
  }
}

/* ==================== 安全区域适配 - 刘海屏等 ==================== */
@supports (padding: env(safe-area-inset-top)) {
  .navbar {
    padding-top: calc(16px + env(safe-area-inset-top)) !important;
  }
  
  .navbar.scrolled {
    padding-top: calc(12px + env(safe-area-inset-top)) !important;
  }
  
  .portfolio-hero-content {
    padding-top: calc(100px + env(safe-area-inset-top)) !important;
  }
  
  .footer-glass {
    padding-bottom: calc(40px + env(safe-area-inset-bottom)) !important;
  }
}

/* ==================== 横屏模式优化 ==================== */
@media (max-width: 991.98px) and (orientation: landscape) {
  .portfolio-hero-section {
    min-height: 100vh !important;
  }
  
  .portfolio-hero-content {
    padding-top: 80px !important;
    padding-bottom: 40px !important;
  }
  
  .portfolio-hero-title {
    font-size: 2rem !important;
  }
  
  /* 两列布局 */
  .portfolio-features-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ==================== 高对比度模式支持 ==================== */
@media (prefers-contrast: high) {
  .navbar {
    border-bottom: 2px solid var(--gray-300) !important;
  }
  
  .nav-link {
    font-weight: 600 !important;
  }
}

/* ==================== 减少动画模式支持 ==================== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  
  .scroll-indicator {
    animation: none !important;
  }
}

/* ==================== 通用图片自适应优化 ==================== */
@media (max-width: 991.98px) {
  img {
    max-width: 100% !important;
    height: auto !important;
  }
  
  /* 防止内容溢出屏幕 */
  .container,
  .container-fluid,
  .row {
    overflow-x: hidden !important;
  }
  
  /* 图片容器自适应 */
  .image-wrapper,
  .img-container,
  .feature-image-wrapper,
  .step-image {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* SVG图标自适应 */
  svg {
    max-width: 100% !important;
  }
}

/* ==================== 表单元素移动端优化 ==================== */
@media (max-width: 991.98px) {
  input,
  select,
  textarea,
  button {
    font-size: 16px !important; /* 防止iOS缩放 */
  }
  
  .form-control,
  .form-select {
    padding: 12px 16px !important;
    min-height: 44px !important;
  }
  
  .form-group {
    margin-bottom: 1.5rem !important;
  }
  
  .form-label {
    font-size: 1rem !important;
    margin-bottom: 0.5rem !important;
  }
}

/* ==================== 卡片和列表移动端优化 ==================== */
@media (max-width: 991.98px) {
  .card,
  .feature-card,
  .case-card,
  .portfolio-feature-item {
    padding: 20px !important;
    margin: 0 !important;
  }
  
  .list-group-item {
    padding: 12px 16px !important;
  }
  
  /* 网格布局调整 */
  .grid-2,
  .grid-3,
  .grid-4 {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

/* ==================== 文本和排版移动端优化 ==================== */
@media (max-width: 991.98px) {
  h1 {
    font-size: clamp(1.75rem, 5vw, 2.5rem) !important;
  }
  
  h2 {
    font-size: clamp(1.5rem, 4vw, 2rem) !important;
  }
  
  h3 {
    font-size: clamp(1.25rem, 3.5vw, 1.75rem) !important;
  }
  
  h4 {
    font-size: clamp(1.1rem, 3vw, 1.5rem) !important;
  }
  
  p {
    font-size: 1rem !important;
    line-height: 1.6 !important;
  }
  
  small {
    font-size: 0.875rem !important;
  }
  
  /* 防止长文本溢出 */
  .text-truncate {
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }
}

/* ==================== 间距和布局移动端优化 ==================== */
@media (max-width: 991.98px) {
  section {
    padding: 40px 0 !important;
  }
  
  .section-header {
    margin-bottom: 32px !important;
    text-align: center !important;
  }
  
  .section-title {
    font-size: 1.75rem !important;
    margin-bottom: 0.75rem !important;
  }
  
  .section-subtitle {
    font-size: 1rem !important;
  }
  
  /* 容器内边距 */
  .container {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  
  /* 按钮组优化 */
  .btn-group {
    flex-direction: column !important;
  }
  
  .btn-group > .btn {
    border-radius: 0.5rem !important;
    margin-bottom: 8px !important;
  }
}

/* ==================== 小屏幕（< 400px）极端优化 ==================== */
@media (max-width: 399.98px) {
  html {
    font-size: 11px !important;
  }
  
  .navbar-brand {
    font-size: 13px !important;
  }
  
  .navbar-brand svg {
    width: 16px !important;
    height: 16px !important;
  }
  
  .portfolio-hero-title {
    font-size: 1.5rem !important;
  }
  
  .portfolio-hero-subtitle {
    font-size: 0.95rem !important;
  }
  
  .btn {
    padding: 12px 20px !important;
    font-size: 14px !important;
  }
}

/* ==================== 横屏小屏幕优化 ==================== */
@media (max-height: 500px) and (orientation: landscape) {
  .portfolio-hero-section {
    min-height: auto !important;
    padding: 60px 0 !important;
  }
  
  .portfolio-hero-content {
    padding-top: 60px !important;
    padding-bottom: 40px !important;
  }
  
  .navbar {
    padding: 8px 0 !important;
  }
}

/* ==================== 全局移动端防误触策略 ==================== */
@media (max-width: 991.98px) {
  /* 
   * 核心原则：只对特定元素禁用误触行为
   * 不影响页面的正常滚动！
   */
  html, body {
    -webkit-text-size-adjust: 100% !important;
    -webkit-tap-highlight-color: transparent !important;
    /* 不设置 touch-action，让浏览器默认处理滚动 */
  }
  
  /* ========== 防止图片/媒体拖拽和长按菜单（关键：只针对媒体元素） ========== */
  img,
  canvas,
  video,
  audio {
    -webkit-user-drag: none !important;
    user-drag: none !important;
    -webkit-touch-callout: none !important;
    max-width: 100% !important;
  }
  
  /* 装饰性SVG图标不拦截触摸（仅装饰性的） */
  svg[aria-hidden="true"] {
    pointer-events: none !important;
    -webkit-user-drag: none !important;
  }
  
  /* Hero区域和流程区域的图片穿透（之前已有的优化保留） */
  .step-image img,
  .intro-section-image img,
  [class*="hero"] img,
  [class*="feature-image"] img {
    pointer-events: none !important;
    -webkit-user-drag: none !important;
  }
  
  /* ========== 可交互元素：确保可点击 ========== */
  a,
  button,
  input,
  select,
  textarea,
  [role="button"],
  [tabindex]:not([tabindex="-1"]) {
    cursor: pointer !important;
    -webkit-tap-highlight-color: rgba(161,161,170, 0.15) !important;
  }
  
  /* 输入框内文字可选 */
  input,
  textarea {
    -webkit-user-select: text !important;
    user-select: text !important;
  }
  
  /* ========== 特殊模块例外规则 ========== */
  
  /* Chatbot：完整触摸支持 */
  #chatbot-widget,
  #chatbot-widget *,
  .chatbot-widget,
  .chatbot-widget * {
    touch-action: auto !important;
    pointer-events: auto !important;
    -webkit-user-select: auto !important;
    user-select: auto !important;
    -webkit-user-drag: auto !important;
  }
  
  /* 3D画布：允许旋转/缩放手势 */
  .space3d-canvas,
  .space3d-canvas canvas,
  #space3d-canvas,
  #space3d-canvas canvas {
    touch-action: none !important;
    pointer-events: auto !important;
  }
}

/* 非移动端：保持原有行为 */
@media (min-width: 992px) {
  * {
    touch-action: auto !important;
    -webkit-user-select: auto !important;
    user-select: auto !important;
  }
}

/* ==================== 优化滚动体验 ==================== */
@media (max-width: 991.98px) {
  html {
    scroll-behavior: smooth !important;
  }
  
  /* 改善iOS滚动性能 */
  .scroll-container,
  .overflow-auto,
  .overflow-y-auto {
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ==================== 输入框和选择框优化 ==================== */
@media (max-width: 991.98px) {
  /* 移除iOS默认样式 */
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="tel"],
  input[type="number"],
  select,
  textarea {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    border-radius: 8px !important;
  }
  
  /* 日期选择器优化 */
  input[type="date"],
  input[type="time"],
  input[type="datetime-local"] {
    min-height: 44px !important;
  }
}

/* ==================== 加载状态优化 ==================== */
@media (max-width: 991.98px) {
  .loading-screen,
  .spinner-container {
    padding: 1rem !important;
  }
  
  .loading-spinner {
    width: 40px !important;
    height: 40px !important;
  }
}

/* ==================== 模态框和弹窗移动端优化 ==================== */
@media (max-width: 991.98px) {
  .modal-dialog {
    margin: 0.5rem !important;
    max-width: none !important;
  }
  
  .modal-content {
    border-radius: 1rem !important;
  }
  
  .modal-header,
  .modal-body,
  .modal-footer {
    padding: 1.25rem !important;
  }
  
  .modal-title {
    font-size: 1.25rem !important;
  }
  
  /* Toast和通知优化 */
  .toast-container,
  .notification-container {
    padding: 0.5rem !important;
  }
  
  .toast,
  .notification {
    max-width: 100% !important;
    margin: 0.25rem 0 !important;
  }
}

/* ==================== 表格移动端优化 ==================== */
@media (max-width: 991.98px) {
  table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  
  th,
  td {
    padding: 12px 8px !important;
    font-size: 0.9rem !important;
    white-space: nowrap !important;
  }
}

/* ==================== 标签和徽章移动端优化 ==================== */
@media (max-width: 991.98px) {
  .badge,
  .tag,
  .chip {
    font-size: 0.8rem !important;
    padding: 4px 10px !important;
  }
}

/* ==================== 进度条和滑块移动端优化 ==================== */
@media (max-width: 991.98px) {
  .progress {
    height: 12px !important;
  }
  
  input[type="range"] {
    height: 44px !important;
  }
}

/* ==================== 3D预览页面移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 3D主容器优化 */
  .space3d-premium {
    min-height: 100vh !important;
    overflow-x: hidden !important;
  }
  
  .space3d-viewport {
    flex-direction: column !important;
    min-height: 100vh !important;
  }
  
  /* 3D画布容器优化 */
  .space3d-canvas {
    height: 50vh !important;
    min-height: 350px !important;
    max-height: 500px !important;
    width: 100% !important;
    position: relative !important;
    flex-shrink: 0 !important;
  }
  
  /* 确保Three.js canvas自适应 */
  .space3d-canvas canvas {
    width: 100% !important;
    height: 100% !important;
    touch-action: none !important;
  }
  
  /* 头部区域优化 */
  .space3d-header {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    padding: 16px !important;
    z-index: 10 !important;
    background: linear-gradient(to bottom, rgba(0,0,0,0.6), transparent) !important;
  }
  
  .space3d-back {
    background: rgba(255,255,255,0.95) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
    border-radius: 12px !important;
    padding: 10px 16px !important;
    min-height: 44px !important;
    min-width: 44px !important;
    font-size: 14px !important;
  }
  
  .space3d-title-group {
    display: none !important;
  }
  
  /* 浮动控制按钮优化 */
  .space3d-controls-float {
    position: absolute !important;
    bottom: 16px !important;
    right: 16px !important;
    left: 16px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    z-index: 10 !important;
    gap: 12px !important;
  }
  
  .space3d-control-btn {
    width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    min-width: 48px !important;
    background: rgba(255,255,255,0.95) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
  }
  
  .space3d-control-btn svg {
    width: 20px !important;
    height: 20px !important;
  }
  
  .space3d-divider {
    display: none !important;
  }
  
  .space3d-hint {
    display: none !important;
  }
  
  /* 侧边栏优化 */
  .space3d-sidebar {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 16px !important;
    background: var(--bg-primary) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    flex: 1 !important;
  }
  
  /* 场景信息面板 */
  .space3d-scene-info {
    margin-bottom: 20px !important;
    padding: 20px !important;
    border-radius: 16px !important;
    background: var(--bg-secondary) !important;
    border: 1px solid rgba(var(--primary-color-rgb), 0.1) !important;
  }
  
  .space3d-panel-label {
    font-size: 12px !important;
    margin-bottom: 8px !important;
  }
  
  .space3d-panel-value {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin-bottom: 12px !important;
  }
  
  .space3d-panel-detail {
    font-size: 14px !important;
    gap: 8px !important;
  }
  
  /* 工具列表网格 */
  .space3d-tools-list {
    margin-bottom: 20px !important;
  }
  
  .space3d-panel-header {
    margin-bottom: 16px !important;
  }
  
  .space3d-tools-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  
  .space3d-tool-item {
    padding: 16px !important;
    border-radius: 12px !important;
    min-height: 80px !important;
    position: relative !important;
  }
  
  .space3d-tool-index {
    width: 28px !important;
    height: 28px !important;
    font-size: 12px !important;
    border-radius: 8px !important;
    margin-bottom: 12px !important;
  }
  
  .space3d-tool-name {
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-bottom: 4px !important;
  }
  
  .space3d-tool-price {
    font-size: 12px !important;
    opacity: 0.8 !important;
  }
  
  /* 价格卡片 */
  .space3d-pricing-card {
    padding: 20px !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, rgba(var(--primary-color-rgb), 0.1), rgba(var(--success-color-rgb), 0.05)) !important;
    border: 1px solid rgba(var(--primary-color-rgb), 0.2) !important;
  }
  
  .space3d-pricing-top {
    text-align: center !important;
    margin-bottom: 16px !important;
  }
  
  .space3d-pricing-label {
    font-size: 12px !important;
    margin-bottom: 8px !important;
  }
  
  .space3d-pricing-amount {
    font-size: 28px !important;
    font-weight: 700 !important;
  }
  
  .space3d-export-btn {
    width: 100% !important;
    padding: 14px 24px !important;
    font-size: 15px !important;
    min-height: 48px !important;
    border-radius: 12px !important;
    gap: 8px !important;
  }
}

/* 小屏手机3D页面优化 */
@media (max-width: 575.98px) {
  .space3d-canvas {
    height: 45vh !important;
    min-height: 300px !important;
  }
  
  .space3d-tools-grid {
    grid-template-columns: 1fr !important;
  }
  
  .space3d-control-btn {
    width: 44px !important;
    height: 44px !important;
  }
  
  .space3d-pricing-amount {
    font-size: 24px !important;
  }
}

/* 横屏模式3D页面优化 */
@media (max-width: 991.98px) and (orientation: landscape) {
  .space3d-viewport {
    flex-direction: row !important;
  }
  
  .space3d-canvas {
    height: 100vh !important;
    width: 60% !important;
    min-height: auto !important;
    max-height: none !important;
  }
  
  .space3d-sidebar {
    width: 40% !important;
    height: 100vh !important;
    overflow-y: auto !important;
  }
  
  .space3d-tools-grid {
    grid-template-columns: 1fr !important;
  }
}

/* 确保3D模块元素正确显示 */
.space3d-premium,
.space3d-viewport,
.space3d-canvas,
.space3d-header,
.space3d-controls-float,
.space3d-sidebar {
  box-sizing: border-box !important;
}

/* 防止3D canvas溢出 */
.space3d-canvas canvas {
  display: block !important;
}

/* ==================== 方案生成/介绍页面移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 页面容器 */
  .solution-intro-module {
    overflow-x: hidden !important;
    width: 100% !important;
  }
  
  /* Hero区域 */
  .intro-hero {
    padding: 60px 0 40px !important;
  }
  
  .intro-back-btn {
    font-size: 14px !important;
    margin-bottom: 24px !important;
    min-height: 44px !important;
    align-items: center !important;
  }
  
  .intro-back-btn svg {
    width: 18px !important;
    height: 18px !important;
  }
  
  .intro-label {
    font-size: 12px !important;
    margin-bottom: 12px !important;
  }
  
  .intro-title {
    font-size: clamp(2rem, 8vw, 3rem) !important;
    line-height: 1.15 !important;
    margin-bottom: 12px !important;
  }
  
  .intro-subtitle {
    font-size: clamp(1rem, 4vw, 1.25rem) !important;
    line-height: 1.5 !important;
    max-width: 95% !important;
  }
  
  /* 内容区域 - 关键修复：确保内容不溢出 */
  .intro-content {
    padding: 60px 0 !important;
    overflow-x: hidden !important;
  }
  
  /* 核心修复：section改为单列布局，防止内容截断 */
  .intro-section {
    display: flex !important;
    flex-direction: column !important;
    gap: 32px !important;
    margin-bottom: 60px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  
  .intro-section-reverse {
    direction: ltr !important;
    flex-direction: column-reverse !important;
  }
  
  /* 图片区域 - 确保图片自适应且不溢出 */
  .intro-section-image {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    border-radius: 16px !important;
  }
  
  .intro-section-image img {
    width: 100% !important;
    height: auto !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
    display: block !important;
  }
  
  /* 文本区域 */
  .intro-section-text {
    gap: 18px !important;
    width: 100% !important;
  }
  
  .intro-section-title {
    font-size: clamp(1.5rem, 5vw, 2rem) !important;
    line-height: 1.25 !important;
  }
  
  .intro-section-description {
    font-size: 15px !important;
    line-height: 1.7 !important;
  }
  
  /* 功能特性列表 */
  .intro-feature-list {
    gap: 16px !important;
  }
  
  .intro-feature-item {
    gap: 12px !important;
    padding: 14px !important;
    background: rgba(248, 250, 252, 0.8) !important;
    border-radius: 12px !important;
  }
  
  .intro-feature-icon {
    width: 32px !important;
    height: 32px !important;
    border-radius: 8px !important;
    padding: 5px !important;
  }
  
  .intro-feature-content h3 {
    font-size: 15px !important;
    margin-bottom: 2px !important;
  }
  
  .intro-feature-content p {
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
  
  /* 步骤列表 */
  .intro-steps {
    gap: 20px !important;
  }
  
  .intro-step {
    gap: 16px !important;
    padding: 16px !important;
    background: rgba(248, 250, 252, 0.5) !important;
    border-radius: 12px !important;
  }
  
  .intro-step-number {
    width: 40px !important;
    height: 40px !important;
    font-size: 18px !important;
    border-radius: 10px !important;
    flex-shrink: 0 !important;
  }
  
  .intro-step-content h3 {
    font-size: 16px !important;
    margin-bottom: 4px !important;
  }
  
  .intro-step-content p {
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
  
  /* CTA区域 - 修复负margin导致的截断问题 */
  .intro-cta-section {
    margin: 0 -16px !important;
    padding: 48px 20px !important;
    border-radius: 20px !important;
  }
  
  .intro-cta-section h2 {
    font-size: clamp(1.5rem, 5vw, 2rem) !important;
    margin-bottom: 8px !important;
  }
  
  .intro-cta-section p {
    font-size: 15px !important;
    margin-bottom: 28px !important;
  }
  
  .intro-cta-buttons {
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
  }
  
  .intro-cta-btn {
    width: 100% !important;
    padding: 14px 28px !important;
    font-size: 15px !important;
    border-radius: 12px !important;
    min-height: 48px !important;
  }
}

/* 小屏手机方案页面优化 */
@media (max-width: 575.98px) {
  .intro-hero {
    padding: 48px 0 36px !important;
  }
  
  .intro-back-btn {
    font-size: 13px !important;
    margin-bottom: 20px !important;
  }
  
  .intro-title {
    font-size: clamp(1.75rem, 9vw, 2.5rem) !important;
  }
  
  .intro-subtitle {
    font-size: 1rem !important;
  }
  
  .intro-content {
    padding: 48px 0 !important;
  }
  
  .intro-section {
    gap: 24px !important;
    margin-bottom: 48px !important;
  }
  
  .intro-section-image img {
    border-radius: 12px !important;
  }
  
  .intro-section-text {
    gap: 14px !important;
  }
  
  .intro-section-title {
    font-size: 1.5rem !important;
  }
  
  .intro-section-description {
    font-size: 14px !important;
  }
  
  .intro-feature-item {
    gap: 10px !important;
    padding: 12px !important;
  }
  
  .intro-feature-icon {
    width: 28px !important;
    height: 28px !important;
  }
  
  .intro-feature-content h3 {
    font-size: 14px !important;
  }
  
  .intro-feature-content p {
    font-size: 12px !important;
  }
  
  .intro-steps {
    gap: 16px !important;
  }
  
  .intro-step {
    gap: 12px !important;
    padding: 14px !important;
  }
  
  .intro-step-number {
    width: 36px !important;
    height: 36px !important;
    font-size: 16px !important;
  }
  
  .intro-step-content h3 {
    font-size: 15px !important;
  }
  
  .intro-cta-section {
    margin: 0 -12px !important;
    padding: 40px 16px !important;
    border-radius: 16px !important;
  }
  
  .intro-cta-section h2 {
    font-size: 1.5rem !important;
  }
  
  .intro-cta-section p {
    font-size: 14px !important;
  }
  
  .intro-cta-btn {
    padding: 12px 24px !important;
    font-size: 14px !important;
    min-height: 44px !important;
  }
}

/* 极小屏幕适配 (<400px) */
@media (max-width: 399.98px) {
  .intro-title {
    font-size: 1.65rem !important;
  }
  
  .intro-section-title {
    font-size: 1.35rem !important;
  }
  
  .intro-feature-content h3,
  .intro-step-content h3 {
    font-size: 14px !important;
  }
}

/* ==================== 隐藏移动端AI助手 ==================== */
@media (max-width: 991.98px) {
  #chatbot-widget,
  .chatbot-widget {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    z-index: -1 !important;
  }
}

/* ==================== 团队介绍页面(About)移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 页面容器 */
  [style*="min-height:100vh;background:#ffffff"] {
    overflow-x: hidden !important;
    width: 100% !important;
  }
  
  /* 返回按钮 */
  #back-link,
  a[href="/"] {
    min-height: 44px !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
  }
  
  /* Hero区域 - 标题和副标题 */
  [style*="font-size:48px;font-weight:600"] {
    font-size: clamp(2rem, 8vw, 3rem) !important;
  }
  
  /* 项目简介区域 - 双列转单列 */
  section[style*="padding:96px 0;border-top:1px solid #e8e8e8;"] > div[style*="display:grid;grid-template-columns:1fr 1fr"],
  div[style*="display:grid;grid-template-columns:1fr 1fr;gap:80px"] {
    display: flex !important;
    flex-direction: column !important;
    gap: 32px !important;
    width: 100% !important;
  }
  
  /* 项目简介图片容器 */
  div[style*="width:100%;aspect-ratio:1;background:#fafafa"] {
    border-radius: 16px !important;
  }
  
  div[style*="width:100%;aspect-ratio:1;background:#fafafa"] svg {
    width: 60% !important;
    height: auto !important;
  }
  
  /* 项目简介文字区域标题 */
  div[style*="font-size:32px;font-weight:600;color:#1a1a1a;margin:0 0 28px 0"] {
    font-size: clamp(1.5rem, 5vw, 2rem) !important;
    margin-bottom: 20px !important;
  }
  
  /* 项目简介段落 */
  p[style*="font-size:16px;color:#6b6b6b;line-height:1.8"] {
    font-size: 15px !important;
    line-height: 1.7 !important;
  }
  
  /* 技术标签 */
  span[style*="display:inline-flex;align-items:center;gap:10px;padding:12px 20px"] {
    padding: 10px 16px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
  }
  
  /* 技术架构/核心团队 - 三列转单列 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:32px"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    max-width: 100% !important;
  }
  
  /* 技术卡片 */
  div[style*="padding:32px;background:#fafafa;border:1px solid #e8e8e8;border-radius:16px"] {
    padding: 24px 20px !important;
  }
  
  /* 技术卡片图标容器 */
  div[style*="width:56px;height:56px;background:#1a1a1a;border-radius:14px"] {
    width: 48px !important;
    height: 48px !important;
    margin-bottom: 16px !important;
  }
  
  /* 技术卡片标题 */
  h3[style*="font-size:18px;font-weight:600;color:#1a1a1a;margin:0 0 12px 0"] {
    font-size: 16px !important;
    margin-bottom: 10px !important;
  }
  
  /* 技术标签小项 */
  span[style*="display:inline-block;padding:8px 14px;background:#ffffff"] {
    padding: 6px 12px !important;
    font-size: 12px !important;
  }
  
  /* 团队成员卡片 */
  div[style*="padding:40px 32px;background:#fafafa;border:1px solid #e8e8e8;border-radius:16px;text-align:center"] {
    padding: 24px 20px !important;
  }
  
  /* 团队头像容器 */
  div[style*="width:104px;height:104px;background:#1a1a1a;border-radius:50%"] {
    width: 80px !important;
    height: 80px !important;
    margin-bottom: 16px !important;
  }
  
  /* 联系我们区域 */
  div[style*="padding:56px 48px;background:#fafafa;border:1px solid #e8e8e8;border-radius:20px;text-align:center"] {
    padding: 36px 20px !important;
    border-radius: 16px !important;
  }
  
  /* 联系方式列表 - 垂直排列 */
  div[style*="display:flex;flex-wrap:wrap;justify-content:center;gap:40px"] {
    flex-direction: column !important;
    align-items: center !important;
    gap: 20px !important;
  }
  
  /* 联系方式单项 */
  div[style*="display:flex;align-items:center;gap:12px"]:has(svg) {
    justify-content: center !important;
  }
  
  /* 联系方式图标 */
  div[style*="width:56px;height:56px;background:#ffffff;border:1px solid #e8e8e8;border-radius:14px"] {
    width: 44px !important;
    height: 44px !important;
  }
}

/* 小屏手机团队介绍优化 */
@media (max-width: 575.98px) {
  /* Hero SVG图标缩小 */
  svg[width="80"][height="80"] {
    width: 60px !important;
    height: 60px !important;
  }
  
  svg[width="120"][height="120"] {
    width: 90px !important;
    height: 90px !important;
  }
  
  /* 技术架构三列在小屏保持单列 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:32px"] {
    grid-template-columns: 1fr !important;
  }
}

/* ==================== 个人信息页面(Profile)移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 主布局：侧边栏+内容区 → 单列垂直布局 */
  div[style*="display:grid;grid-template-columns:280px 1fr;gap:40px"] {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
  }
  
  /* 左侧侧边栏 */
  div[style*="display:grid;grid-template-columns:280px 1fr;gap:40px"] > div:first-child {
    width: 100% !important;
    order: -1 !important;
  }
  
  /* 用户信息卡片 */
  div[style*="padding:24px;background:#fafafa;border:1px solid #e8e8e8;border-radius:12px;margin-bottom:24px;text-align:center"] {
    padding: 20px !important;
    text-align: center !important;
  }
  
  /* 用户头像 */
  div[style*="width:80px;height:80px;background:#1a1a1a;border-radius:50%;display:inline-flex"] {
    width: 64px !important;
    height: 64px !important;
    margin-bottom: 12px !important;
  }
  
  div[style*="width:80px;height:80px;background:#1a1a1a;border-radius:50%;display:inline-flex"] span {
    font-size: 26px !important;
  }
  
  /* 导航菜单容器 */
  div[style*="padding:8px;background:#fafafa;border:1px solid #e8e8e8;border-radius:12px;margin-bottom:16px"] {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 8px !important;
  }
  
  /* 导航菜单按钮 - 横向排列 */
  button.nav-item {
    flex: 1 !important;
    min-width: calc(33.333% - 6px) !important;
    text-align: center !important;
    padding: 12px 8px !important;
    font-size: 13px !important;
    min-height: 44px !important;
  }
  
  /* 退出登录按钮 */
  button#logout-btn,
  button[style*="width:100%;height:44px;font-size:14px;border:1px solid #e8e8e8;border-radius:10px;background:#ffffff;color:#6b6b6b"] {
    width: 100% !important;
    height: 48px !important;
    font-size: 14px !important;
  }
  
  /* 右侧内容区 */
  div[style*="display:grid;grid-template-columns:280px 1fr;gap:40px"] > div:last-child {
    width: 100% !important;
  }
  
  /* 内容区标题栏 */
  div[style*="padding:24px;background:#fafafa;border:1px solid #e8e8e8;border-radius:12px;margin-bottom:24px"] {
    padding: 18px 16px !important;
    border-radius: 12px !important;
  }
  
  /* 编辑资料按钮 */
  button#edit-profile-btn,
  button[style*="padding:10px 20px;font-size:14px;border:1px solid #e8e8e8;border-radius:10px"] {
    padding: 10px 16px !important;
    font-size: 13px !important;
    min-height: 38px !important;
  }
  
  /* 信息网格 - 双列转单列 */
  div[style*="display:grid;grid-template-columns:1fr 1fr;gap:16px"] {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }
  
  /* 信息卡片 */
  div[style*="padding:16px;background:#ffffff;border:1px solid #e8e8e8;border-radius:10px"] {
    padding: 14px 12px !important;
  }
  
  /* 统计卡片 - 三列保持但缩小间距 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:16px"] {
    gap: 12px !important;
  }
  
  /* 统计数字 */
  div[style*="font-size:32px;font-weight:600;color:#1a1a1a;margin-bottom:4px"] {
    font-size: 26px !important;
  }
  
  /* 表单输入框 */
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  textarea {
    height: 46px !important;
    min-height: 46px !important;
    font-size: 15px !important;
    padding: 0 14px !important;
    -webkit-appearance: none !important;
  }
  
  textarea {
    height: auto !important;
    min-height: 80px !important;
  }
  
  /* 表单按钮组 */
  div[style*="display:flex;gap:12px"] button {
    min-height: 46px !important;
    font-size: 14px !important;
  }
  
  /* 方案列表卡片 */
  div[style*="padding:16px;background:#ffffff;border:1px solid #e8e8e8;border-radius:10px;display:flex;align-items:center"] {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    padding: 16px !important;
  }
  
  /* 方案操作按钮组 */
  div[style*="display:flex;gap:8px"]:last-child {
    width: 100% !important;
    justify-content: space-between !important;
  }
  
  div[style*="display:flex;gap:8px"]:last-child button {
    flex: 1 !important;
    min-height: 38px !important;
  }
  
  /* 设置区域 */
  div[style*="padding:24px;background:#fafafa;border:1px solid #e8e8e8;border-radius:12px;margin-bottom:16px"] {
    padding: 18px 16px !important;
  }
  
  /* 设置项行 */
  div[style*="display:flex;align-items:center;justify-content:space-between;padding:12px"] {
    flex-direction: row !important;
    gap: 12px !important;
  }
  
  /* 开关控件 */
  label[style*="position:relative;display:inline-block;width:44px;height:24px"] {
    flex-shrink: 0 !important;
  }
  
  /* 危险区域 */
  div[style*="padding:24px;background:#fafafa;border:1px solid #ff3b30;border-radius:12px"] {
    padding: 18px 16px !important;
  }
  
  button#delete-account-btn,
  button[style*="border:1px solid #ff3b30;border-radius:10px;background:#ffffff;color:#ff3b30"] {
    min-height: 38px !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
  }
}

/* 小屏个人信息页面优化 */
@media (max-width: 575.98px) {
  /* 导航菜单按钮更紧凑 */
  button.nav-item {
    font-size: 12px !important;
    padding: 10px 6px !important;
    min-height: 40px !important;
  }
  
  /* 信息网格 - 极小屏单列 */
  div[style*="display:grid;grid-template-columns:1fr 1fr;gap:16px"] {
    grid-template-columns: 1fr !important;
  }
  
  /* 统计卡片 - 单列 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:16px"] {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
  }
  
  div[style*="padding:20px;background:#fafafa;border:1px solid #e8e8e8;border-radius:12px"] {
    padding: 14px 10px !important;
  }
  
  div[style*="font-size:32px;font-weight:600;color:#1a1a1a;margin-bottom:4px"] {
    font-size: 22px !important;
  }
}

/* ==================== 案例库页面移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 案例页面容器 */
  .cases-page {
    width: 100% !important;
    overflow-x: hidden !important;
  }
  
  /* 返回按钮容器 */
  div[style*="background:#ffffff;padding:24px 0;border-bottom:1px solid #e8e8e8"] {
    padding: 16px 0 !important;
  }
  
  /* 返回按钮 */
  a[style*="display:inline-flex;align-items:center;gap:8px;font-size:14px;color:#6b6b6b;text-decoration:none;transition:color 0.2s ease;padding:8px 16px;border-radius:8px;border:1px solid #e8e8e8;background:#fafafa"] {
    min-height: 44px !important;
    padding: 10px 16px !important;
    font-size: 14px !important;
  }
  
  /* 页面标题区域 */
  div[style*="background:#ffffff;padding:56px 0 48px;border-bottom:1px solid #e8e8e8"] {
    padding: 40px 0 32px !important;
  }
  
  /* 页面标题 */
  h1[style*="font-size:40px;font-weight:600;color:#1a1a1a;letter-spacing:-0.03em;line-height:1.1;margin-bottom:16px"] {
    font-size: clamp(28px, 7vw, 36px) !important;
    margin-bottom: 12px !important;
  }
  
  /* 页面描述 */
  p[style*="font-size:16px;color:#6b6b6b;line-height:1.6;margin-bottom:28px"] {
    font-size: 14px !important;
    margin-bottom: 24px !important;
  }
  
  /* CTA按钮 */
  a[style*="display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 28px;font-size:15px;border-radius:8px;border:1px solid #1a1a1a;background:#1a1a1a;color:#ffffff;text-decoration:none;cursor:pointer;transition:all 0.2s ease;font-weight:500"] {
    width: 100% !important;
    padding: 14px 24px !important;
    font-size: 15px !important;
    min-height: 48px !important;
  }
  
  /* 统计概览容器 */
  div[style*="margin-bottom:56px"] {
    margin-bottom: 40px !important;
  }
  
  /* 统计网格 - 四列转两列 */
  div[style*="display:grid;grid-template-columns:repeat(4,1fr);gap:24px"] {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  
  /* 统计卡片 */
  div[style*="padding:24px;background:#fafafa;border:1px solid #e8e8e8;border-radius:12px;text-align:center"] {
    padding: 20px 12px !important;
    border-radius: 12px !important;
  }
  
  /* 统计数字 */
  div[style*="font-size:36px;font-weight:600;color:#1a1a1a;line-height:1;margin-bottom:8px"] {
    font-size: 28px !important;
    margin-bottom: 6px !important;
  }
  
  /* 统计标签 */
  div[style*="font-size:13px;color:#8a8a8a"] {
    font-size: 12px !important;
  }
  
  /* 筛选器区域 */
  div[style*="margin-bottom:48px"] {
    margin-bottom: 32px !important;
  }
  
  /* 筛选器网格 */
  div[style*="display:flex;flex-wrap:wrap;gap:32px"] {
    gap: 24px !important;
    flex-direction: column !important;
  }
  
  /* 筛选标签 */
  .filter-tab {
    min-height: 40px !important;
    padding: 8px 14px !important;
    font-size: 13px !important;
    touch-action: manipulation !important;
  }
  
  /* 案例列表网格 - 两列转单列 */
  div[style*="display:grid;grid-template-columns:repeat(2,1fr);gap:24px"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  
  /* 案例卡片 */
  .case-card {
    border-radius: 16px !important;
  }
  
  /* 案例卡片图片区域 - 提高高度占比 */
  div[style*="height:200px;position:relative;overflow:hidden"] {
    height: 260px !important;
    position: relative !important;
    overflow: hidden !important;
  }
  
  /* 案例卡片图片 - 占满空间 */
  div[style*="height:200px;position:relative;overflow:hidden"] img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    pointer-events: none !important;
  }
  
  /* 满意度标签 */
  div[style*="position:absolute;top:12px;right:12px;font-size:12px;font-weight:500;color:#1a1a1a;padding:6px 12px;background:rgba(255,255,255,0.95);border:1px solid #e8e8e8;border-radius:100px"] {
    top: 16px !important;
    right: 16px !important;
    padding: 8px 14px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
  }
  
  /* 案例卡片内容区 */
  div[style*="padding:20px"] {
    padding: 20px !important;
  }
  
  /* 案例标题 */
  h3[style*="font-size:18px;font-weight:600;color:#1a1a1a;margin:0 0 8px 0"] {
    font-size: 17px !important;
    margin-bottom: 10px !important;
  }
  
  /* 案例摘要 */
  p[style*="font-size:14px;color:#6b6b6b;line-height:1.5;margin:0 0 16px 0"] {
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin-bottom: 14px !important;
  }
  
  /* 加载更多按钮 */
  button[style*="display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 32px;font-size:14px;border-radius:8px;border:1px solid #e8e8e8;background:#ffffff;color:#6b6b6b;cursor:pointer;transition:all 0.2s ease;font-weight:500"] {
    width: 100% !important;
    padding: 14px 24px !important;
    font-size: 14px !important;
    min-height: 48px !important;
    touch-action: manipulation !important;
  }
  
  /* 主容器 */
  div[style*="padding-top:48px;padding-bottom:96px"] {
    padding-top: 32px !important;
    padding-bottom: 64px !important;
  }
}

/* ==================== 案例详情页移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 模态框容器 */
  .modal-dialog.modal-lg {
    max-width: 100% !important;
    margin: 0 !important;
  }
  
  /* 模态框内容 */
  .modal-content {
    border-radius: 0 !important;
    height: 100vh !important;
    max-height: 100vh !important;
  }
  
  /* 详情页头部 */
  div[style*="background:#ffffff;padding:24px 28px;border-bottom:1px solid #e8e8e8;display:flex;align-items:center;justify-content:space-between"] {
    padding: 16px 20px !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
  }
  
  /* 关闭按钮 */
  button[style*="display:inline-flex;align-items:center;gap:8px;font-size:14px;color:#6b6b6b;text-decoration:none;transition:color 0.2s ease;padding:8px 16px;border-radius:8px;border:1px solid #e8e8e8;background:#fafafa;cursor:pointer"] {
    min-height: 44px !important;
    padding: 10px 16px !important;
    font-size: 14px !important;
    touch-action: manipulation !important;
  }
  
  /* 详情页主体 */
  div[style*="background:#ffffff;padding:32px 28px"] {
    padding: 24px 20px !important;
    overflow-y: auto !important;
  }
  
  /* 详情布局 - 两列转单列 */
  div[style*="display:grid;grid-template-columns:1.1fr 1fr;gap:32px"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  
  /* 右侧内容区放在前面 */
  div[style*="display:grid;grid-template-columns:1.1fr 1fr;gap:32px"] > div:last-child {
    order: -1 !important;
  }
  
  /* 基本信息网格 */
  div[style*="display:grid;grid-template-columns:1fr 1fr;gap:16px"] {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }
  
  /* 改造对比区域 - 两列转单列 */
  div[style*="display:grid;grid-template-columns:1fr 1fr;gap:16px"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  
  /* 改造对比图片容器 - 增加高度 */
  div[style*="height:180px;border-radius:12px;overflow:hidden"] {
    height: 220px !important;
    border-radius: 16px !important;
  }
  
  /* 改造对比图片 */
  div[style*="height:180px;border-radius:12px;overflow:hidden"] img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    pointer-events: none !important;
  }
  
  /* 教师评价卡片 */
  div[style*="padding:20px;background:#fafafa;border:1px solid #e8e8e8;border-radius:12px"] {
    padding: 20px !important;
    border-radius: 16px !important;
  }
  
  /* CTA按钮 */
  a[style*="display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 28px;font-size:15px;border-radius:8px;border:1px solid #1a1a1a;background:#1a1a1a;color:#ffffff;text-decoration:none;cursor:pointer;transition:all 0.2s ease;font-weight:500"] {
    width: 100% !important;
    padding: 14px 24px !important;
    font-size: 15px !important;
    min-height: 48px !important;
    border-radius: 12px !important;
    touch-action: manipulation !important;
  }
}

@media (max-width: 575.98px) {
  /* 案例卡片图片区域 - 小屏进一步加大 */
  div[style*="height:200px;position:relative;overflow:hidden"] {
    height: 240px !important;
  }
  
  /* 基本信息网格 - 小屏单列 */
  div[style*="display:grid;grid-template-columns:1fr 1fr;gap:16px"] {
    grid-template-columns: 1fr !important;
  }
  
  /* 改造对比图片容器 - 小屏高度 */
  div[style*="height:180px;border-radius:12px;overflow:hidden"] {
    height: 200px !important;
  }
}

/* ==================== 情绪成长页面移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 返回按钮容器 */
  div[style*="background:#ffffff;padding:24px 0;border-bottom:1px solid #e8e8e8;position:sticky;top:0;z-index:100;"] {
    padding: 16px 0 !important;
  }
  
  /* 返回按钮 */
  a[style*="display:inline-flex;align-items:center;gap:8px;font-size:14px;color:#6b6b6b;text-decoration:none;transition:color 0.2s ease;padding:8px 16px;border-radius:8px;border:1px solid #e8e8e8;background:#fafafa;"] {
    min-height: 44px !important;
    padding: 10px 16px !important;
    font-size: 14px !important;
    touch-action: manipulation !important;
  }
  
  /* 页面内容区域 */
  div[style*="padding:48px 0;"] {
    padding: 32px 0 !important;
  }
  
  /* 英雄区域 */
  section[style*="padding:64px 0;text-align:center;"] {
    padding: 40px 0 !important;
  }
  
  /* 页面标题 */
  h1[style*="font-size:48px;font-weight:600;color:#1a1a1a;letter-spacing:-0.02em;margin:0 0 12px 0;"] {
    font-size: clamp(28px, 8vw, 36px) !important;
    margin-bottom: 10px !important;
  }
  
  /* 页面描述 */
  p[style*="font-size:18px;color:#8a8a8a;margin:0;max-width:520px;margin-left:auto;margin-right:auto;line-height:1.6;"] {
    font-size: 15px !important;
  }
  
  /* 进度统计区域 */
  section[style*="padding:24px 0 56px 0;"] {
    padding: 24px 0 40px 0 !important;
  }
  
  div[style*="padding:32px 36px;background:#fafafa;border:1px solid #e8e8e8;border-radius:16px;"] {
    padding: 24px 20px !important;
    border-radius: 16px !important;
  }
  
  /* 统计网格 - 三列保持但缩小间距 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:32px;text-align:center;"] {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
  }
  
  /* 统计数字 */
  div[style*="font-size:40px;font-weight:600;color:#1a1a1a;line-height:1;margin-bottom:8px;"] {
    font-size: 32px !important;
    margin-bottom: 6px !important;
  }
  
  /* 统计标签 */
  div[style*="font-size:14px;color:#8a8a8a;"] {
    font-size: 12px !important;
  }
  
  /* 成长步骤卡片 */
  article[class*="fade-in-up"] div[style*="background:"] {
    padding: 20px !important;
  }
  
  /* 步骤卡片布局 - 移动端调整 */
  div[style*="display:flex;gap:24px;align-items:flex-start;"] {
    flex-direction: column !important;
    gap: 16px !important;
  }
  
  /* 图标区域 */
  div[style*="flex-shrink:0;"] div[style*="width:72px;height:72px;border-radius:14px;"] {
    width: 64px !important;
    height: 64px !important;
    border-radius: 14px !important;
  }
  
  /* 图标SVG */
  svg[width="36"][height="36"] {
    width: 32px !important;
    height: 32px !important;
  }
  
  /* 完成标记 */
  div[style*="position:absolute;top:-6px;right:-6px;width:24px;height:24px;border-radius:100%;"] {
    width: 28px !important;
    height: 28px !important;
  }
  
  /* 步骤标题 */
  h3[style*="font-size:20px;font-weight:600;color:#1a1a1a;margin:0 0 10px 0;letter-spacing:-0.01em;"] {
    font-size: 18px !important;
    margin-bottom: 8px !important;
  }
  
  /* 步骤描述 */
  p[style*="font-size:15px;color:#6b6b6b;margin:0 0 16px 0;line-height:1.6;"] {
    font-size: 14px !important;
    margin-bottom: 12px !important;
  }
  
  /* 挑战和奖励标签容器 */
  div[style*="display:flex;flex-wrap:wrap;gap:12px;align-items:center;"] {
    gap: 8px !important;
  }
  
  /* 挑战和奖励标签 */
  div[style*="display:inline-flex;align-items:center;gap:8px;padding:8px 14px;background:"] {
    padding: 8px 12px !important;
    font-size: 12px !important;
  }
  
  /* 开始挑战按钮 */
  button.start-challenge-btn {
    width: 100% !important;
    padding: 14px 24px !important;
    font-size: 15px !important;
    min-height: 48px !important;
    border-radius: 12px !important;
    touch-action: manipulation !important;
  }
  
  /* 徽章展示区域 */
  section[style*="padding:72px 0;"] {
    padding: 56px 0 !important;
  }
  
  /* 徽章标题 */
  h2[style*="font-size:32px;font-weight:600;color:#1a1a1a;margin:0;letter-spacing:-0.02em;"] {
    font-size: 26px !important;
  }
  
  /* 徽章网格 - 四列转两列 */
  div[style*="display:grid;grid-template-columns:repeat(4,1fr);gap:20px;"] {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  
  /* 徽章卡片 */
  div[style*="padding:24px;background:#fafafa;border:1px solid #e8e8e8;border-radius:12px;text-align:center;"] {
    padding: 20px !important;
    border-radius: 16px !important;
  }
  
  /* 徽章图标容器 */
  div[style*="width:56px;height:56px;border-radius:12px;background:"] {
    width: 52px !important;
    height: 52px !important;
    border-radius: 12px !important;
    margin-bottom: 12px !important;
  }
  
  /* 徽章标题 */
  h4[style*="font-size:15px;font-weight:600;color:#1a1a1a;margin:0 0 6px 0;"] {
    font-size: 13px !important;
  }
  
  /* 徽章描述 */
  p[style*="font-size:13px;color:#8a8a8a;margin:0;"] {
    font-size: 12px !important;
  }
}

@media (max-width: 575.98px) {
  /* 统计网格 - 三列保持更小间距 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:32px;text-align:center;"] {
    gap: 12px !important;
  }
  
  /* 统计数字 - 小屏更小 */
  div[style*="font-size:40px;font-weight:600;color:#1a1a1a;line-height:1;margin-bottom:8px;"] {
    font-size: 28px !important;
  }
  
  /* 徽章网格 - 小屏保持两列 */
  div[style*="display:grid;grid-template-columns:repeat(4,1fr);gap:20px;"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  
  /* 徽章卡片 - 小屏更紧凑 */
  div[style*="padding:24px;background:#fafafa;border:1px solid #e8e8e8;border-radius:12px;text-align:center;"] {
    padding: 18px !important;
  }
}

/* ==================== 网站地图移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 标题响应式大小 */
  h1[style*="font-size:48px;font-weight:600;"] {
    font-size: clamp(28px, 8vw, 36px) !important;
  }
  
  h2[style*="font-size:32px;font-weight:600;"] {
    font-size: 24px !important;
  }
  
  /* 快捷导航 - 从3列改为2列 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:24px;"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
  
  /* 统计网格 - 4列改为2列 */
  div[style*="display:grid;grid-template-columns:repeat(4,1fr);gap:32px;"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
  
  /* 统计数字调整 */
  div[style*="text-align:center;padding:32px;background:#fafafa;"] {
    padding: 24px 16px !important;
  }
  
  div[style*="font-size:40px;font-weight:600;color:#1a1a1a;"] {
    font-size: 32px !important;
  }
  
  /* CTA区域调整 */
  div[style*="padding:64px;background:#fafafa;border:1px solid #e8e8e8;border-radius:20px;text-align:center;"] {
    padding: 48px 24px !important;
    border-radius: 16px !important;
  }
  
  /* 返回按钮区域 */
  div[style*="background:#ffffff;padding:24px 0;border-bottom:1px solid #e8e8e8;position:sticky;top:0;z-index:100;"] {
    padding: 16px 0 !important;
  }
}

@media (max-width: 575.98px) {
  /* 快捷导航 - 小屏单列 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:24px;"] {
    grid-template-columns: 1fr !important;
  }
  
  /* 统计网格 - 小屏单列 */
  div[style*="display:grid;grid-template-columns:repeat(2,1fr);gap:16px;"] {
    grid-template-columns: 1fr !important;
  }
  
  /* 英雄区域padding调整 */
  section[style*="padding:80px 0;text-align:center;"] {
    padding: 56px 0 !important;
  }
  
  /* 内容区域padding调整 */
  section[style*="padding:48px 0;border-top:1px solid #e8e8e8;"] {
    padding: 40px 0 !important;
  }
  
  section[style*="padding:80px 0;border-top:1px solid #e8e8e8;"] {
    padding: 56px 0 !important;
  }
}

/* ==================== 一键演出模式移动端优化 ==================== */
@media (max-width: 991.98px) {
  /* 英雄区域调整 */
  section[style*="padding:64px 0;text-align:center;"] {
    padding: 48px 0 !important;
  }
  
  /* 步骤指示器调整 */
  div[style*="display:flex;justify-content:center;gap:12px;margin-bottom:32px;flex-wrap:wrap;"] {
    gap: 8px !important;
  }
  
  /* 步骤指示器圆圈 */
  div[style*="width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid #e8e8e8;background:#ffffff;color:#8a8a8a;font-weight:600;transition:all 0.3s ease;"] {
    width: 40px !important;
    height: 40px !important;
    font-size: 14px !important;
  }
  
  /* 步骤指示器标签 */
  div[style*="font-size:12px;color:#8a8a8a;max-width:80px;text-align:center;"] {
    font-size: 11px !important;
    max-width: 70px !important;
  }
  
  /* 控制按钮区域调整 */
  div[style*="display:flex;justify-content:center;gap:16px;flex-wrap:wrap;"] {
    gap: 12px !important;
  }
  
  /* 按钮调整 */
  button[id="play-btn"], button[id="pause-btn"], button[id="reset-btn"] {
    padding: 12px 20px !important;
    font-size: 14px !important;
    min-height: 44px !important;
  }
  
  /* 速度控制调整 */
  div[style*="display:flex;justify-content:center;gap:12px;margin-top:24px;align-items:center;"] {
    gap: 10px !important;
    margin-top: 20px !important;
  }
  
  /* 网格布局调整 - 3列变2列 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:24px;"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
  
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:600px;margin:0 auto;"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
  
  /* 内容卡片padding调整 */
  div[style*="padding:32px;background:#fafafa;border:1px solid #e8e8e8;border-radius:16px;text-align:center;"] {
    padding: 24px 16px !important;
  }
  
  /* 痛点内容网格调整 */
  div[style*="display:grid;grid-template-columns:1fr 1fr;gap:48px;max-width:800px;margin:0 auto;align-items:center;"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  
  /* 热力图网格调整 */
  div[style*="display:grid;grid-template-columns:1fr 1fr;gap:32px;max-width:700px;margin:0 auto;align-items:center;"] {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  
  /* 英雄标题响应式大小 */
  h1[style*="font-size:48px;font-weight:600;color:#1a1a1a;letter-spacing:-0.02em;margin:0 0 16px 0;"] {
    font-size: clamp(28px, 8vw, 36px) !important;
  }
  
  /* 步骤标题响应式大小 */
  h2[style*="font-size:32px;font-weight:600;color:#1a1a1a;margin:0;letter-spacing:-0.02em;"] {
    font-size: 24px !important;
  }
  
  /* 按钮图标容器调整 */
  div[style*="width:56px;height:56px;background:#1a1a1a;border-radius:14px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;color:#ffffff;"] {
    width: 48px !important;
    height: 48px !important;
    border-radius: 12px !important;
  }
  
  /* 大图标容器调整 */
  div[style*="width:80px;height:80px;background:#1a1a1a;border-radius:20px;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;color:#ffffff;"] {
    width: 64px !important;
    height: 64px !important;
    border-radius: 16px !important;
  }
  
  /* 完成页大图标 */
  div[style*="width:96px;height:96px;background:#1a1a1a;border-radius:24px;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;color:#ffffff;"] {
    width: 72px !important;
    height: 72px !important;
    border-radius: 18px !important;
  }
  
  /* 完成页绿色图标 */
  div[style*="width:80px;height:80px;background:#00b894;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;color:#ffffff;"] {
    width: 64px !important;
    height: 64px !important;
  }
  
  /* section padding调整 */
  section[style*="padding:32px 0;border-top:1px solid #e8e8e8;"] {
    padding: 24px 0 !important;
  }
  
  section[style*="padding:64px 0;border-top:1px solid #e8e8e8;"] {
    padding: 48px 0 !important;
  }
  
  /* 内容区域padding */
  div[style*="padding:48px 0;"] {
    padding: 32px 0 !important;
  }
}

@media (max-width: 575.98px) {
  /* 步骤指示器单列 */
  div[style*="display:flex;justify-content:center;gap:12px;margin-bottom:32px;flex-wrap:wrap;"] {
    justify-content: flex-start !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    padding: 0 8px !important;
  }
  
  /* 网格布局全单列 */
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:24px;"] {
    grid-template-columns: 1fr !important;
  }
  
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:600px;margin:0 auto;"] {
    grid-template-columns: 1fr !important;
  }
  
  div[style*="display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:600px;margin:0 auto;"] {
    grid-template-columns: 1fr !important;
  }
  
  /* 统计数字调整 */
  div[style*="font-size:28px;font-weight:600;color:#1a1a1a;margin:0 0 4px 0;"] {
    font-size: 24px !important;
  }
  
  /* 按钮区域更紧凑 */
  div[style*="display:flex;justify-content:center;gap:16px;flex-wrap:wrap;"] {
    gap: 10px !important;
  }
  
  /* 速度标签调整 */
  span[style*="font-size:13px;color:#8a8a8a;"] {
    font-size: 12px !important;
  }
  
  /* 内容区域更小的padding */
  section[style*="padding:48px 0;border-top:1px solid #e8e8e8;"] {
    padding: 32px 0 !important;
  }
  
  section[style*="padding:64px 0;border-top:1px solid #e8e8e8;"] {
    padding: 40px 0 !important;
  }
}

/* ==================== iOS/iPhone 专属优化 ==================== */

/* Safari/iOS 特定优化 */
@supports (-webkit-touch-callout: none) {
  /* 安全区域适配 */
  body {
    padding-top: env(safe-area-inset-top, 0);
    padding-bottom: env(safe-area-inset-bottom, 0);
    padding-left: env(safe-area-inset-left, 0);
    padding-right: env(safe-area-inset-right, 0);
  }
  
  .navbar {
    padding-top: calc(14px + env(safe-area-inset-top, 0)) !important;
  }
  
  footer {
    padding-bottom: calc(env(safe-area-inset-bottom, 0) + 24px) !important;
  }
  
  /* 滚动性能优化 */
  * {
    -webkit-overflow-scrolling: touch;
  }
  
  /* 防止弹性滚动 */
  html, body {
    height: -webkit-fill-available;
    overscroll-behavior-y: none;
  }
  
  /* 触摸优化 */
  a, button, [role="button"] {
    min-height: 44px;
    min-width: 44px;
  }
  
  /* 输入框防缩放 */
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="tel"],
  textarea,
  select {
    font-size: 16px !important;
  }
  
  /* 图片渲染优化 */
  img {
    image-rendering: -webkit-optimize-contrast;
    -webkit-font-smoothing: antialiased;
  }
  
  /* 动画性能优化 */
  .fade-in-up,
  .fade-in,
  .slide-up {
    transform: translateZ(0);
    will-change: opacity, transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  
  /* 卡片性能优化 */
  .card,
  .case-card,
  .feature-card {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
  }
  
  /* 导航菜单优化 */
  .navbar-collapse {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

/* iPhone 小屏幕优化 */
@media (max-width: 375px) and (max-height: 667px) {
  /* 更紧凑的间距 */
  section {
    padding: 32px 16px !important;
  }
  
  .portfolio-hero-section {
    min-height: 70vh !important;
  }
  
  .hero-content h1 {
    font-size: 28px !important;
  }
  
  .feature-grid {
    gap: 12px !important;
  }
  
  .feature-card {
    padding: 20px !important;
  }
}

/* iPhone SE 等小屏设备 */
@media (max-width: 374.98px) {
  html {
    font-size: 11px;
  }
  
  .navbar-brand {
    font-size: 13px !important;
  }
  
  .hero-content h1 {
    font-size: 24px !important;
    line-height: 1.2 !important;
  }
  
  .btn {
    padding: 10px 18px !important;
    font-size: 13px !important;
  }
}

/* 横屏模式优化 */
@media (orientation: landscape) and (max-height: 500px) {
  .navbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
  }
  
  body {
    padding-top: 56px !important;
  }
  
  .portfolio-hero-section {
    min-height: auto !important;
    padding: 80px 16px !important;
  }
  
  footer {
    display: none !important;
  }
}

/* 视网膜屏幕优化 */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  
  /* 边框使用更细的线条 */
  .border-light {
    border-width: 0.5px;
  }
}

/* 减少动画（尊重用户偏好） */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  
  .loading-spinner {
    animation: none;
    border: 4px solid #1a1a1a;
    border-radius: 50%;
  }
}

/* 触摸设备优化 */
@media (hover: none) and (pointer: coarse) {
  /* 增大点击区域 */
  .nav-link,
  .btn,
  button,
  a[role="button"] {
    min-height: 48px;
    min-width: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  
  /* 移除hover效果，使用active效果 */
  .nav-link:hover,
  .btn:hover {
    background-color: inherit;
  }
  
  .nav-link:active,
  .btn:active {
    background-color: rgba(0, 0, 0, 0.05);
    transform: scale(0.98);
  }
  
  /* 轮播图触摸优化 */
  .carousel-item {
    touch-action: pan-x;
  }
}

/* ================================================================
   移动端暗黑模式背景完全覆盖保障
   ================================================================ */
@media (max-width: 991.98px) {
  /* 确保html、body、#app三层都有完整的黑色背景 */
  [data-theme="dark"] html {
    background: #000000 !important;
    background-color: #000000 !important;
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }

  [data-theme="dark"] body {
    background: #000000 !important;
    background-color: #000000 !important;
    min-height: 100vh;
    min-height: -webkit-fill-available;
    /* 防止弹性滚动露出白边 */
    overscroll-behavior: none;
    -webkit-overscroll-behavior: none;
  }

  [data-theme="dark"] #app,
  [data-theme="dark"] main,
  [data-theme="dark"] .app-container {
    background: #000000 !important;
    background-color: #000000 !important;
    min-height: 100vh;
    min-height: 100dvh;
  }

  /* 确保所有页面容器都有背景 */
  [data-theme="dark"] section,
  [data-theme="dark"] [class*="container"],
  [data-theme="dark"] [class*="page"],
  [data-theme="dark"] [class*="module"],
  [data-theme="dark"] [class*="section"] {
    background: #000000 !important;
  }

  /* 特殊处理：导航栏和底部 */
  [data-theme="dark"] nav,
  [data-theme="dark"] footer {
    background: #000000 !important;
  }

  /* 处理可能的白色间隙 */
  [data-theme="dark"] *::before,
  [data-theme="dark"] *::after {
    background-color: transparent !important;
  }

  /* iOS Safari 特殊优化：防止橡皮筋效果露出白底 */
  @supports (-webkit-touch-callout: none) {
    [data-theme="dark"] html,
    [data-theme="dark"] body {
      background: #000000 !important;
      -webkit-overscroll-behavior: none;
      overscroll-behavior: none;
    }

    /* 确保固定定位元素也有黑色背景 */
    [data-theme="dark"] [style*="position: fixed"],
    [data-theme="dark"] [style*="position:fixed"],
    [data-theme="dark"] .navbar.fixed-top,
    [data-theme="dark"] .navbar.fixed-bottom {
      background: rgba(0, 0, 0, 0.95) !important;
      -webkit-transform: translateZ(0);
      transform: translateZ(0);
    }
  }

  /* ==================== Hero区域移动端暗黑模式专项优化 ==================== */
  
  /* Hero主体 - 确保完全覆盖视口 */
  [data-theme="dark"] .portfolio-hero-section {
    background: #000000 !important;
    background-color: #000000 !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    height: auto !important;
    /* 确保背景图不会透出 */
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  /* 所有遮罩层 - 移动端增强 */
  [data-theme="dark"] .portfolio-hero-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }

  /* 底部白色渐变 → 黑色（关键修复！） */
  [data-theme="dark"] .portfolio-hero-overlay-bottom {
    background: linear-gradient(
      to top,
      #000000 0%,
      rgba(0, 0, 0, 0.95) 8%,
      rgba(0, 0, 0, 0.7) 15%,
      rgba(0, 0, 0, 0.4) 25%,
      rgba(0, 0, 0, 0) 40%
    ) !important;
  }

  /* 暗色遮罩层 - 增强不透明度 */
  [data-theme="dark"] .portfolio-hero-overlay-dark {
    background: linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.9) 0%,
      rgba(0, 0, 0, 0.75) 30%,
      rgba(0, 0, 0, 0.55) 60%,
      rgba(0, 0, 0, 0.8) 100%
    ) !important;
  }

  /* 渐变遮罩 - 降低亮度 */
  [data-theme="dark"] .portfolio-hero-overlay-gradient {
    opacity: 0.6 !important;
    mix-blend-mode: normal !important;
  }

  /* 内容区域 - 完全黑色 */
  [data-theme="dark"] .portfolio-hero-content {
    background: #000000 !important;
    background-color: #000000 !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    position: relative !important;
    z-index: 10 !important;
  }

  [data-theme="dark"] .portfolio-hero-container {
    background: transparent !important;
  }

  /* 装饰元素 - 降低可见度 */
  [data-theme="dark"] .hero-ambient-glow,
  [data-theme="dark"] .hero-glow-1,
  [data-theme="dark"] .hero-glow-2,
  [data-theme="dark"] .hero-glow-3,
  [data-theme="dark"] .hero-grid-decoration,
  [data-theme="dark"] .hero-particles,
  [data-theme="dark"] .portfolio-hero-decoration {
    opacity: 0.1 !important;
  }

  /* 装饰线 - 深灰色 */
  [data-theme="dark"] .portfolio-hero-line-left,
  [data-theme="dark"] .portfolio-hero-line-right {
    opacity: 0.2 !important;
  }

  /* 防止Hero区域内的任何元素露出白底 */
  [data-theme="dark"] .portfolio-hero-section * {
    border-color: rgba(255, 255, 255, 0.05) !important;
  }

  /* Hero区域的伪元素也要处理 */
  [data-theme="dark"] .portfolio-hero-section::before,
  [data-theme="dark"] .portfolio-hero-section::after {
    background: #000000 !important;
    content: none !important; /* 移除可能的伪元素装饰 */
  }
}

}