/* body-inner 区域 */
.body-inner {
    min-width: 1320px;
}

/* 产品选项卡 */
.product-tabs {
    position: sticky;
    top: 80px;
    background-color: #fff;
    /* border-bottom: 1px solid #e0e0e0; */
    padding: 4px 0;
    z-index: 90;
    transition: box-shadow 0.3s;
    background: #F5F6FA;
}

.product-tabs.scrolled {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.product-tabs ul {
    width: 1320px;
    min-width: 1320px;
    height: 42px;
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0 auto;
}

.product-tabs ul li {
    flex: 1;
    height: 100%;
}

.product-tabs ul li button {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: none;
    border: none;
    color: #0F1826;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s;
    outline: none;
}

.product-tabs ul li button:hover {
    color: #DD2226;
}

.product-tabs ul li button.active {
    color: #DD2226;
    background: #fff;
    border-radius: 10px;
}

/* 主要内容区域 */
.main-content {
    padding: 0px 0px;
    margin: 0 auto;
}

/* 产品区域通用样式 */
.product-section {
    padding: 60px 0 60px;
    background: linear-gradient( 180deg, #FFFFFF 0%, #F5F6FA 100%);
}

.product-section .inner {
    width: 1320px;
    min-width: 1320px;
    margin: 0 auto;
    font-family: 'NotoSansTC-Medium';
}

.product-section .inner>h2 {
    font-family: 'NotoSansTC-Medium';
    font-size: 36px;
    color: #0F1826;
    margin-bottom: 30px;
}

.product-section .mne-solution { 
    margin-bottom: 30px;
}

/* empowering 部分 */
.empowering .title{
    font-family: 'NotoSansTC-Medium';
    font-size: 20px;
    color: #0F1826;
    margin-bottom: 10px;
}

.empowering .subTitle { 
    font-size: 14px;
    color: #6e7580;
    margin-bottom: 30px;
}

/* MNE 特性卡片 */
.mne-features {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 21px;
}

.mne-features-col{
    flex: 1;
}

.mne-feature-card {
    background-color: #fff;
    padding: 30px;
    padding-right: 0;
    white-space: nowrap;
    border-radius: 20px;
    border: 1px solid #EBEDF0;
    transition: all 0.3s;
    margin-bottom: 20px;
    height: 248px;
}

.mne-feature-card.large{
    height: 516px;
}

.mne-feature-card.large .feature-icon{
    width: 366px;
    height: 218px;   
}

.mne-feature-card.large .feature-title{
    font-size: 34px;
    font-family: 'NotoSansTC-Medium';
    width: fit-content;
    background: linear-gradient(54.1228276006701deg, #0069FF 0%, #0038FF 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.mne-feature-card.large .feature-desc{
    font-size: 16px;
    color: #0F1826;
    line-height: 1.7;
}

.mne-feature-card:last-child {
    margin-bottom: 0;
}

.mne-feature-card:hover {
    box-shadow: 0px 5px 15px 0px rgba(201,206,214,0.21);
}

.mne-feature-card .feature-icon {
    width: 80px;
    height: 80px;
    border-radius: 0px;
    margin-bottom: 20px;
}

.mne-feature-card .feature-title {
    font-family: 'NotoSansTC-Medium';
    color: #0F1826;
    font-size: 20px;
    margin-bottom: 10px;
}

.mne-feature-card .feature-desc {
    color: #0F1826;
    font-size: 14px;
}

/* IoT Solution */

.iot-header {
    margin-bottom: 30px;
}

.iot-header h2 {
    font-family: 'NotoSansTC-Medium';
    font-size: 36px;
    color: #0F1826;
    margin-bottom: 30px;
}

.iot-header h3 {
    font-family: 'NotoSansTC-Medium';
    font-size: 20px;
    color: #0F1826;
    margin-bottom: 10px;
}

.iot-header p {
    color: #6e7580;
    font-size: 14px;
}

.iot-features {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;    
    align-items: flex-start;
    gap: 27px;
}

.iot-features .iot-features-col{
    flex: 1;
}

.iot-feature-card {
    background-color: #fff;
    padding: 30px;
    padding-right: 0;
    white-space: nowrap;
    border-radius: 20px;
    border: 1px solid #EBEDF0;
    transition: all 0.3s;
    margin-bottom: 20px;
    height: 248px;
}

.iot-feature-card:hover {
    box-shadow: 0px 5px 15px 0px rgba(201,206,214,0.21);
}

.iot-feature-card.large {
    height: 516px;
}

.iot-feature-card.large .feature-icon {
    width: 366px;
    height: 218px;   
}

.iot-feature-card.large .feature-title {
    font-size: 34px;
    font-family: 'NotoSansTC-Medium';
    width: fit-content;
    background: linear-gradient(55.22321337780942deg, #FF9900 0%, #FF6000 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.iot-feature-card.large .feature-desc {
    font-size: 16px;
    color: #0F1826;
    line-height: 1.7;
}

.iot-feature-card .feature-icon {
    width: 80px;
    height: 80px;
    border-radius: 0px;
    margin-bottom: 20px;
}

.iot-feature-card .feature-title {
    font-family: 'NotoSansTC-Medium';
    color: #0F1826;
    font-size: 20px;
    margin-bottom: 10px;
}

.iot-feature-card .feature-desc {
    color: #0F1826;
    font-size: 14px;
}

/* GTone */
.gtone-header {
    margin-bottom: 30px;
}

.gtone-header h2 {
    font-family: 'NotoSansTC-Medium';
    font-size: 36px;
    color: #0F1826;
}

.gtone-cards {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.gtone-card {
    width: calc(50% - 10px);
    background-color: #fff;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #e8e8e8;
    transition: all 0.3s;
    padding: 30px;
    position: relative;
}

.gtone-card:hover {
    box-shadow: 0px 5px 15px 0px rgba(201,206,214,0.21);
}

.gtone-card .card-image {
    width: 100%;
    height: auto;
    background-size: cover;
    background-position: center;
    position: relative;
}

.gtone-card .card-content {
    position: absolute;
    left: 50px;
    bottom: 55px;
}

.gtone-card .card-title {
    font-family: 'NotoSansTC-Medium';
    color: #fff;
    font-size: 22px;
    margin-bottom: 10px;
}

.gtone-card .card-desc {
    color: #fff;
    font-size: 16px;
}

/* Smart Kiosk */
.smartkiosk-header {
    margin-bottom: 30px;
}

.smartkiosk-header h2 {
    font-family: 'NotoSansTC-Medium';
    font-size: 36px;
    color: #0F1826;
    margin-bottom: 30px;
}

.smartkiosk-header p {
    font-family: 'NotoSansTC-Medium';
    font-size: 20px;
    color: #0F1826;
}

.smartkiosk-features {
    padding: 30px 30px 30px 60px;
    background: #fff;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    border-radius: 20px;
    border: 1px solid #EBEDF0;
}

.smartkiosk-features-left{
    flex: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    margin-right: 60px;
    background: #EBEDF0;
    gap: 1px;
}

.smartkiosk-features-right{
    width: 410px;
    height: 476px;
}

.smartkiosk-features-left .smartkiosk-feature-card {
    width: calc(50% - 0.5px);
    height: 238px;
    background-color: #fff;
    padding: 30px;
    border-radius: 0px;
    border: none;
    transition: all 0.3s;
}

.smartkiosk-features-left .smartkiosk-feature-card:nth-child(2n + 1) {
    padding-left: 0;
}

.smartkiosk-feature-card.large {
    color: #fff;
    height: 100%;
}

.smartkiosk-feature-card.large .feature-icon {
    width: 100%;
    height: 100%;
}

.smartkiosk-feature-card .feature-icon {
    width: 60px;
    height: 60px;
    border-radius: 0px;
    margin-bottom: 20px;
}

.smartkiosk-feature-card .feature-title {
    font-family: 'NotoSansTC-Medium';
    color: #0F1826;
    font-size: 20px;
    margin-bottom: 10px;
}

.smartkiosk-feature-card .feature-desc {
    color: #0F1826;
    font-size: 14px;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .navbar, .product-tabs {
        padding: 12px 20px;
    }

    .navbar nav ul {
        gap: 15px;
    }

    .main-content {
        padding: 20px;
    }

    .mne-feature-card.large {
        grid-column: span 1;
    }

    .footer-content {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 20px;
    }
}