@import "tailwindcss";
/* 基础设置与自定义滚动条 */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #004a88; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #002f59; }

body { font-family: 'Noto Sans SC', sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }

/* -------------------------------------------
   多语言显示控制 (Language Toggle)
   ------------------------------------------- */
body.lang-zh .lang-en { display: none !important; }
body.lang-en .lang-zh { display: none !important; }

/* 精致导航栏 — 灰白渐变背景 + 微光毛玻璃 */
#main-nav {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    background: linear-gradient(135deg, rgba(248,248,248,0.6) 0%, rgba(255,255,255,0.7) 50%, rgba(245,245,245,0.6) 100%);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(0,0,0,0.04);
}
.nav-scrolled {
    background: linear-gradient(135deg, rgba(248,248,248,0.78) 0%, rgba(255,255,255,0.85) 50%, rgba(245,245,245,0.78) 100%) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 2px 24px rgba(0,0,0,0.06) !important;
    border-bottom: 1px solid rgba(0,0,0,0.08) !important;
}

/* 巨型菜单 (Mega Menu) 动画 */
.mega-menu-container {
    visibility: hidden; opacity: 0; transform: translateY(10px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.nav-item:hover .mega-menu-container {
    visibility: visible; opacity: 1; transform: translateY(0);
}

/* 主视觉轮播图 (Hero Slider) 样式 */
.slider-container { position: relative; height: 100vh; min-height: 650px; overflow: hidden; }
.slide {
    position: absolute; inset: 0; opacity: 0; visibility: hidden;
    transition: opacity 1s ease-in-out, visibility 1s;
    z-index: 1;
}
.slide.active { opacity: 1; visibility: visible; z-index: 2; }
.slide-bg {
    width: 100%; height: 100%; object-fit: cover;
    transform: scale(1.05); transition: transform 6s ease-out;
}
.slide.active .slide-bg { transform: scale(1); }
.slide-content {
    opacity: 0; transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.3s;
}
.slide.active .slide-content { opacity: 1; transform: translateY(0); }

/* 轮播图进度条 */
.slider-progress { width: 0%; height: 3px; background-color: #fff; transition: width 0.1s linear; }

/* 滚动淡入动画 (Scroll Reveal) */
.reveal { opacity: 0; transform: translateY(40px); transition: all 0.8s cubic-bezier(0.5, 0, 0, 1); }
.reveal.active { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }

/* 卡片工业风悬浮特效 */
.industrial-card { transition: all 0.4s ease; border-bottom: 4px solid transparent; }
.industrial-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px -5px rgba(0, 0, 0, 0.1);
    border-bottom-color: #004a88;
}

/* 图片遮罩与放大特效 */
.img-zoom-container { overflow: hidden; }
.img-zoom-container img { transition: transform 0.7s ease; }
.img-zoom-container:hover img { transform: scale(1.1); }

/* -------------------------------------------
   新增 Section 样式 — 压铸工厂主题
   ------------------------------------------- */

/* 俄语文字在中文模式下也可见 */
.hero-ru {
    font-family: 'Noto Sans', sans-serif;
    letter-spacing: 0.02em;
}

/* Hero 淡入动画 */
.hero-content-fade {
    opacity: 0;
    transform: translateY(40px);
    animation: heroFadeIn 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s forwards;
}
@keyframes heroFadeIn {
    to { opacity: 1; transform: translateY(0); }
}

/* 向下滚动指示器动画 */
.scroll-arrow {
    width: 24px;
    height: 24px;
    border-right: 2px solid rgba(255,255,255,0.3);
    border-bottom: 2px solid rgba(255,255,255,0.3);
    transform: rotate(45deg);
    animation: scrollBounce 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
@keyframes scrollBounce {
    0%, 100% { transform: rotate(45deg) translate(0, 0); opacity: 0.3; }
    50% { transform: rotate(45deg) translate(8px, 8px); opacity: 1; }
}

/* Hero 背景缩放动画 */
.hero-bg-img {
    animation: heroZoom 8s cubic-bezier(0.25, 0.46, 0.45, 0.94) infinite alternate;
}
@keyframes heroZoom {
    0% { transform: scale(1.05); }
    100% { transform: scale(1.15); }
}

/* ===========================================
   产品卡片 — Apple 风格悬浮效果
   =========================================== */
.product-card {
    cursor: pointer;
    transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    border-bottom: 3px solid transparent;
    position: relative;
    overflow: hidden;
}
.product-card:hover {
    transform: translateY(-12px) scale(1.02);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
    border-bottom-color: #004a88;
}
.product-card-img {
    transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.product-card:hover .product-card-img {
    transform: scale(1.08);
}

/* ===========================================
   横向滚动 — 生产能力
   =========================================== */
.horiz-scroll-container {
    position: relative;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    padding-left: 0;
    padding-right: 0;
}

/* 滚动箭头按钮 */
.scroll-arrow-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: white;
    border: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 10;
    opacity: 0;
}
.horiz-scroll-container:hover .scroll-arrow-btn {
    opacity: 1;
}
.scroll-arrow-btn:hover {
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
    transform: translateY(-50%) scale(1.08);
    background: #004a88;
    color: white;
}
.scroll-arrow-btn:active {
    transform: translateY(-50%) scale(0.95);
}
.scroll-arrow-btn--left {
    left: 8px;
}
.scroll-arrow-btn--right {
    right: 8px;
}
.scroll-arrow-btn:disabled {
    opacity: 0 !important;
    cursor: default;
}

.horiz-scroll-wrapper {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
    cursor: grab;
    scroll-behavior: smooth;
}
.horiz-scroll-wrapper:active {
    cursor: grabbing;
}
.horiz-scroll-wrapper::-webkit-scrollbar {
    display: none;
}
.horiz-scroll-track {
    display: flex;
    gap: 24px;
    scroll-snap-type: x mandatory;
    padding: 0 max(1rem, calc((100vw - 1280px) / 2)) 8px;
}
@media (max-width: 1280px) {
    .horiz-scroll-track {
        padding: 0 1rem 8px;
    }
}

/* 设备卡片样式 */
.equip-card {
    scroll-snap-align: start;
    min-width: 300px;
    width: 340px;
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    flex-shrink: 0;
    background: white;
}
.equip-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px -8px rgba(0, 0, 0, 0.12);
}
.equip-card-img {
    transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.equip-card:hover .equip-card-img {
    transform: scale(1.1);
}
@media (min-width: 768px) {
    .equip-card {
        width: 380px;
    }
}

/* ===========================================
   资质证书卡片
   =========================================== */
.cert-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.06);
    padding: 1.25rem 0.75rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-align: center;
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    backdrop-filter: blur(4px);
    cursor: default;
}
.cert-card:hover {
    background: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.15);
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.2);
}
.cert-icon-wrap {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(0, 74, 136, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s ease;
}
.cert-card:hover .cert-icon-wrap {
    background: rgba(0, 74, 136, 0.25);
    transform: scale(1.1);
}

/* ===========================================
   自定义主题颜色 — 原 tailwind.config 迁移
   覆盖 bg-corporate-blue、text-corporate-red 等类
   =========================================== */

/* 基础背景色 */
.bg-corporate-blue        { background-color: #004a88; }
.bg-corporate-blue-dark   { background-color: #002f59; }
.bg-corporate-red         { background-color: #cc0000; }
.bg-light-gray            { background-color: #f4f5f7; }

/* 基础文字色 */
.text-corporate-blue      { color: #004a88; }
.text-corporate-blue-dark { color: #002f59; }
.text-corporate-red       { color: #cc0000; }
.text-warm-metal          { color: #c94d2b; }

/* 基础边框色 */
.border-corporate-blue    { border-color: #004a88; }

/* focus 状态边框 */
.focus\:border-corporate-blue:focus { border-color: #004a88; }

/* 10% 不透明度背景 */
.bg-corporate-blue\/10    { background-color: rgba(0, 74, 136, 0.1); }

/* group-hover 下 20% 不透明度背景 */
.group:hover .group-hover\:bg-corporate-blue\/20 { background-color: rgba(0, 74, 136, 0.2); }