* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
        }

        body {
            /* 左右渐变背景：从左下角柔和的海盐色到右上角干净的晨雾色 */
            background: linear-gradient(135deg, #f7f9fd 0%, #eef2f8 100%);
            color: #1F2A3A;
            line-height: 1.5;
            min-height: 100vh;
        }
a{text-decoration:none;outline:none;color:#333;}

        /* 所有区块容器默认继承渐变背景，内部卡片用白色或半透明提升层次 */
        .container {
            max-width: 1240px;
            margin: 0 auto;
            padding: 0 24px;
        }

        /* --- 导航栏 (半透明白色磨砂感，保持轻盈) --- */
       .navbar {
            background-color: #ffffff;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
            padding: 15px 0;
            position: sticky;
            top: 0;
            z-index: 100;
        }

        .navbar .container {
            display: flex;
            justify-content: space-between;
            align-items: center; 
        }

      .logo {
            font-size: 24px;
            font-weight: 700;
            color: #0056d6;
            text-decoration: none;
        }

        .logo span {
            color: #ff6b35;
        }


        .nav-links {
            display: flex;
            gap: 32px;
            font-weight: 500;
            color: #2A3B50;
        }
           .nav-links a {
            margin-left: 30px;
            text-decoration: none;
            color: #4a5b6e;
            font-weight: 500;
            font-size: 16px;
        }

        .nav-links a:hover {
            color: #0056d6;
        }

        .search-icon {
            background: rgba(255,255,255,0.8);
            width: 40px;
            height: 40px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #3C4E64;
            cursor: default;
            box-shadow: 0 2px 6px rgba(0,0,0,0.02);
        }

        /* 大标题区域保持通透 */
        .hero {
            padding: 60px 0 30px 0;
            background: transparent;  /* 继承body渐变 */
            text-align: center;
            border-bottom: 1px solid rgba(210, 222, 240, 0.6);
        }

        .hero h1 {
            font-size: 48px;
            font-weight: 700;
            color: #0F1E36;
            letter-spacing: -0.02em;
            margin-bottom: 16px;
        }

        .hero h1 i {
            color: #3A6BFF;
            font-style: normal;
           
            padding-bottom: 2px;
        }

        .hero .subhead {
            font-size: 20px;
            color: #4F617B;
            max-width: 760px;
            margin: 0 auto;
        }

        /* 三个胶囊区域 — 半透明背景，保持渐变可见 */
        .best-vpn-strip {
            background: rgba(245, 249, 255, 0.6);  /* 极浅蓝透 */
            padding: 32px 0;
            border-bottom: 1px solid rgba(210, 222, 240, 0.7);
        }

        .best-vpn-strip .container {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 40px;
            justify-content: center;
        }

        .best-title {
            font-weight: 700;
            font-size: 22px;
            color: #0F1E36;
            letter-spacing: -0.01em;
            white-space: nowrap;
        }

        .best-buttons {
            display: flex;
            flex-wrap: wrap;
            gap: 16px;
        }

        .pill-btn {
            background: rgba(255,255,255,0.85);
            backdrop-filter: blur(2px);
            border: 1px solid rgba(200, 215, 235, 0.8);
            color: #1E3148;
            padding: 12px 30px;
            border-radius: 60px;
            font-weight: 600;
            font-size: 18px;
            text-decoration: none;
            box-shadow: 0 4px 10px rgba(0,0,0,0.02);
            transition: all 0.15s;
            display: inline-flex;
            align-items: center;
            gap: 6px;
			 margin-left:10px;
        }

        .pill-btn i {
            font-size: 14px;
            color: #ff6b35; padding-right:10px;
        }

        .pill-btn:hover {
            border-color: #3A6BFF;
            box-shadow: 0 8px 20px rgba(58,107,255,0.2);
            background: #ffffff;
        }

        /* WHO WE ARE 区块背景完全透明，让渐变延续 */
        .mission-block {
            padding: 70px 0 50px;
            background: transparent;
        }

        .mission-grid {
            display: flex;
            flex-wrap: wrap;
            gap: 60px;
            align-items: center;
        }

        .mission-text {
            flex: 1 1 400px;
        }

        .pre-title {
            color: #3A6BFF;
            font-weight: 600;
            letter-spacing: 1px;
            font-size: 14px;
            text-transform: uppercase;
            margin-bottom: 12px;
        }

        .mission-text h2 {
            font-size: 44px;
            font-weight: 700;
            line-height: 1.2;
            color: #0F1E36;
            margin-bottom: 24px;
        }

        .mission-text p {
            font-size: 18px;
            color: #3E5068;
            max-width: 580px;
            margin-bottom: 32px;
        }

        .btn-outline-dark {
            border: 1px solid #1F2A3A;
            background: rgba(255,255,255,0.3);
            backdrop-filter: blur(2px);
            padding: 14px 40px;
            border-radius: 60px;
            font-weight: 600;
            color: #0F1E36;
            text-decoration: none;
            display: inline-block;
            transition: 0.2s;
        }

        .btn-outline-dark:hover {
            background: #0F1E36;
            color: white;
            border-color: #0F1E36;
        }

        .mission-stats {
            flex: 1 1 300px;
            display: flex;
            flex-direction: column;
            gap: 32px;
			 margin-left:70px;
        }

        .stat-item {
            border-left: 4px solid #3A6BFF;
            padding-left: 24px;
            background: rgba(255,255,255,0.3);
            backdrop-filter: blur(2px);
            border-radius: 0 12px 12px 0;
            padding: 12px 24px;
        }

        .stat-item .stat-title {
            font-weight: 700;
            font-size: 24px;
            color: #0F1E36;
            margin-bottom: 6px;
        }

        .stat-item p {
            color: #54657E;
            font-size: 16px;
        }

        /* VPN Experts 区块半透背景，但内部卡片纯白 */
        .experts-block {
            background: rgba(235, 244, 255, 0.5);  /* 半透浅蓝，融入渐变 */
            padding: 70px 0;
            border-top: 1px solid rgba(210, 222, 240, 0.7);
            border-bottom: 1px solid rgba(210, 222, 240, 0.7);
        }

        .experts-header {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            align-items: flex-end;
            margin-bottom: 50px;
        }

        .experts-header h3 {
            font-size: 36px;
            font-weight: 700;
            color: #0F1E36;
            max-width: 600px;
            line-height: 1.3;
        }

        .experts-header h3 i {
            color: #3A6BFF;
            font-style: normal;
        }

        .learn-more-link {
            font-weight: 600;
            color: #0F1E36;
            text-decoration: none;
            border-bottom: 2px solid #ff6b35;
            padding-bottom: 4px;
            white-space: nowrap;
        }

        .learn-more-link i {
            margin-left: 6px;
            font-size: 14px;
        }

        .expert-cards {
            display: flex;
            flex-wrap: wrap;
            gap: 30px;
        }

        .expert-card {
            background: white;        /* 纯白卡片，在渐变背景上清晰 */
            border-radius: 24px;
            padding: 32px;
            flex: 1 1 260px;
            box-shadow: 0 12px 30px rgba(0, 20, 50, 0.1);
            border: 1px solid rgba(220, 235, 255, 0.8);
			 margin-left:20px;
        }

        .expert-icon {
            background: #E9F0FE;
            width: 64px;
            height: 64px;
            border-radius: 18px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 28px;
            color: #3A6BFF;
            font-size: 28px;
        }

        .expert-card h4 {
            font-size: 24px;
            font-weight: 700;
            margin-bottom: 12px;
            color: #0F1E36;
        }

        .expert-card p {
            color: #50607A;
            font-size: 16px;
        }

        /* Reviews Banner 半透背景 */
        .reviews-banner {
            background: rgba(255,255,255,0.4);
            backdrop-filter: blur(3px);
            padding: 60px 0;
            border-bottom: 1px solid rgba(210, 222, 240, 0.7);
        }

        .reviews-banner .container {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 40px;
        }

        .reviews-text {
            flex: 1 1 350px;
			 margin-left:50px;
        }

        .reviews-text .pre-title {
            color: #3A6BFF;
            font-weight: 600;
            font-size: 14px;
            text-transform: uppercase;
        }

        .reviews-text h3 {
            font-size: 40px;
            font-weight: 700;
            color: #0F1E36;
            margin: 12px 0 24px;
            line-height: 1.2;
        }

        .reviews-text p {
            font-size: 18px;
            color: #41546E;
            max-width: 600px;
            margin-bottom: 30px;
        }

        .btn-primary {
            background: #ff6b35;
            color: white;
            border: none;
            padding: 14px 40px;
            border-radius: 60px;
            font-weight: 600;
            font-size: 16px;
            text-decoration: none;
            display: inline-block;
          
        }

        .btn-primary i {
            margin-left: 6px;
        }

        .review-badge {
          
            display: flex;
            align-items: center;
            gap: 12px;
           
        }

        .review-badge i {
            color: #3A6BFF;
            font-size: 32px;
        }

        /* 工具卡片区 — 卡片使用半透背景，hover时提亮 */
        .tools-grid {
            background: transparent;
            padding: 70px 0;
        }

        .tools-grid .container {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 30px;
        }

        .tool-card {
            background: rgba(255, 255, 255, 0.7);
            backdrop-filter: blur(6px);
            border-radius: 28px;
            padding: 40px 30px;
            border: 1px solid rgba(220, 235, 255, 0.7);
            transition: all 0.2s;
        }

        .tool-card:hover {
            background: rgba(255,255,255,0.9);
            box-shadow: 0 25px 40px -15px rgba(20, 60, 140, 0.2);
            border-color: #3A6BFF;
        }

        .tool-icon {
            background: #3A6BFF;
            width: 60px;
            height: 60px;
            border-radius: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 28px;
            margin-bottom: 28px;
        }

        .tool-card h4 {
            font-size: 28px;
            font-weight: 700;
            margin-bottom: 18px;
            color: #0F1E36;
        }

        .tool-card p {
            color: #506886;
            font-size: 17px;
            margin-bottom: 30px;
        }

        .card-link {
            font-weight: 600;
            color: #0F1E36;
            text-decoration: none;
            border-bottom: 2px solid #ff6b35;
            padding-bottom: 3px;
        }

        /* 底部链接区半透 */
        .link-columns {
            background: rgba(235, 242, 255, 0.5);
            backdrop-filter: blur(4px);
            padding: 50px 0;
            border-top: 1px solid rgba(190, 210, 240, 0.7);
        }

        .link-columns .container {
            display: flex;
            flex-wrap: wrap;
            gap: 60px;
            justify-content: space-between;
        }

        .link-group {
            min-width: 160px;
        }

        .link-group h5 {
            font-weight: 700;
            color: #0F1E36;
            margin-bottom: 24px;
            font-size: 18px;
        }
		.link-group h2 {
            font-weight: 700;
            color: #0F1E36;
            margin-bottom: 24px;
            font-size: 30px;
        }

        .link-group a {
            display: block;
            color: #2b3f5c;
            text-decoration: none;
            margin-bottom: 16px;
            font-size: 15px;
            font-weight: 500;
            text-shadow: 0 1px 2px rgba(255,255,255,0.5);
        }

        .link-group a:hover {
            color: #3A6BFF;
        }

        .copyright {
            text-align: center;
            padding: 30px 0 20px;
            color: #7f8fa3;
            font-size: 14px;
            border-top: 1px solid rgba(180, 200, 230, 0.6);
            background: #0f1a2c;
            backdrop-filter: blur(2px);
        }

        @media (max-width: 800px) {
            .hero h1 { font-size: 38px; }
            .mission-text h2 { font-size: 34px; }
            .nav-links { display: none; }
            .best-vpn-strip .container { flex-direction: column; align-items: start; }
        }
		
		.link_p{ width:500px;}
		.new{ width:1200px; margin:50px auto;}
		.new_t{ font-size:30px; color:#232434; width:800px; font-weight:bolder; padding-bottom:30px;}
		.new_n{ line-height:30px;}
		
		
		
		        .card-list {
         
            width: 100%;
            background: rgba(255,255,255,0.75);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border-radius: 48px;
            padding: 48px 40px;
            box-shadow: 0 30px 60px -20px rgba(0,30,70,0.25);
            border: 1px solid rgba(255,255,255,0.6);
        }

        /* 列表项 - 卡片样式：背景色 + 边框 */
        .vpn-item {
            display: flex;
            flex-direction: column;
            padding: 28px 24px;
            margin: 16px 0;
            border-radius: 24px;
            background: #FFFFFF;  /* 纯白背景 */
            border: 2px solid #E9EDF2;  /* 浅灰色边框 */
            transition: all 0.25s ease;
            cursor: pointer;
            text-decoration: none;
            color: inherit;
            position: relative;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
        }

        /* 让卡片之间的间距更明显 */
        .vpn-item:not(:last-child) {
            margin-bottom: 50px;
        }

        /* 悬停效果 - 边框变色 + 阴影加强 */
        .vpn-item:hover {
            border-color: #3A6BFF;  /* 悬停时边框变蓝色 */
            background: #FFFFFF;
            box-shadow: 0 15px 30px -10px rgba(58, 107, 255, 0.2);
            transform: translateY(-2px);
        }

        /* 选中/点击效果 */
        .vpn-item:active {
            transform: translateY(0px);
            border-color: #FFB347;  /* 点击时边框变橙色 */
            background: #F8FBFF;  /* 轻微淡蓝底 */
        }

        /* 让超链接内部所有区域都可点击 */
        .vpn-item * {
            cursor: pointer;
        }

        /* 标题行 */
        .title-row {
            margin-bottom: 12px;
        }
        
        .vpn-name {
            font-size: 24px;
            font-weight: 700;
            letter-spacing: -0.01em;
            color: #0B1E3A;
            line-height: 1.6;
			 width:730px;
        } 
        .vpn-name i {                        
            color: #3A6BFF;
            font-style: normal;
            border-bottom: 2px solid #FFB347;
        }

        /* 描述区 */
        .vpn-description {
            font-size: 18px;
            color: #2C3E5A;
            line-height: 1.5;
            font-weight: 450;
            margin-bottom: 12px;
        }

      

        /* 分隔装饰 */
     
        .line {
            flex: 1;
            height: 1px;
            background: linear-gradient(90deg, rgba(58,107,255,0.3), rgba(255,255,255,0));
        }