/* 全局样式重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* 全局图片悬停效果 */
img:not(.nav-logo-img):not(.search-icon):not(.arrow-icon) {
    transition: transform 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
    cursor: pointer;
}

img:not(.nav-logo-img):not(.search-icon):not(.arrow-icon):hover {
    transform: scale(1.05);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* 主容器 - Preview page 框架 */
/* 根据Figma: width: 1700px, height: 3640.83px */
.preview-page {
    width: 1700px;
    height: 3640.83px;
    background-color: #FFFFFF;
    position: relative;
    margin: 0 auto;
    font-family: 'Hahmlet', sans-serif;
    overflow: visible; /* 确保所有元素都能显示，包括超出容器的箭头 */
}

/* 顶部黑色背景区域 - Rectangle 196 */
/* 位置: x: 0, y: 0, 尺寸: 1700.99px x 1006.42px, 背景: #000000 */
.top-black-section {
    position: absolute;
    left: 0;
    top: 0;
    width: 1700.99px;
    height: 1006.42px;
    background-color: #000000;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 410.19px;
}

/* Logo - Rectangle 47 */
/* 位置: x: 410.19px, y: 248.06px, 尺寸: 243.63px x 243.63px */
.logo {
    position: absolute;
    left: 410.19px;
    top: 248.06px;
    width: 243.63px;
    height: 243.63px;
    object-fit: cover;
}

/* 主标题 - INDIE MUSIC REVIEW */
/* 位置: x: 705.2px, y: 248.06px, 尺寸: 528.9px x 267.55px */
/* 字体: Instrument Serif, 400, 113.4px, 颜色: #B28200 */
.main-title {
    position: absolute;
    left: 705.2px;
    top: 248.06px;
    width: 528.9px;
    height: 267.55px;
    font-family: 'Instrument Serif', serif;
    font-weight: 400;
    font-size: 113.39958190917969px;
    line-height: 1.200727015355054em;
    color: #B28200;
    display: flex;
    align-items: center;
}

/* 内容区域 */
.content-section {
    position: relative;
    width: 100%;
}

/* 第一段文本区域 */
.text-block-1 {
    position: absolute;
    left: 410.19px;
    top: 628.13px;
    width: 881.5px;
    height: 184.27px;
}

/* 标题和段落文本区域容器 */
.title-text-section {
    position: absolute;
    left: 262px;
    top: 1222px;
    width: 1122px;
}

/* 副标题 - Discover voices you've never heard before */
/* 位置: x: 262px, y: 1222px (相对于preview-page) */
/* 字体: Hahmlet, 700, 42.52px, 颜色: #000000 */
.subtitle {
    position: relative;
    width: 1258.03px; /* Figma原始宽度 */
    max-width: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Hahmlet', sans-serif;
    font-weight: 700;
    font-size: 42.52484130859375px;
    line-height: 1.2007270243581776em;
    color: #000000;
    display: block;
}

/* 描述文本1 */
/* 位置: x: 410.19px, y: 628.13px, 尺寸: 881.5px x 184.27px */
/* 字体: Hahmlet, 400, 21.26px, 行高: 1.448em, 颜色: #D9D9D9 */
.description {
    width: 881.5px;
    height: 184.27px;
    font-family: 'Hahmlet', sans-serif;
    font-weight: 400;
    font-size: 21.262420654296875px;
    line-height: 1.4479999878000995em;
    color: #D9D9D9;
}

/* Enter 按钮框架 - Frame 12 */
/* 位置: x: 1029px, y: 684px, 尺寸: 671.54px x 206.42px */
.enter-button-frame {
    position: absolute;
    left: 1029px;
    top: 684px;
    width: 671.54px;
    height: 206.42px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 70.75px; /* 358.8 - 380.95 + 107.2 - 170.99 */
    text-decoration: none; /* 移除链接下划线 */
    cursor: pointer; /* 鼠标悬停时显示手型光标 */
    transition: opacity 0.3s ease; /* 添加过渡效果 */
    z-index: 1000; /* Ensure it stays above other content */
}

/* 鼠标悬停效果 */
.enter-button-frame:hover {
    opacity: 0.8; /* 悬停时稍微变透明 */
}

.enter-button-frame:active {
    opacity: 0.6; /* 点击时更透明 */
}

/* Enter 文字 */
/* 位置: 相对于Frame 12: x: 380.95px, y: 52.27px, 尺寸: 170.99px x 124.03px */
/* 字体: Hahmlet, 400, 56.7px, 颜色: #FFFFFF, 描边: #1E1E1E 1px */
.enter-text {
    width: 170.99px;
    height: 124.03px;
    font-family: 'Hahmlet', sans-serif;
    font-weight: 400;
    font-size: 56.699790954589844px;
    line-height: 1.200727015355054em;
    color: #FFFFFF;
    text-shadow: 0px 3.5437369346618652px 3.5437369346618652px rgba(0, 0, 0, 0.25), 
                 0px 7.973408222198486px 1.7718684673309326px rgba(0, 0, 0, 0.25);
    -webkit-text-stroke: 1px #1E1E1E;
    display: flex;
    align-items: center;
}

/* 箭头图标 - 长箭头 13 */
/* 位置: 相对于Frame 12: x: 358.8px, y: 56.7px, 尺寸: 107.2px x 107.2px */
.arrow-icon {
    width: 107.2px;
    height: 107.2px;
    filter: drop-shadow(0px 3.5437369346618652px 3.5437369346618652px rgba(0, 0, 0, 0.25)) 
            drop-shadow(0px 7.973408222198486px 1.7718684673309326px rgba(0, 0, 0, 0.25));
}

/* 描述文本2 */
/* 位置: x: 262px, y: 1290.32px (相对于preview-page)，在subtitle下方 */
/* 字体: Hahmlet, 400, 21.26px, 行高: 1.448em, 颜色: #000000 */
.description-2 {
    position: absolute;
    left: 0;
    top: 68.32px; /* 1290.32 - 1222 = 68.32px，段落文本顶部距离容器顶部 */
    width: 1122px;
    margin: 0;
    padding: 0;
    font-family: 'Hahmlet', sans-serif;
    font-weight: 400;
    font-size: 21.262420654296875px;
    line-height: 1.4479999878000995em;
    color: #000000;
}

/* 图片网格区域 - 作为容器，图片绝对定位相对于preview-page */
.image-grid {
    position: relative;
    width: 100%;
    height: 0; /* 不占用空间，图片通过绝对定位 */
}

/* 网格项基础样式 - 相对于preview-page绝对定位 */
.grid-item {
    position: absolute;
    object-fit: cover;
}

/* Rectangle 155 - 位置: x: -8.86px, y: 994.02px, 尺寸: 132.89px x 95.68px */
.grid-item-1 {
    width: 132.89px;
    height: 95.68px;
    left: -8.86px;
    top: 994.02px;
}

/* Rectangle 157 - 位置: x: 256.04px, y: 994.02px, 尺寸: 132.89px x 85.94px */
.grid-item-2 {
    width: 132.89px;
    height: 85.94px;
    left: 256.04px;
    top: 994.02px;
}

/* Rectangle 156 - 位置: x: 124.03px, y: 994.02px, 尺寸: 132px x 121.37px */
.grid-item-3 {
    width: 132px;
    height: 121.37px;
    left: 124.03px;
    top: 994.02px;
}

/* Rectangle 158 - 位置: x: 388.93px, y: 994.02px, 尺寸: 132px x 110.74px */
.grid-item-4 {
    width: 132px;
    height: 110.74px;
    left: 388.93px;
    top: 994.02px;
}

/* Rectangle 159 - 位置: x: 520.93px, y: 994.02px, 尺寸: 132px x 85.94px */
.grid-item-5 {
    width: 132px;
    height: 85.94px;
    left: 520.93px;
    top: 994.02px;
}

/* Rectangle 160 - 位置: x: 652.93px, y: 994.02px, 尺寸: 132px x 95.68px */
.grid-item-6 {
    width: 132px;
    height: 95.68px;
    left: 652.93px;
    top: 994.02px;
}

/* Rectangle 161 - 位置: x: 784.94px, y: 994.02px, 尺寸: 132.89px x 147.07px */
.grid-item-7 {
    width: 132.89px;
    height: 147.07px;
    left: 784.94px;
    top: 994.02px;
}

/* Rectangle 162 - 位置: x: 917.83px, y: 994.02px, 尺寸: 132px x 110.74px */
.grid-item-8 {
    width: 132px;
    height: 110.74px;
    left: 917.83px;
    top: 994.02px;
}

/* Rectangle 163 - 位置: x: 1049.83px, y: 994.02px, 尺寸: 132px x 133.78px */
.grid-item-9 {
    width: 132px;
    height: 133.78px;
    left: 1049.83px;
    top: 994.02px;
}

/* Rectangle 164 - 位置: x: 1181.84px, y: 994.02px, 尺寸: 132px x 72.65px */
.grid-item-10 {
    width: 132px;
    height: 72.65px;
    left: 1181.84px;
    top: 994.02px;
}

/* Rectangle 166 - 位置: x: 1313.84px, y: 983.39px, 尺寸: 132.89px x 157.7px */
.grid-item-11 {
    width: 132.89px;
    height: 157.7px;
    left: 1313.84px;
    top: 983.39px;
}

/* Rectangle 165 - 位置: x: 1446.73px, y: 994.02px, 尺寸: 132px x 121.37px */
.grid-item-12 {
    width: 132px;
    height: 121.37px;
    left: 1446.73px;
    top: 994.02px;
}

/* Rectangle 167 - 位置: x: 1578.73px, y: 987.82px, 尺寸: 132.89px x 121.37px */
.grid-item-13 {
    width: 132.89px;
    height: 121.37px;
    left: 1578.73px;
    top: 987.82px;
}

/* 分隔线1 - Line 8 */
/* 位置: x: 118px, y: 1508px, 尺寸: 1465.07px x 1.21px, 颜色: #979797 */
.divider-line-1 {
    position: absolute;
    left: 118px;
    top: 1508px;
    width: 1465.07px;
    height: 1.21px;
    background-color: #979797;
}

/* 中间区域 - 不占用实际空间，内容绝对定位 */
.middle-section {
    position: relative;
    width: 100%;
    height: 0;
}

/* 左侧图片区域 - 绝对定位相对于preview-page */
.left-images {
    position: absolute;
    left: 262.24px;
    top: 1572.53px;
    width: 576.76px;
}

/* 侧边图片1 - image 3 */
/* 位置: x: 262.24px, y: 1572.53px, 尺寸: 576.76px x 372.97px */
.side-image-1 {
    width: 576.76px;
    height: 372.97px;
    object-fit: cover;
    display: block;
}

/* 侧边图片2 - image 4 */
/* 位置: x: 262.24px, y: 2011.07px, 尺寸: 576.76px x 372.97px */
.side-image-2 {
    width: 576.76px;
    height: 372.97px;
    object-fit: cover;
    display: block;
    margin-top: 65.57px; /* 2011.07 - 1572.53 - 372.97 */
}

/* 中间内容区域 - 绝对定位相对于preview-page */
.center-content {
    position: absolute;
    left: 913.4px;
    top: 1572.53px;
    width: 470.44px;
}

/* 大标题区域 - 相对于center-content定位 */
.big-title-section {
    position: absolute;
    left: 0;
    top: 861.13px; /* 2433.66 - 1572.53 */
    width: 228.57px;
}

/* 大标题1 - WE */
/* 位置: x: 913.4px, y: 2433.66px, 尺寸: 136.43px x 124.92px */
/* 字体: Instrument Serif, 400, 113.4px, 颜色: #000000 */
.big-title-1 {
    width: 136.43px;
    height: 124.92px;
    font-family: 'Instrument Serif', serif;
    font-weight: 400;
    font-size: 113.39958190917969px;
    line-height: 1.200727015355054em;
    color: #000000;
    display: flex;
    align-items: center;
    margin-bottom: 35.43px; /* 2594.01 - 2433.66 - 124.92 */
}

/* 大标题2 - HAVE */
/* 位置: x: 913.4px, y: 2594.01px, 尺寸: 228.57px x 124.92px */
.big-title-2 {
    width: 228.57px;
    height: 124.92px;
    font-family: 'Instrument Serif', serif;
    font-weight: 400;
    font-size: 113.39958190917969px;
    line-height: 1.200727015355054em;
    color: #000000;
    display: flex;
    align-items: center;
}

/* 主图 - main-image-1 - 相对于center-content定位 */
/* 位置: x: 913.4px, y: 1572.53px, 尺寸: 470.44px x 811.5px */
.main-image {
    width: 470.44px;
    height: 811.5px;
    object-fit: cover;
    display: block;
    position: relative;
    top: 0;
    left: 0;
}

/* 底部大图 - bottom-image - 绝对定位相对于preview-page */
/* 位置: x: 262.24px, y: 2449.61px, 尺寸: 577.57px x 762.87px */
.bottom-image {
    position: absolute;
    left: 262.24px;
    top: 2449.61px;
    width: 577.57px;
    height: 762.87px;
    object-fit: cover;
    z-index: 1;
}

/* 分隔线2 - Line 9 */
/* 位置: x: 874.63px, y: 1509px, 尺寸: 0px x 1824px (垂直分隔线) */
.divider-line-2 {
    position: absolute;
    left: 874.63px;
    top: 1509px;
    width: 1.1805557012557983px;
    height: 1824px;
    background-color: #979797;
}

/* 功能卡片区域 - 绝对定位相对于preview-page */
.feature-cards {
    position: absolute;
    left: 913.4px;
    top: 2749.05px;
    width: 600px;
    height: 400px;
    z-index: 2;
    overflow: visible; /* 确保箭头不会被裁剪 */
}

/* 功能卡片基础样式 */
/* 背景: rgba(206, 206, 206, 0.7), 边框: #000000 0.89px, 圆角: 35.42px */
/* 阴影: 0px 3.54px 3.54px rgba(0, 0, 0, 0.25) */
.feature-card {
    position: absolute;
    background-color: rgba(206, 206, 206, 0.7);
    border: 0.8859342336654663px solid #000000;
    border-radius: 35.41666793823242px;
    box-shadow: 0px 3.5437369346618652px 3.5437369346618652px rgba(0, 0, 0, 0.25);
    display: flex;
    align-items: center;
    height: 60.24px;
    left: 0;
    overflow: visible; /* 确保箭头不会被裁剪 */
}

/* 卡片文字 */
/* 位置: x: 932px (相对于preview-page), 字体: Hahmlet, 400, 21.26px, 行高: 1.448em, 颜色: #000000 */
.card-text {
    position: absolute;
    left: 18.6px; /* 932 - 913.4 = 18.6px */
    font-family: 'Hahmlet', sans-serif;
    font-weight: 400;
    font-size: 21.262420654296875px;
    line-height: 1.4479999878000995em;
    color: #000000;
    display: flex;
    align-items: center;
    white-space: nowrap;
}

/* 卡片箭头 - 绝对定位在卡片内，根据Figma数据精确定位 */
.card-arrow {
    position: absolute;
    width: 67px;
    height: 67px;
    object-fit: contain;
    display: block; /* 确保图片显示 */
    z-index: 10; /* 确保箭头在文字上方 */
}

/* 卡片1 - Music reviews */
/* 卡片位置: x: 913.4px, y: 2749.05px, 尺寸: 553.71px x 60.24px */
/* 文字位置: x: 932px, y: 2759.68px, 高度: 30.12px */
/* 箭头位置: x: 1384px, y: 2745px (相对于preview-page) */
.card-1 {
    width: 553.71px;
    top: 0;
}

.card-1 .card-text {
    top: 10.63px; /* 2759.68 - 2749.05 = 10.63px，文字顶部距离卡片顶部 */
}

.card-1 .card-arrow {
    left: 470.6px; /* 1384 - 913.4 = 470.6px，箭头左边缘距离卡片左边缘 */
    /* 检查是否超出卡片宽度: 470.6 + 67 = 537.6px < 553.71px，在范围内 */
    top: -4.05px; /* 2745 - 2749.05 = -4.05px，箭头顶部相对卡片顶部（可能稍微超出卡片） */
}

/* 卡片2 - Music Recommendations */
/* 卡片位置: x: 913.4px, y: 2868.66px, 尺寸: 492.58px x 60.24px */
/* 文字位置: x: 932px, y: 2879.29px, 高度: 30.12px */
/* 箭头位置: x: 1322px, y: 2866px (相对于preview-page) */
.card-2 {
    width: 492.58px;
    top: 119.61px; /* 2868.66 - 2749.05 */
}

.card-2 .card-text {
    top: 10.63px; /* 2879.29 - 2868.66 = 10.63px */
}

.card-2 .card-arrow {
    left: 408.6px; /* 1322 - 913.4 = 408.6px */
    /* 检查: 408.6 + 67 = 475.6px < 492.58px，在范围内 */
    top: -2.66px; /* 2866 - 2868.66 = -2.66px */
}

/* 卡片3 - Album Review */
/* 卡片位置: x: 913.4px, y: 2987.37px, 尺寸: 422.59px x 60.24px */
/* 文字位置: x: 932px, y: 2999.77px, 高度: 30.12px */
/* 箭头位置: x: 1248px, y: 2987px (相对于preview-page) */
.card-3 {
    width: 422.59px;
    top: 238.32px; /* 2987.37 - 2749.05 */
}

.card-3 .card-text {
    top: 12.4px; /* 2999.77 - 2987.37 = 12.4px */
}

.card-3 .card-arrow {
    left: 334.6px; /* 1248 - 913.4 = 334.6px */
    /* 检查: 334.6 + 67 = 401.6px < 422.59px，在范围内 */
    top: -0.37px; /* 2987 - 2987.37 = -0.37px */
}

/* 卡片4 - Related News */
/* 卡片位置: x: 913.4px, y: 3106.09px, 尺寸: 376.52px x 60.24px */
/* 文字位置: x: 932px, y: 3120.26px, 高度: 30.12px */
/* 箭头位置: x: 1203px, y: 3106px (相对于preview-page) */
.card-4 {
    width: 376.52px;
    top: 357.04px; /* 3106.09 - 2749.05 */
}

.card-4 .card-text {
    top: 14.17px; /* 3120.26 - 3106.09 = 14.17px */
}

.card-4 .card-arrow {
    left: 289.6px; /* 1203 - 913.4 = 289.6px */
    /* 检查: 289.6 + 67 = 356.6px < 376.52px，在范围内 */
    top: -0.09px; /* 3106 - 3106.09 = -0.09px */
}

/* 底部红色区域 - Rectangle 153 */
/* 位置: x: 0px, y: 3462.23px, 尺寸: 1700.99px x 180.73px, 背景: #680000 */
.bottom-red-section {
    position: absolute;
    left: 0;
    top: 3462.23px;
    width: 1700.99px;
    height: 180.73px;
    background-color: #680000;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Join us 文字 */
/* 位置: x: 748.61px, y: 3501.21px, 尺寸: 207.31px x 102.77px */
/* 字体: Hahmlet, 400, 56.7px, 行高: 1.448em, 颜色: #D9D9D9 */
.join-us-text {
    position: absolute;
    left: 748.61px;
    top: 38.98px; /* 3501.21 - 3462.23 */
    width: 207.31px;
    height: 102.77px;
    font-family: 'Hahmlet', sans-serif;
    font-weight: 400;
    font-size: 56.699790954589844px;
    line-height: 1.4479999677061475em;
    color: #D9D9D9;
    display: flex;
    align-items: center;
}

/* ==================== 移动端响应式设计 ==================== */
/* iPhone 14 Pro Max: 430px x 932px */
@media screen and (max-width: 430px) {
    
    /* 主容器适配移动端 */
    .preview-page {
        width: 100%;
        max-width: 430px;
        height: auto;
        min-height: 100vh;
        margin: 0 auto;
        padding: 20px 15px;
        box-sizing: border-box;
        overflow-x: hidden;
    }
    
    /* 顶部黑色背景区域移动端适配 */
    .top-black-section {
        position: relative;
        width: 100%;
        height: 400px;
        padding: 40px 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        gap: 30px;
    }
    
    /* Logo移动端适配 */
    .logo {
        position: relative;
        left: auto;
        top: auto;
        width: 120px;
        height: 120px;
    }
    
    /* 主标题移动端适配 */
    .main-title {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        height: auto;
        font-size: 38px;
        line-height: 1.2;
        text-align: center;
        word-wrap: break-word;
    }
    
    /* 内容区域移动端适配 */
    .content-section {
        position: relative;
        width: 100%;
        margin-top: 30px;
    }
    
    /* 第一段文本区域移动端适配 */
    .text-block-1 {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        height: auto;
        margin-bottom: 30px;
    }
    
    .description {
        width: 100%;
        height: auto;
        font-size: 22px;
        line-height: 1.5;
        text-align: center;
        color: #666666;
    }
    
    /* Enter按钮移动端适配 */
    .enter-button-frame {
        position: relative;
        left: auto;
        top: auto;
        margin: 30px auto;
        width: 200px;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 15px;
        background-color: rgba(255, 255, 255, 0.1);
        border-radius: 30px;
        backdrop-filter: blur(10px);
    }
    
    .enter-text {
        width: auto;
        height: auto;
        font-size: 26px;
        line-height: 1.2;
        -webkit-text-stroke: 0.5px #1E1E1E;
    }
    
    .arrow-icon {
        width: 30px;
        height: 30px;
    }
    
    /* 标题和段落文本区域移动端适配 */
    .title-text-section {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        margin: 40px 0;
        text-align: center;
    }
    
    .subtitle {
        width: 100%;
        font-size: 34px;
        line-height: 1.3;
        text-align: center;
        margin-bottom: 20px;
    }
    
    .description-2 {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        font-size: 22px;
        line-height: 1.5;
        text-align: center;
    }
    
    /* 图片网格移动端适配 */
    .image-grid {
        position: relative;
        width: 100%;
        height: auto;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
        margin: 40px 0;
    }
    
    .grid-item {
        position: relative;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        height: 80px !important;
        border-radius: 8px;
        overflow: hidden;
    }
    
    /* 分隔线移动端适配 */
    .divider-line-1 {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        height: 1px;
        margin: 40px 0;
    }
    
    /* 中间区域移动端适配 */
    .middle-section {
        position: relative;
        width: 100%;
        height: auto;
        margin: 40px 0;
    }
    
    .left-images {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 20px;
        margin-bottom: 30px;
    }
    
    .side-image-1,
    .side-image-2 {
        width: 100%;
        height: 200px;
        margin-top: 0;
        border-radius: 12px;
        overflow: hidden;
    }
    
    .center-content {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        text-align: center;
    }
    
    .big-title-section {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        margin: 30px 0;
    }
    
    .big-title-1,
    .big-title-2 {
        width: 100%;
        height: auto;
        font-size: 60px;
        line-height: 1.1;
        margin-bottom: 10px;
        justify-content: center;
    }
    
    .main-image {
        width: 100%;
        height: 300px;
        border-radius: 12px;
        overflow: hidden;
        margin: 20px 0;
    }
    
    .bottom-image {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        height: 250px;
        border-radius: 12px;
        overflow: hidden;
        margin: 30px 0;
    }
    
    /* 分隔线2移动端适配 */
    .divider-line-2 {
        display: none; /* 在移动端隐藏垂直分隔线 */
    }
    
    /* 功能卡片区域移动端适配 */
    .feature-cards {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        gap: 15px;
        margin: 40px 0;
    }
    
    .feature-card {
        position: relative;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        height: 50px;
        border-radius: 25px;
        padding: 0 20px;
        justify-content: space-between;
    }
    
    .card-text {
        position: relative;
        left: auto !important;
        top: auto !important;
        font-size: 22px;
        line-height: 1.2;
    }
    
    .card-arrow {
        position: relative;
        left: auto !important;
        top: auto !important;
        width: 30px;
        height: 30px;
    }
    
    /* 底部红色区域移动端适配 */
    .bottom-red-section {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        height: 120px;
        margin-top: 40px;
        border-radius: 12px 12px 0 0;
    }
    
    .join-us-text {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        height: auto;
        font-size: 38px;
        line-height: 1.2;
        justify-content: center;
    }
}