/* Non-desktop responsive adjustments live here */

/* Tablets (<= 992px) */
@media (max-width: 992px){
  .hero-section .container { min-height: 56vh; }
  /* 保留图片，但缩小覆盖比例，右侧偏移 */
  .hero-with-bg { background-size: 100% auto, cover; background-position: right center, center; }
  /* 侧边留白通用容器 */
  .container, .container-fluid { padding-left: 20px; padding-right: 20px; }
}

/* 手机端样式 */
@media (max-width: 576px) {
    /* CSS变量定义 - 修复移动端变量缺失问题 */
    :root {
        --primary-color: #2F6FED;
        --primary-dark: #1E4FD6;
        --accent-color: #3BB6A8;
        --text-dark: #0F172A;
        --color-primary-600: #2F6FED;
        --color-primary-700: #041a56;
        --color-teal-500: #3BB6A8;
        --color-slate-900: #0F172A;
        --color-slate-600: #475569;
        --color-slate-200: #E2E8F0;
        --color-bg: #FFFFFF;
        --font-size-h1: 2rem;
        --font-size-h2: 1.5rem;
        --font-size-h3: 1.25rem;
        --font-size-body: 0.875rem;
        --font-size-small: 0.75rem;
        --spacing-xs: 0.25rem;
        --spacing-sm: 0.5rem;
        --spacing-md: 0.75rem;
        --spacing-lg: 1rem;
        --spacing-xl: 1.5rem;
        --spacing-2xl: 2rem;
        --spacing-3xl: 2.5rem;
    }
    
    html {
        scroll-padding-top: 100px; /* Adjusted for mobile navbar height */
    }
    

    
    /* 移动端导航菜单重新设计 - 现代质感效果 */
    .navbar {
        backdrop-filter: saturate(180%) blur(20px) !important;
        background: linear-gradient(135deg, 
            rgba(255, 255, 255, 0.95) 0%, 
            rgba(247, 250, 255, 0.9) 100%) !important;
        border-bottom: 1px solid rgba(47, 111, 237, 0.1) !important;
        box-shadow: 
            0 8px 32px rgba(47, 111, 237, 0.15),
            0 4px 16px rgba(0, 0, 0, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }
    
    .navbar-toggler {
        border: none !important;
        padding: 4px 8px !important;
        border-radius: 8px !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
        position: relative !important;
        overflow: hidden !important;
        font-size: 18px;
    }
    
    .navbar-toggler:hover {
        transform: translateY(-2px) scale(1.05) !important;
        box-shadow: 
            0 8px 24px rgba(47, 111, 237, 0.3),
            0 4px 12px rgba(0, 0, 0, 0.15) !important;
        background: linear-gradient(135deg, 
            rgba(47, 111, 237, 0.15) 0%, 
            rgba(59, 182, 168, 0.15) 100%) !important;
    }
    
    .navbar-toggler:focus {
        box-shadow: 
            0 0 0 3px rgba(47, 111, 237, 0.3),
            0 4px 16px rgba(47, 111, 237, 0.2) !important;
    }
    
    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%232F6FED' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.5' d='m4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
        transition: all 0.3s ease !important;
    }
    
    .navbar-collapse {
        background: linear-gradient(135deg, 
            rgba(255, 255, 255, 0.98) 0%, 
            rgba(247, 250, 255, 0.95) 100%) !important;
        backdrop-filter: saturate(180%) blur(25px) !important;
        border-radius: 16px !important;
        margin-top: 12px !important;
        padding: 20px !important;
        box-shadow: 
            0 12px 40px rgba(47, 111, 237, 0.2),
            0 6px 20px rgba(0, 0, 0, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
        border: 1px solid rgba(47, 111, 237, 0.15) !important;
        animation: menuSlideIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }
    
    @keyframes menuSlideIn {
        0% {
            opacity: 0;
            transform: translateY(-20px) scale(0.95);
        }
        100% {
            opacity: 1;
            transform: translateY(0) scale(1);
        }
    }
    
    .navbar-nav {
        gap: 8px !important;
    }
    
    .navbar-nav .nav-link {
        padding: 12px 16px !important;
        margin: 4px 0 !important;
        border-radius: 12px !important;
        font-weight: 500 !important;
        font-size: 1rem !important;
        color: var(--text-dark) !important;
        background: transparent !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
        position: relative !important;
        overflow: hidden !important;
        text-align: center !important;
    }
    
    .navbar-nav .nav-link::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: -100% !important;
        width: 100% !important;
        height: 100% !important;
        background: linear-gradient(90deg, 
            transparent, 
            rgba(47, 111, 237, 0.15), 
            rgba(59, 182, 168, 0.1),
            transparent) !important;
        transition: left 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    }
    

    
    .navbar-nav .nav-link:hover {
        background: linear-gradient(135deg, 
            rgba(47, 111, 237, 0.1) 0%, 
            rgba(59, 182, 168, 0.1) 100%) !important;
        color: var(--primary-color) !important;
        transform: translateY(-2px) !important;
        box-shadow: 
            0 6px 20px rgba(47, 111, 237, 0.2),
            0 3px 10px rgba(0, 0, 0, 0.1) !important;
        -webkit-background-clip: unset !important;
        background-clip: unset !important;
        -webkit-text-fill-color: var(--primary-color) !important;
    }
    

    
    .navbar-nav .nav-link:active {
        transform: translateY(0) scale(0.98) !important;
        transition: all 0.1s ease !important;
    }
    
    /* Login按钮统一样式 - 与Submit按钮完全同步 */
    .navbar-nav .btn-primary {
        background-image: linear-gradient(135deg, var(--color-primary-600), var(--color-teal-500)) !important;
        border: none !important;
        color: white !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
        margin-top: 16px !important;
        padding: 12px 16px !important;
        border-radius: 8px !important;
        font-weight: 500 !important;
        width: calc(100% - 32px) !important;
        margin-left: 16px !important;
        margin-right: 16px !important;
    }
    
    .navbar-nav .btn-primary:hover,
    .navbar-nav .btn-primary:focus {
        filter: brightness(0.96) !important;
    }

    .brand-logo { height: 70px; width: auto; }
    
    /* 隐藏英雄区图片 */
    .hero-art {
        display: none;
    }
    
    /* Hero Section - 移动端优化设计 */
    .hero-section {
        background: var(--gradient-hero) !important;
        position: relative !important;
        min-height: 60vh !important;
        overflow: hidden !important;
        display: flex !important;
        align-items: center !important;
    }
    
    .hero-section .container {
        min-height: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        position: relative !important;
        z-index: 2 !important;
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important;
        width: 100% !important;
    }

    .hero-content {
        padding: 1rem 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .hero-title {
        font-size: 1.5rem !important;
        line-height: 1.2 !important;
        margin-bottom: 1.25rem !important;
        white-space: normal !important;
        word-break: break-word !important;
        padding: 0 0.5rem !important;
        max-width: 100% !important;
    }

    .hero-subtitle {
        font-size: 0.95rem !important;
        line-height: 1.4 !important;
        max-width: 100% !important;
        margin-bottom: 1.5rem !important;
        padding: 0 0.5rem !important;
        opacity: 0.9 !important;
    }
    
    /* Hero装饰层 - 与桌面端同步的简洁效果 */
    .hero-section::after {
        content: '' !important;
        position: absolute !important;
        inset: 0 !important;
        backdrop-filter: saturate(140%) blur(0px) !important;
        background: radial-gradient(1200px 600px at 20% -10%, rgba(255,255,255,.12), transparent),
                    radial-gradient(1000px 500px at 80% 0%, rgba(255,255,255,.08), transparent) !important;
        pointer-events: none !important;
        z-index: 0 !important;
    }
    


    /* Hero徽章容器居中 - 移动端优化 */
    .hero-section .d-flex {
        justify-content: center !important;
        text-align: center !important;
        flex-wrap: wrap !important;
        gap: 0.5rem !important;
        margin-bottom: 1.5rem !important;
    }
    
    /* Hero徽章样式 - 移动端优化 */
    .hero-section .badge {
        font-size: 0.75rem !important;
        padding: 0.4rem 0.8rem !important;
        margin: 0.25rem !important;
        background: rgba(255, 255, 255, 0.95) !important;
        color: var(--primary-color) !important;
        border: 1px solid rgba(255, 255, 255, 0.4) !important;
        backdrop-filter: blur(15px) !important;
        border-radius: 20px !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
        box-shadow: 0 4px 12px rgba(47, 111, 237, 0.2) !important;
    }
    
    .hero-section .btn {
        font-size: 0.95rem !important;
        padding: 12px 24px !important;
        margin: 0.5rem !important;
        border-radius: 50px !important;
        font-weight: 600 !important;
        text-transform: none !important;
        letter-spacing: 0.5px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
        box-shadow: 
            0 8px 24px rgba(47, 111, 237, 0.4),
            0 4px 12px rgba(0, 0, 0, 0.2) !important;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }
    
    /* 修改Get Quote按钮文字为只显示Submit */
    .hero-section .btn:last-child {
        font-size: 0 !important;
    }
    
    .hero-section .btn:last-child::after {
        content: 'Submit' !important;
        font-size: 0.95rem !important;
        font-weight: 600 !important;
    }
    
    .hero-section .btn:hover {
        transform: translateY(-4px) scale(1.05) !important;
        box-shadow: 
            0 16px 40px rgba(47, 111, 237, 0.6),
            0 8px 20px rgba(0, 0, 0, 0.3) !important;
    }
    
    /* Get Quote section Submit Request按钮移动端样式 - 只显示Submit */
    #quote .btn[type="submit"] {
        font-size: 0 !important;
    }
    
    #quote .btn[type="submit"]::after {
        content: 'Submit' !important;
        font-size: 1rem !important;
        font-weight: 600 !important;
    }

    /* 调整内边距 */
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* 卡片样式优化 - 增强质感 */
    /* Step Badge修复 - 解决数字圆圈变形问题 */
    .step-badge {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        min-height: 48px !important;
        border-radius: 50% !important;
        background: linear-gradient(135deg, var(--primary-color), var(--accent-color)) !important;
        color: #fff !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-weight: 700 !important;
        font-size: 1.2rem !important;
        box-shadow: 
            0 8px 20px rgba(47, 111, 237, 0.4),
            0 4px 12px rgba(0, 0, 0, 0.2) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
        flex-shrink: 0 !important;
        margin-bottom: 1rem !important;
    }
    
    .step-badge:hover {
        transform: scale(1.1) rotate(5deg) !important;
        box-shadow: 
            0 12px 28px rgba(47, 111, 237, 0.6),
            0 6px 16px rgba(0, 0, 0, 0.3) !important;
    }
    
    .service-card, .reason-item {
        margin-bottom: 1.5rem !important;
        padding: 1.5rem !important;
        border-radius: 20px !important;
        background: linear-gradient(135deg, 
            rgba(255, 255, 255, 0.95) 0%, 
            rgba(247, 250, 255, 0.9) 100%) !important;
        box-shadow: 
            0 8px 32px rgba(47, 111, 237, 0.15),
            0 4px 16px rgba(0, 0, 0, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
        backdrop-filter: blur(20px) !important;
        border: 1px solid rgba(47, 111, 237, 0.2) !important;
        position: relative !important;
        overflow: hidden !important;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }
    
    .service-card::before, .reason-item::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: -100% !important;
        width: 100% !important;
        height: 100% !important;
        background: linear-gradient(90deg, 
            transparent, 
            rgba(47, 111, 237, 0.1), 
            transparent) !important;
        transition: left 0.6s ease !important;
    }
    
    .service-card:hover::before, .reason-item:hover::before {
        left: 100% !important;
    }
    
    .service-card:hover, .reason-item:hover {
        transform: translateY(-8px) scale(1.02) !important;
        box-shadow: 
            0 20px 60px rgba(47, 111, 237, 0.25),
            0 8px 32px rgba(0, 0, 0, 0.15),
            inset 0 1px 0 rgba(255, 255, 255, 0.9),
            0 0 0 1px rgba(47, 111, 237, 0.3) !important;
        border-color: rgba(47, 111, 237, 0.4) !important;
    }
    
    /* 服务卡片特殊样式 - 彩色渐变边框 */
    .service-card::after {
        content: '' !important;
        position: absolute !important;
        top: -2px !important;
        left: -2px !important;
        right: -2px !important;
        bottom: -2px !important;
        background: linear-gradient(45deg, 
            #2F6FED, #3BB6A8, #1E4FD6, #2F6FED) !important;
        background-size: 300% 300% !important;
        border-radius: 22px !important;
        z-index: -1 !important;
        animation: gradientRotate 4s ease infinite !important;
        opacity: 0 !important;
        transition: opacity 0.3s ease !important;
    }
    
    .service-card:hover::after {
        opacity: 1 !important;
    }
    
    @keyframes gradientRotate {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }

    .service-card h5,
    .reason-item h6 {
        line-height: 1.4;
        margin-bottom: 0.75rem;
    }

    .service-card p,
    .reason-item p {
        line-height: 1.6;
        margin-bottom: 0;
    }

    /* 重新设计移动端菜单 - 从右侧滑入，90%透明白色背景 */
    .navbar-collapse {
        position: fixed !important;
        top: 0 !important;
        right: -100% !important;
        width: 280px !important;
        max-width: 85vw !important;
        height: 100vh !important;
        background: rgba(255,255,255,.9) !important;
        border: 1px solid rgba(0, 0, 0, 0.1) !important;
        border-radius: 0 !important;
        margin: 0 !important;
        padding: 2rem 1.5rem !important;
        box-shadow: 
            -10px 0 30px rgba(0, 0, 0, 0.15),
            -5px 0 15px rgba(0, 0, 0, 0.1) !important;
        transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
        z-index: 1050 !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        will-change: transform !important;
    }
    
    .navbar-collapse.show {
        right: 0 !important;
        transform: translateZ(0) !important;
    }
    
    /* 菜单背景遮罩 - 纯色背景，无渐变 */
    .navbar-collapse.show::before {
  content: '' !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(255, 255, 255, 0.9) !important;
  z-index: -1 !important;
  animation: overlayFadeIn 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}
    
    @keyframes overlayFadeIn {
        from { 
            opacity: 0;
            backdrop-filter: blur(0px);
        }
        to { 
            opacity: 1;
            backdrop-filter: blur(2px);
        }
    }

    .navbar-nav {
        padding-top: 1.5rem !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 0.75rem !important;
    }
    
    /* 关闭按钮样式 */
    .btn-close-menu {
        position: absolute !important;
        top: 1.5rem !important;
        right: 1.5rem !important;
        width: 40px !important;
        height: 40px !important;
        border: none !important;
        background: rgba(0, 0, 0, 0.1) !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        color: #333333 !important;
        font-size: 1.2rem !important;
        transition: all 0.3s ease !important;
        cursor: pointer !important;
        z-index: 1051 !important;
    }
    
    .btn-close-menu:hover {
        background: rgba(0, 0, 0, 0.2) !important;
        transform: scale(1.1) !important;
        color: #333333 !important;
    }
    
    .btn-close-menu:active {
        transform: scale(0.95) !important;
    }

    /* 菜单标题 */
    .navbar-nav::before {
        content: 'Navigation' !important;
        font-size: 0.875rem !important;
        font-weight: 600 !important;
        color: rgba(0, 0, 0, 0.6) !important;
        text-transform: uppercase !important;
        letter-spacing: 1px !important;
        margin-bottom: 1rem !important;
        padding: 0 1.5rem !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
        padding-bottom: 0.75rem !important;
    }

    .navbar-nav .nav-link {
        padding: 0.75rem 1rem !important;
        margin: 0.25rem 0 !important;
        border-radius: 8px !important;
        background: rgba(0, 0, 0, 0.05) !important;
        border: 1px solid rgba(0, 0, 0, 0.1) !important;
        color: #333333 !important;
        font-weight: 500 !important;
        transition: all 0.3s ease !important;
        backdrop-filter: blur(10px) !important;
        -webkit-backdrop-filter: blur(10px) !important;
        position: relative !important;
        overflow: hidden !important;
        text-decoration: none !important;
        will-change: transform !important;
    }
    


    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link:focus,
    .navbar-nav .nav-link:active {
        background: rgba(47, 111, 237, 0.1) !important;
        border-color: rgba(47, 111, 237, 0.3) !important;
        color: #2F6FED !important;
        transform: translateX(-2px) !important;
        box-shadow: 
            0 4px 15px rgba(47, 111, 237, 0.15),
            0 2px 8px rgba(47, 111, 237, 0.1) !important;
    }
    
    .navbar-nav .nav-link:hover::before {
        left: 100% !important;
    }
    

    
    /* 触摸反馈效果 */
    .navbar-nav .nav-link:active {
        transform: translateX(-1px) !important;
        background: rgba(47, 111, 237, 0.15) !important;
        transition: all 0.1s ease !important;
    }
    
    /* 菜单关闭按钮样式 - 增强设计 */
    .navbar-toggler {
        border: none !important;
        padding: 0.375rem !important;
        border-radius: 8px !important;
        transition: all 0.3s ease !important;
        position: relative !important;
        overflow: hidden !important;
    }
    
    .navbar-toggler::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background: linear-gradient(135deg, rgba(47, 111, 237, 0.2) 0%, rgba(59, 182, 168, 0.2) 100%) !important;
        opacity: 0 !important;
        transition: opacity 0.3s ease !important;
        z-index: -1 !important;
    }
    
    .navbar-toggler:focus {
        box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.25) !important;
        outline: none !important;
    }
    
    .navbar-toggler:hover {
        transform: translateY(-1px) !important;
        box-shadow: 0 4px 12px rgba(47, 111, 237, 0.2) !important;
    }
    
    .navbar-toggler:hover::before {
        opacity: 1 !important;
    }
    
    .navbar-toggler:active {
        transform: translateY(0) !important;
        box-shadow: 0 2px 6px rgba(47, 111, 237, 0.15) !important;
    }
    
    /* 菜单按钮图标动画 */
    .navbar-toggler-icon {
        transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    }
    
    .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
        transform: rotate(90deg) !important;
    }

    /* 图标优化 - 修复显示问题并增强效果 */
    .service-card i, .reason-item i {
        font-size: 2.5rem !important;
        margin-bottom: 1rem !important;
        color: var(--primary-color) !important;
        background: linear-gradient(135deg, var(--primary-color), var(--accent-color)) !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
        background-clip: text !important;
        filter: drop-shadow(0 0 8px rgba(47, 111, 237, 0.3)) !important;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
        animation: iconPulse 3s ease-in-out infinite !important;
        display: inline-block !important;
        width: auto !important;
        height: auto !important;
        line-height: 1 !important;
    }
    
    /* 确保Bootstrap Icons正确加载 */
    .service-card .bi, .reason-item .bi {
        font-family: 'bootstrap-icons' !important;
        font-style: normal !important;
        font-variant: normal !important;
        text-transform: none !important;
        line-height: 1 !important;
        vertical-align: -.125em !important;
    }
    
    .service-card:hover i, .reason-item:hover i {
        transform: scale(1.1) rotate(5deg) !important;
        filter: drop-shadow(0 0 16px rgba(47, 111, 237, 0.6)) !important;
        animation: iconGlow 1.5s ease-in-out infinite !important;
    }
    
    @keyframes iconPulse {
        0%, 100% { transform: scale(1); }
        50% { transform: scale(1.05); }
    }
    
    @keyframes iconGlow {
        0%, 100% { filter: drop-shadow(0 0 16px rgba(47, 111, 237, 0.6)); }
        50% { filter: drop-shadow(0 0 24px rgba(59, 182, 168, 0.8)); }
    }

    /* 按钮优化 - 波纹点击效果 */
    .btn-primary {
        padding: 14px 28px !important;
        font-size: 1rem !important;
        border-radius: 12px !important;
        font-weight: 600 !important;
        letter-spacing: 0.5px !important;
        box-shadow: 
            0 4px 16px rgba(47, 111, 237, 0.3),
            0 2px 8px rgba(0, 0, 0, 0.1) !important;
        border: none !important;
        background: linear-gradient(135deg, var(--primary-color), var(--primary-dark)) !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
        position: relative !important;
        overflow: hidden !important;
    }
    
    .btn-primary::before {
        content: '' !important;
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        width: 0 !important;
        height: 0 !important;
        background: rgba(255, 255, 255, 0.3) !important;
        border-radius: 50% !important;
        transform: translate(-50%, -50%) !important;
        transition: width 0.6s ease, height 0.6s ease !important;
    }
    
    .btn-primary:active::before {
        width: 300px !important;
        height: 300px !important;
    }
    
    .btn-primary:hover {
        transform: translateY(-3px) scale(1.02) !important;
        box-shadow: 
            0 12px 32px rgba(47, 111, 237, 0.5),
            0 4px 16px rgba(0, 0, 0, 0.15),
            0 0 0 2px rgba(47, 111, 237, 0.2) !important;
        background: linear-gradient(135deg, var(--primary-dark), var(--accent-color)) !important;
    }
    
    .btn-primary:active {
        transform: translateY(-1px) scale(0.98) !important;
        transition: all 0.1s ease !important;
    }
    
    .btn {
        min-height: 44px;
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
        border-radius: 12px;
        font-weight: 600;
        transition: all 0.3s ease;
    }
    
    /* Submit按钮加宽 */
    #quote .btn[type="submit"] {
        min-width: 160px !important;
        padding: 12px 24px !important;
    }
    
    /* 下拉菜单跳动修复 */
    .form-select {
        position: relative !important;
        z-index: 1 !important;
    }
    
    .form-select:focus {
        z-index: 2 !important;
    }
    
    .col-md-6 {
        position: relative !important;
        overflow: visible !important;
    }

    .btn:active {
        transform: scale(0.98);
    }

    /* 表单控件优化 - 浮动标签动画 */
    .form-control, .form-select {
        padding: 18px 16px 8px 16px;
        font-size: 1rem;
        border-radius: 12px;
        border: 2px solid rgba(47, 111, 237, 0.2);
        background: linear-gradient(135deg, 
            rgba(255, 255, 255, 0.95) 0%, 
            rgba(247, 250, 255, 0.9) 100%);
        backdrop-filter: blur(15px);
        box-shadow: 
            0 4px 16px rgba(47, 111, 237, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.8);
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        position: relative;
        min-height: 44px;
    }
    
    .form-control:focus, .form-select:focus {
        border-color: var(--primary-color);
        box-shadow: 
            0 0 0 4px rgba(47, 111, 237, 0.15),
            0 8px 24px rgba(47, 111, 237, 0.2),
            inset 0 1px 0 rgba(255, 255, 255, 0.9);
        background: linear-gradient(135deg, 
            rgba(255, 255, 255, 0.98) 0%, 
            rgba(247, 250, 255, 0.95) 100%);
        outline: none;
        transform: translateY(-2px);
    }
    
    .form-control::placeholder {
        color: rgba(47, 111, 237, 0.5);
        transition: all 0.3s ease;
    }
    
    .form-control:focus::placeholder {
        transform: translateY(-20px);
        font-size: 0.8rem;
        color: var(--primary-color);
    }

    /* 表单控件浮动标签动画 */
    .form-floating {
        position: relative !important;
        background: rgba(255, 255, 255, 0.1) !important;
        backdrop-filter: blur(10px) !important;
        border-radius: 12px !important;
        border: 1px solid rgba(255, 255, 255, 0.2) !important;
        box-shadow: 
            0 8px 32px rgba(0, 0, 0, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
        transition: all 0.3s ease !important;
    }
    
    .form-floating:focus-within {
        transform: translateY(-2px) !important;
        box-shadow: 
            0 12px 40px rgba(47, 111, 237, 0.2),
            0 4px 16px rgba(0, 0, 0, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.3),
            0 0 0 2px rgba(47, 111, 237, 0.3) !important;
        border-color: var(--primary-color) !important;
    }
    
    .form-floating .form-control {
        background: transparent !important;
        border: none !important;
        color: var(--text-dark) !important;
        font-size: 1rem !important;
        padding: 16px 12px 8px 12px !important;
    }
    
    .form-floating .form-control:focus {
        box-shadow: none !important;
        background: transparent !important;
    }
    
    .form-floating label {
        color: rgba(108, 117, 125, 0.8) !important;
        font-weight: 500 !important;
        transition: all 0.3s ease !important;
        transform-origin: left top !important;
    }
    
    .form-floating .form-control:focus ~ label,
    .form-floating .form-control:not(:placeholder-shown) ~ label {
        color: var(--primary-color) !important;
        transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem) !important;
        font-weight: 600 !important;
    }

    .form-label {
        font-weight: 600;
        margin-bottom: 0.5rem;
        color: var(--text-dark);
    }

    /* FAQ手风琴增强视觉效果 */
    .accordion-item {
        background: rgba(255, 255, 255, 0.1) !important;
        backdrop-filter: blur(10px) !important;
        border: 1px solid rgba(255, 255, 255, 0.2) !important;
        border-radius: 12px !important;
        margin-bottom: 12px !important;
        box-shadow: 
            0 8px 32px rgba(0, 0, 0, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
        transition: all 0.3s ease !important;
        overflow: hidden !important;
    }
    
    .accordion-item:hover {
        transform: translateY(-2px) !important;
        box-shadow: 
            0 12px 40px rgba(47, 111, 237, 0.15),
            0 4px 16px rgba(0, 0, 0, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
        border-color: rgba(47, 111, 237, 0.3) !important;
    }
    
    .accordion-button {
        background: transparent !important;
        border: none !important;
        color: var(--text-dark) !important;
        font-weight: 600 !important;
        padding: 20px !important;
        font-size: 1.1rem !important;
        transition: all 0.3s ease !important;
        min-height: 44px;
        line-height: 1.5;
    }
    
    .accordion-button:not(.collapsed) {
        background: linear-gradient(135deg, 
            rgba(47, 111, 237, 0.1), 
            rgba(59, 182, 168, 0.1)) !important;
        color: var(--primary-color) !important;
        box-shadow: none !important;
    }
    
    .accordion-button:focus {
        box-shadow: 0 0 0 2px rgba(47, 111, 237, 0.3) !important;
        border-color: transparent !important;
    }
    
    .accordion-body {
        background: rgba(255, 255, 255, 0.05) !important;
        backdrop-filter: blur(5px) !important;
        padding: 20px !important;
        border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
        line-height: 1.6;
    }

    /* 联系信息块 - 扁平设计 */
    .contact-info {
        padding: 1.5rem;
        position: relative;
    }
    

    

    
    .contact-block {
        padding: 1.5rem;
        margin-bottom: 1.5rem;
        border-radius: 0.75rem;
    }

    .contact-block h6 {
        margin-bottom: 0.75rem;
        line-height: 1.4;
    }

    .contact-block p {
        line-height: 1.6;
        margin-bottom: 0.5rem;
    }

    /* 移动端页脚重新设计 - 只显示logo、公司名、slogan和contact us */
    .site-footer {
        background: linear-gradient(
            135deg,
            var(--color-primary-700) 0%,
            var(--color-teal-500) 100%
        ) !important;
        color: #fff !important;
        position: relative !important;
        overflow: hidden !important;
    }
    
    .site-footer::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background-image: 
            radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
            radial-gradient(circle at 80% 80%, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
            radial-gradient(circle at 40% 60%, rgba(255, 255, 255, 0.02) 1px, transparent 1px) !important;
        background-size: 50px 50px, 80px 80px, 60px 60px !important;
        pointer-events: none !important;
        z-index: 0 !important;
    }
    
    .site-footer .footer-top {
        padding: 2rem 0 1.5rem 0 !important;
        position: relative !important;
        z-index: 1 !important;
    }
    
    /* 隐藏Quick Links和Our Services */
    .site-footer .col-md-3:nth-child(2),
    .site-footer .col-md-3:nth-child(3) {
        display: none !important;
    }
    
    /* 品牌部分样式 */
    .site-footer .col-md-3:first-child {
        width: 100% !important;
        text-align: center !important;
        margin-bottom: 2rem !important;
    }
    
    .site-footer .footer-logo {
        height: 50px !important;
        width: auto !important;
        margin: 0 auto 1rem auto !important;
        display: block !important;
        filter: brightness(0) invert(1) !important;
    }
    
    .site-footer .col-md-3:first-child h5 {
        color: white !important;
        font-size: 1.5rem !important;
        font-weight: 700 !important;
        margin-bottom: 0.5rem !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
    }
    
    .site-footer .col-md-3:first-child p {
        color: rgba(255, 255, 255, 0.8) !important;
        font-size: 1rem !important;
        font-style: italic !important;
        margin-bottom: 0 !important;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
    }
    
    /* Contact Us部分样式 */
    .site-footer .col-md-3:last-child {
        width: 100% !important;
        text-align: center !important;
        margin-bottom: 0 !important;
    }
    
    .site-footer .col-md-3:last-child h6 {
        color: white !important;
        font-size: 1.2rem !important;
        font-weight: 600 !important;
        margin-bottom: 1rem !important;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
    }
    
    .site-footer .col-md-3:last-child p {
        color: rgba(255, 255, 255, 0.9) !important;
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
        margin-bottom: 0.5rem !important;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
    }
    
    .site-footer .col-md-3:last-child a {
        color: rgba(255, 255, 255, 0.9) !important;
        text-decoration: none !important;
        transition: all 0.3s ease !important;
    }
    
    .site-footer .col-md-3:last-child a:hover {
        color: #3BB6A8 !important;
        text-shadow: 0 0 8px rgba(59, 182, 168, 0.5) !important;
    }
    
    /* 页脚底部样式 */
    .site-footer .footer-bottom {
        background: rgba(0, 0, 0, 0.3) !important;
        padding: 1rem 0 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
        position: relative !important;
        z-index: 1 !important;
    }
    
    .site-footer .footer-bottom p {
        color: rgba(255, 255, 255, 0.7) !important;
        font-size: 0.85rem !important;
        margin: 0 !important;
        text-align: center !important;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
    }

    /* WhatsApp按钮优化 */
    .whatsapp-float {
        bottom: calc(1rem + env(safe-area-inset-bottom));
        width: 56px;
        height: 56px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s ease;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    }

    .whatsapp-float:hover {
        transform: scale(1.1);
        box-shadow: 0 6px 25px rgba(0, 0, 0, 0.2);
    }

    .whatsapp-float:active {
        transform: scale(1.05);
    }

    /* CSS动画定义 */
    @keyframes heroGradientShift {
        0%, 100% {
            background-position: 0% 50%, 0% 0%, 100% 100%;
        }
        50% {
            background-position: 100% 50%, 100% 100%, 0% 0%;
        }
    }
    
    @keyframes shimmer {
        0% {
            transform: translateX(-100%) rotate(45deg);
        }
        100% {
            transform: translateX(200%) rotate(45deg);
        }
    }
    
    @keyframes iconPulse {
        0%, 100% {
            transform: scale(1);
            filter: drop-shadow(0 0 8px rgba(47, 111, 237, 0.6));
        }
        50% {
            transform: scale(1.05);
            filter: drop-shadow(0 0 16px rgba(59, 182, 168, 0.8));
        }
    }
    
    @keyframes iconGlow {
        0%, 100% {
            filter: drop-shadow(0 0 8px rgba(47, 111, 237, 0.6));
        }
        50% {
            filter: drop-shadow(0 0 16px rgba(59, 182, 168, 0.8));
        }
    }
    
    /* 通用触摸优化 */
    * {
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    
    input, textarea, [contenteditable] {
        -webkit-user-select: text;
        -khtml-user-select: text;
        -moz-user-select: text;
        -ms-user-select: text;
        user-select: text;
    }
    
    /* 优化间距 */
    .container {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .row {
        margin-left: -10px;
        margin-right: -10px;
    }
    
    .col, [class*="col-"] {
        padding-left: 10px;
        padding-right: 10px;
    }


/* Submit按钮移动端文字优化 - 只显示Submit */
    #quote .btn[type="submit"] {
        font-size: 0 !important;
        position: relative !important;
    }
    
    #quote .btn[type="submit"]::after {
        content: 'Submit' !important;
        font-size: 1rem !important;
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        white-space: nowrap !important;
        font-weight: 600 !important;
    }
    
    /* 修复下拉菜单选项跑位问题 */
    .form-select {
        padding: 12px 16px !important;
        line-height: 1.5 !important;
        min-height: 44px !important;
        background-position: right 12px center !important;
    }
    
    .form-select option {
        padding: 8px 12px !important;
        line-height: 1.4 !important;
    }


    /* Make span with text-secondary small classes smaller on mobile */
    .text-secondary.small {
        font-size: 0.65rem !important;
    }
    
    /* Mobile layout for submit button container */
    .submit-container {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.75rem !important;
    }
    
    .submit-note {
        margin-top: 0.25rem;
    }

/* Extra small phones (<= 375px) */
@media (max-width: 375px){
  .hero-title { font-size: 18px; }
  .lead { font-size: 14px; }
  .badges-center .badge { font-size: 11px; }
}
}

