/* Main Styles for English Website */

html {  font-size:100% !important;
}

/* 视频背景水平渐变遮罩 */
.video-gradient-overlay {
    background: linear-gradient(to right, rgba(231,239,255,1),rgba(231,239,255,0.3), rgb(255, 255, 255,0));
    position: absolute;
    inset: 0;
}

/* 行业背景图容器 */
.industry-bg-container {
    position: relative;
    width: 100%;
    height: 400px; /* 设置一个固定高度 */
    z-index: 2;
    pointer-events: none; /* 允许点击穿透到下面的元素 */
    margin: 0 auto; /* 水平居中 */
}

/* 行业方案背景渐变遮罩 - 置于背景图下方 */
.industry-solutions {
    background-image: linear-gradient(180deg,#f5f6f8,#ceedff 30%,#ceedff 50%,#f5f6f8 95%);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}


/* 行业背景图通用样式 */
.content-container {
    width: auto;
    height: 34rem;
    position: relative;
    overflow: hidden;
}

.industry-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover; /* 保持100%原始大小显示 */
    background-position: center bottom; /* 水平居中并底部对齐 */
    background-repeat: no-repeat;
    transition: all 0.8s ease-in-out;
    width: auto;
    z-index: -1;
    opacity: 0; /* 默认隐藏 */
}

    /* 激活状态的背景图 */
    .industry-bg.active {
        opacity: 1; /* 显示当前背景图 */
    }


.text-white {
    color: #076aff !important;
}
.hover\:bg-gray-200:hover {
    background: linear-gradient(90deg, rgba(255,230,250,1) 0%, rgba(210,230,255,0) 100%) !important;
}
.bg-primary {
    background-color: rgba(7,106,255,1) !important;
}

/* 水平渐变背景 */
.gradient-bg {
    background: linear-gradient(90deg, rgba(210,230,250,1) 0%, rgba(210,230,255,0) 100%) !important;
    box-shadow: -4px 0 0 rgba(7,106,255,1);
}
/* 行业选项卡过渡效果 */
.industry-tab {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* 行业内容区域过渡效果 */
.industry-content {
    transition: opacity 0.3s ease-in-out;
    opacity: 1;
}
.card-text-container{
    flex: 1;
    min-width: 0;
}
    .card-text-container p.text-sm.text-medium {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
.industry-content.hidden {
    opacity: 0;
    pointer-events: none;
}

    /* 行业内容标题居中 */
    .industry-content h3 {
        text-align: left;
    }

/* 查看详情按钮样式 */
.text-right {
    text-align: right;
    padding-top: 1rem;
}
.detail-btn {
    display: inline-block;
    background: none;
    color: #076aff;
    border: 1px solid #076affa7;
    padding: 0.1rem 0.3rem;
    border-radius: 6px;
    transition: all 0.3s ease;
    cursor: pointer;
    font-size: 1rem;
    
}

    .detail-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(7,106,255,0.2);
        color: #076aff;
        background: #076aff2e;
    }

/* Tailwind Utilities */
.content-auto {
    content-visibility: auto;
}

.perspective-1000 {
    perspective: 1000px;
}

.preserve-3d {
    transform-style: preserve-3d;
}

.backface-hidden {
    backface-visibility: hidden;
}

.rotate-y-0 {
    transform: rotateY(0deg);
}

.rotate-y-60 {
    transform: rotateY(60deg);
}

.rotate-y-120 {
    transform: rotateY(120deg);
}

.rotate-y-180 {
    transform: rotateY(180deg);
}

.rotate-y-240 {
    transform: rotateY(240deg);
}

.rotate-y-300 {
    transform: rotateY(300deg);
}

.translate-z-200 {
    transform: translateZ(200px);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Arial', sans-serif;
}

body {
    background-color: #f5f5f5;
    color: #333;
    line-height: 1.6;
}

.text-shadow {
    text-shadow: 0 2px 16px rgba(13, 64, 250, 0);
}

.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

/* 微调参数 */
/* 首屏 */
.py-10 {
    padding-top: 18rem !important;
}

.company-data {
    padding-top: 9rem;
}

.bg-white\/10 {
    background-color: rgba(255, 255, 255, 0.6) !important;
}

.mb-12 {
    color: #076aff;
}

.mb-6 {
    text-align: center;
    background: linear-gradient(120deg, #ffa61d 0%, #076aff 25%, #0538ff 100%, transparent);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: flex;
    align-items: center;
}
.mb-16 {
    color: #242e3d !important;
}
.mb-8{
    font-size: 1.2rem;
}
.mb-4 {
    padding-top: 1rem;
}
.py-12 {
    padding-top: 0rem !important;
}

.mb-2 {
    color: #076aff;
}
.mb-02 {
    color: #242e3d;
}
.separator {
    margin: 0 1.4rem;
    line-height: 4.2rem;
    font-size: 3.6rem;
    font-weight: 100;
    padding-bottom: 0.2rem;
}

.py-2 {
    font-size: 1.4rem;
}
.font-bold{
    font-size: 1.4rem;
}

.fa {
    color: #242e3d;
}


.bg-light {
    background-color: rgba(255, 255, 255, 0) !important;
}

.awards-img {
    width: 7rem;
    height: auto;
    margin: 0 auto;
}
.text-2xl{
    font-size: 1.8rem !important;
}

/* 产品矩阵 */
.product-matrix {
    background-image: linear-gradient(180deg,#fff,#ceedff 30%,#ceedff 50%,#ceedff 95%);
}
.text-center {
    font-size: 1.2rem;
    max-width: 60rem !important;
}
.bg-black\/50 {
    background: linear-gradient(180deg, #edf2fb97 0%, #dde8fb 30%, #ffffff93 100%) !important;
}

/*隐藏产品*/
.stash{
    display: none;
}
/* Hero Section */
.awards-bg {
    background-image: linear-gradient(180deg,#ebf7ff,#ceedff 30%,#ceedff 50%,#ebf7ff 95%);
    inset: 0;
    z-index: 1;
    padding-bottom: 8rem !important;
}

.industry-grid {
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 8px;
    backdrop-filter: blur(10px); /* 模糊背景，实现磨砂 */
    -webkit-backdrop-filter: blur(10px); /* Safari 兼容 */
    background: rgba(255, 255, 255, 0.6); /* 半透明白底，增强磨砂质感 */
    box-shadow: 0 8px 24px rgba(125, 126, 127, 0.1);
}

.industry-cs {
    padding: 5rem 0 !important;
}

.hero-content h2 {
    font-size: 48px;
    margin-bottom: 20px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.hero-content p {
    font-size: 20px;
    margin-bottom: 30px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

.btn {
    display: inline-block;
    background-color: #0066cc;
    color: #fff;
    padding: 12px 30px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: 600;
    transition: background-color 0.3s ease;
}

    .btn:hover {
        background-color: #0052a3;
    }

@media (max-width: 1600px) {
    .py-10 {
        padding-top: 14rem !important;
    }
    .company-data{
        padding-top: 5rem;
    }
    .carousel-card {
        width: 24rem;
        height: 19rem;
    }
}
@media (max-width: 1366px) {
    .adaptation{
        width:90% !important;
    }
    .py-10 {
        padding-top: 8rem !important;
    }

    .company-data {
        padding-top: 2rem;
    }
    .p-6{
        padding: 1rem;
    }
    .carousel-card {
        width: 24rem;
        height: 19rem;
    }
}
/* Responsive Design */
@media (max-width: 768px) {
    .header-content {
        flex-direction: column;
    }

    nav ul {
        margin-top: 20px;
    }

        nav ul li {
            margin-left: 15px;
            margin-right: 15px;
        }

    .hero-content h2 {
        font-size: 36px;
    }

    .hero-content p {
        font-size: 18px;
    }

    .about-content {
        flex-direction: column;
    }

    .about-image, .about-text {
        flex: none;
        width: 100%;
    }
}
