/* ==========================================================================
   Nuoang Base — 最小必要框架
   ========================================================================== */
:root {  }

.nuoang-page *, .nuoang-page *::before, .nuoang-page *::after { box-sizing: border-box; }
.nuoang-page a { text-decoration: none; }
img { height: auto; max-width: 100%; }
.nuoang-page img { border: none; border-radius: 0; box-shadow: none; }
.nuoang-page hr { background-color: transparent; margin: 0; }

/* 容器系统 */
.nuoang-container {
    --container-max-width: 1280px;
    --content-width: min(100%, var(--container-max-width));
    --width: 100%;
    --display: flex;
    --flex-direction: column;
    --flex-wrap: nowrap;
    --position: relative;
    --z-index: revert;
    --overflow: visible;
    --padding-top: 10px;
    --padding-bottom: 10px;
    --padding-left: 20px;
    --padding-right: 20px;
    --margin-top: 0px;
    --margin-bottom: 0px;
    --margin-left: auto;
    --margin-right: auto;
    --row-gap: 0px;
    --column-gap: 0px;
    --flex-grow: 0;
    --flex-shrink: 0;
    --flex-basis: auto;
    --align-items: initial;
    --justify-content: initial;
    --border-radius: 0px;
    position: var(--position);
    z-index: var(--z-index);
    display: var(--display);
    flex-direction: var(--flex-direction);
    flex-wrap: var(--flex-wrap);
    width: var(--width);
    max-width: var(--container-max-width);
    margin: var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);
    padding-top: var(--padding-top);
    padding-right: var(--padding-right);
    padding-bottom: var(--padding-bottom);
    padding-left: var(--padding-left);
    overflow: var(--overflow);
    gap: var(--row-gap) var(--column-gap);
    border-radius: var(--border-radius);
}

.nuoang-container::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 0;
    pointer-events: none;
}

/* ===== 全场景SSL/TLS数字证书 Section ===== */
.nuoang-cert-section {
    width: 100%;
    padding: var(--module-py) 0;
}
.nuoang-cert-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}
.nuoang-cert-header {
    text-align: center;
    margin-bottom: var(--module-header-mb);
}

/* Slider wrapper */
.nuoang-cert-slider {
    width: 100%;
    position: relative;
    overflow: hidden;
}

/* 轮播轨道 */
.nuoang-cert-track {
    display: flex;
    transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    padding: 8px 0;
}

/* 每个 slide 用 padding 制造间隙，宽度由响应式断点控制 */
.nuoang-cert-slide {
    flex-shrink: 0;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}

/* 卡片本体（cert-card 和 product-card 共享样式） */
.nuoang-cert-card, .nuoang-product-card {
    position: relative;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 1px 12px rgba(51, 65, 101, 0.13);
    transition: transform 0.3s ease;
}
.nuoang-cert-card:hover, .nuoang-product-card:hover {
    transform: translateY(-2px);
}

/* 卡片内容 */
.nuoang-cert-card-inner, .nuoang-product-card-inner {
    padding: 24px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.nuoang-cert-card-header, .nuoang-product-card-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--nuoang-border-light-color);
}
.nuoang-cert-card-logo, .nuoang-product-card-logo {
    max-height: 38px;
    width: auto;
    object-fit: contain;
    flex-shrink: 0;
}
.nuoang-cert-card-title, .nuoang-product-card-title { margin-bottom: 4px; }
.nuoang-cert-card-title h4, .nuoang-product-card-title h4 {
    font-size: 16px;
    line-height: 22px;
    font-weight: 600;
    margin: 0;
    color: var(--nuoang-text-color);
}
.nuoang-cert-card-title p, .nuoang-product-card-title p {
    font-size: 12px;
    line-height: 18px;
    color: #6B7280;
    margin: 3px 0 0;
}
.nuoang-cert-card-features, .nuoang-product-card-features {
    padding: 10px 0;
}
.nuoang-cert-card-features ul, .nuoang-product-card-features ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.nuoang-cert-card-features ul li, .nuoang-product-card-features ul li {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 13px;
    line-height: 20px;
    margin-bottom: 6px;
    color: var(--nuoang-text-color);
}
.nuoang-cert-card-features ul li:last-child, .nuoang-product-card-features ul li:last-child { margin-bottom: 0; }
.nuoang-cert-card-features ul li i, .nuoang-product-card-features ul li i {
    color: var(--nuoang-primary-color);
    font-size: 14px;
    margin-top: 2px;
    flex-shrink: 0;
}
/* 勾选图标统一改用 SVG（static/images/icons/check.svg），替换 RemixIcon 字体图标；尺寸随 font-size，颜色随 currentColor */
.ri-check-line {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("../images/icons/check.svg") center / contain no-repeat;
    mask: url("../images/icons/check.svg") center / contain no-repeat;
}
.ri-check-line::before { content: none; }
.nuoang-cert-card-footer, .nuoang-product-card-footer {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--nuoang-border-light-color);
}
.nuoang-cert-card-price, .nuoang-product-card-price {
    display: flex;
    align-items: baseline;
    gap: 2px;
}
.nuoang-cert-card-price .symbol, .nuoang-product-card-price .symbol {
    font-size: 13px;
    font-weight: 700;
    color: inherit;
}
.nuoang-cert-card-price h2, .nuoang-product-card-price h2 {
    font-size: 30px;
    line-height: 30px;
    font-weight: 700;
    color: #f33e3e;
    margin: 0;
}
.nuoang-cert-card-price span, .nuoang-product-card-price span {
    font-size: 13px;
    color: #9CA3AF;
}
.nuoang-cert-card-footer .nuoang-btn, .nuoang-product-card-footer .nuoang-btn {
    padding: 0.55rem 1rem;
    font-size: 14px;
    border-radius: 6px;
    gap: 8px;
}
.nuoang-cert-pagination-wrap {
    position: relative;
    z-index: 10;
}
.nuoang-cert-dots {
    text-align: center;
    margin-top: 30px;
    display: flex;
    justify-content: center;
    gap: 8px;
}
.nuoang-cert-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #D1D5DB;
    cursor: pointer;
    transition: background 0.25s ease, width 0.3s ease;
    border: none;
    padding: 0;
    flex-shrink: 0;
}
.nuoang-cert-dot.is-active {
    background: var(--nuoang-primary-color, #0224FD);
    width: 20px;
    border-radius: 4px;
}

/* 响应式：slide 宽度（≥1025px 3列 / 769-1024px 2列 / ≤768px 1列） */
@media (min-width: 1025px) {
    .nuoang-cert-slide { width: 33.3333%; }
}
@media (min-width: 769px) and (max-width: 1024px) {
    .nuoang-cert-slide { width: 50%; }
}
@media (max-width: 768px) {
    .nuoang-cert-slide { width: 100%; }
}

@media (max-width: 1024px) {
    .nuoang-cert-slide { padding-left: 10px; padding-right: 10px; }
    .nuoang-cert-card-inner { padding: 20px; }
    .nuoang-cert-card-header { gap: 10px; }
    .nuoang-cert-card-logo { max-height: 32px; }
    .nuoang-cert-card-title h4 { font-size: 16px; }
    .nuoang-cert-card-features ul li { font-size: 14px; line-height: 20px; margin-bottom: 6px; }
    .nuoang-cert-card-features ul li i { font-size: 15px; }
    .nuoang-cert-card-price h2 { font-size: 26px; line-height: 26px; }
    .nuoang-cert-card-price .symbol { font-size: 12px; }
    .nuoang-cert-card-footer .nuoang-btn { padding: 0.5rem 0.8rem; font-size: 13px; }
}
@media (max-width: 768px) {
    .nuoang-cert-slide { padding-left: 8px; padding-right: 8px; }
    .nuoang-cert-card-logo { max-height: 30px; }
}

/* ========================================================================== */
.nuoang-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background: rgba(255, 255, 255, 0.68);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.35s ease, opacity 0.35s ease;
}

.nuoang-header.scrolled {
    background: rgba(255, 255, 255, 0.48);
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

body.header-hidden .nuoang-header {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

.nuoang-header-inner {
    max-width: 100%;
    margin: 0 auto;
    height: 64px;
    display: flex;
    align-items: center;
    padding: 0 40px;
    gap: 0;
    position: relative;
}

/* Logo */
.nuoang-header-logo { flex-shrink: 0; margin-right: 12px; }
.nuoang-header-logo a { display: block; }
.nuoang-header-logo img { height: 32px; width: auto; max-width: 100%; display: block; }

/* Navigation */
.nuoang-header-nav {
    display: flex;
    align-items: center;
    flex: 1;
    justify-content: flex-start;
}

.nuoang-nav-menu {
    display: flex;
    align-items: center;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
}

.nuoang-nav-item { position: relative; list-style: none; height: 64px; display: flex; align-items: center; }

.nuoang-nav-item > a {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 12px;
    font-size: 15px;
    font-weight: 400;
    color: var(--nuoang-text-color);
    text-decoration: none;
    line-height: 1;
    white-space: nowrap;
    transition: color 0.2s ease;
}

.nuoang-nav-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 2px;
    background: var(--nuoang-primary-color);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 101;
}

.nuoang-nav-item:hover::after { transform: scaleX(1); }

.nuoang-nav-item > a i { display: none; }

/* Mega Menu */
.nuoang-mega {
    position: fixed;
    top: 64px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background: #fff;
    border-radius: 0 0 6px 6px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
    display: flex;
    overflow: hidden;
    min-height: 310px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1),
                visibility 0.25s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 100;
}
.nuoang-nav-item.has-mega:hover .nuoang-mega {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.nuoang-mega-side {
    width: 260px;
    background: url('../picture/nav-panel-bg.png') center/cover no-repeat;
    padding: 24px 0;
    flex-shrink: 0;
    position: relative;
}
.nuoang-mega-side::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.15);
    z-index: 0;
}
.nuoang-mega-side > * { position: relative; z-index: 1; }
.nuoang-mega-side h3 {
    padding: 0 40px;
    margin: 0 0 20px;
    font-size: 22px;
    font-weight: 600;
    color: #333;
}
.nuoang-mega-side-intro p {
    padding: 0 40px;
    margin: 0;
    font-size: 14px;
    line-height: 1.8;
    color: #6B7280;
}
.nuoang-mega-cats {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0 40px;
}
.nuoang-mega-cats a {
    display: inline-block;
    padding: 12px 0;
    font-size: 15px;
    color: #6B7280;
    text-decoration: none;
    transition: color 0.25s cubic-bezier(0.4, 0, 0.2, 1), transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}
.nuoang-mega-cats a:hover {
    color: var(--nuoang-primary-color);
    transform: translateX(4px);
}
.nuoang-mega-cats a.active {
    color: var(--nuoang-primary-color);
    font-weight: 500;
}
.nuoang-mega-cats a.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--nuoang-primary-color);
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
}
.nuoang-mega-cats a:not(.active)::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 0;
    background: var(--nuoang-primary-color);
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.nuoang-mega-cats a:not(.active):hover::after {
    width: 100%;
}
.nuoang-mega-main {
    flex: 1;
    padding: 24px;
    min-width: 0;
}
.nuoang-mega-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    align-content: start;
    position: relative;
}
.nuoang-mega-card {
    padding: 18px 16px;
    border-radius: 6px;
    text-decoration: none;
    transition: background 0.2s ease, box-shadow 0.2s ease;
    min-height: 120px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: translateY(8px);
    animation: megaCardFadeIn 0.35s ease forwards;
}
.nuoang-mega-card:nth-child(1) { animation-delay: 0.02s; }
.nuoang-mega-card:nth-child(2) { animation-delay: 0.06s; }
.nuoang-mega-card:nth-child(3) { animation-delay: 0.10s; }
.nuoang-mega-card:nth-child(4) { animation-delay: 0.14s; }
.nuoang-mega-card:nth-child(5) { animation-delay: 0.18s; }
.nuoang-mega-card:nth-child(6) { animation-delay: 0.22s; }
.nuoang-mega-card:nth-child(7) { animation-delay: 0.26s; }
.nuoang-mega-card:nth-child(8) { animation-delay: 0.30s; }
.nuoang-mega-card:nth-child(9) { animation-delay: 0.34s; }

@keyframes megaCardFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.nuoang-mega-card:hover { background: #f9fafb; box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1); }
.nuoang-mega-card-top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}
.nuoang-mega-name {
    font-size: 15px;
    font-weight: 500;
    color: #333;
}
.nuoang-mega-badge {
    font-size: 11px;
    color: #ff4d4f;
    border: 1px solid #ff4d4f;
    padding: 0 6px;
    border-radius: 6px;
    line-height: 18px;
    white-space: nowrap;
}
.nuoang-mega-desc {
    font-size: 12px;
    color: #9ca3af;
    line-height: 1.6;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.nuoang-mega-view-all {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #f0f1f3;
    text-align: right;
}
.nuoang-mega-view-all a {
    font-size: 13px;
    color: var(--nuoang-primary-color);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: gap 0.2s ease;
}
.nuoang-mega-view-all a:hover {
    gap: 8px;
}
.nuoang-mega-view-all a i {
    font-size: 14px;
}

/* Header Tools (搜索 + 链接 + 按钮) */
.nuoang-header-tools {
    flex-shrink: 0;
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 20px;
}

.nuoang-header-search-wrap {
    position: relative;
    width: 220px;
    height: 34px;
}
.nuoang-header-search {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    width: 220px;
    height: 34px;
    padding: 0 12px;
    border-radius: 4px;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(#e5e5e5, #e5e5e5) border-box;
    border: 1px solid transparent;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                background 0.2s ease,
                box-shadow 0.2s ease,
                border-radius 0.2s ease;
    cursor: text;
    z-index: 10001;
}
.nuoang-header-search:hover,
.nuoang-header-search-wrap.active .nuoang-header-search,
.nuoang-header-search:focus-within {
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(263.66deg, #8469ff -0.07%, #2450ff 99.93%) border-box;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.nuoang-header-search-wrap.active .nuoang-header-search {
    width: 580px;
    right: 4px;
}
.nuoang-header-search-dropdown {
    position: absolute;
    top: -15px;
    right: -16px;
    width: 252px;
    padding: 0;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-radius: 8px;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.15s ease,
                visibility 0s linear 0.35s;
    z-index: 10000;
}
.nuoang-header-search-wrap.active .nuoang-header-search-dropdown {
    width: 620px;
    opacity: 1;
    visibility: visible;
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.1s ease,
                visibility 0s linear 0s;
}
.nuoang-header-search-dropdown-inner {
    width: 620px;
    padding: 58px 20px 20px;
    float: right;
}
.nuoang-header-search-dropdown .nuoang-search-section {
    margin-top: 0;
}
.nuoang-header-search-dropdown .nuoang-search-section:not([style*="none"]) ~ .nuoang-search-section:not([style*="none"]) {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #F3F4F6;
}
.nuoang-header-search-dropdown .nuoang-search-section-label {
    font-size: 13px;
    color: #8c8c8c;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.nuoang-header-search-dropdown .nuoang-search-section-label::before {
    content: "";
    width: 3px;
    height: 12px;
    background: linear-gradient(180deg, #8469ff, #2450ff);
    border-radius: 2px;
}
.nuoang-header-search-dropdown .nuoang-search-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.nuoang-header-search-dropdown .nuoang-search-tag {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 12px;
    background: #f5f5f7;
    border-radius: 14px;
    font-size: 13px;
    color: #4d4d4d;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}
.nuoang-header-search-dropdown .nuoang-search-tag:hover {
    background: rgba(36, 80, 255, 0.08);
    color: #2450ff;
}
.nuoang-header-search-dropdown .nuoang-search-recommend {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #f0f0f0;
}
.nuoang-header-search-dropdown .nuoang-search-recommend-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.nuoang-header-search-dropdown .nuoang-search-recommend-title {
    font-size: 13px;
    color: #8c8c8c;
    margin-bottom: 10px;
}
.nuoang-header-search-dropdown .nuoang-search-recommend-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
    font-size: 14px;
    color: #333;
    text-decoration: none;
    transition: color 0.2s ease;
}
.nuoang-header-search-dropdown .nuoang-search-recommend-item:hover {
    color: #2450ff;
}
.nuoang-header-search-dropdown .nuoang-search-recommend-item i {
    font-size: 12px;
    opacity: 0.4;
    transition: opacity 0.2s ease, transform 0.2s ease;
}
.nuoang-header-search-dropdown .nuoang-search-recommend-item:hover i {
    opacity: 1;
    transform: translate(2px, -2px);
}
.nuoang-search-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-right: 8px;
}
.nuoang-search-input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 13px;
    color: #333;
    line-height: 1;
}
.nuoang-search-input::placeholder { color: #999; }
.nuoang-header-search-close {
    display: none;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    background: none;
    border: none;
    font-size: 18px;
    color: #999;
    cursor: pointer;
    flex-shrink: 0;
    margin-left: 8px;
    transition: color 0.2s ease;
}
.nuoang-header-search-close:hover { color: #333; }
.nuoang-header-search-wrap.active .nuoang-header-search-close {
    display: flex;
}

.nuoang-header-link {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    color: var(--nuoang-text-color);
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s ease;
}
.nuoang-header-link:hover { color: var(--nuoang-primary-color); }
.nuoang-header-link i { font-size: 15px; }

.nuoang-header-divider {
    width: 1px;
    height: 16px;
    background: #e0e0e6;
    flex-shrink: 0;
}

.nuoang-header-text-btn {
    font-size: 14px;
    color: var(--nuoang-text-color);
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s ease;
}
.nuoang-header-text-btn:hover { color: var(--nuoang-primary-color); }

.nuoang-header-register {
    padding: 6px 20px;
}

/* 登录状态区域 */
.nuoang-header-auth {
    display: flex;
    align-items: center;
    gap: 16px;
}

.nuoang-header-auth-guest {
    display: flex;
    align-items: center;
    gap: 16px;
}

.nuoang-header-auth-user {
    display: flex;
    align-items: center;
}

/* 用户下拉菜单 */
.nuoang-header-user-dropdown {
    position: relative;
}

.nuoang-header-user-trigger {
    display: flex;
    align-items: center;
    gap: 10px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    border-radius: 0;
    transition: none;
}

.nuoang-header-user-dropdown:hover .nuoang-header-user-trigger,
.nuoang-header-user-dropdown.open .nuoang-header-user-trigger {
    background: transparent;
}

.nuoang-header-user-avatar {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background: var(--nuoang-primary-color, #3269ff);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    flex-shrink: 0;
    order: 2;
}

.nuoang-header-user-name {
    font-weight: 500;
    font-size: 14px;
    color: var(--nuoang-text-color);
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    order: 1;
}

/* SVG 图标 */
.nuoang-menu-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: #6b7280;
}

/* 下拉菜单 */
.nuoang-header-user-menu {
    position: absolute;
    top: calc(100% + 20px);
    right: 0;
    min-width: 220px;
    background: #fff;
    border-radius: 0;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    padding: 6px 0;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

.nuoang-header-user-dropdown:hover .nuoang-header-user-menu,
.nuoang-header-user-dropdown.open .nuoang-header-user-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* 菜单项 */
.nuoang-header-user-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    color: #374151;
    font-size: 14px;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
    white-space: nowrap;
}

.nuoang-header-user-menu-item:hover {
    background: #f3f4f6;
    color: var(--nuoang-primary-color);
}

.nuoang-header-user-menu-item:hover .nuoang-menu-icon {
    color: var(--nuoang-primary-color);
}

.nuoang-header-user-menu-item.logout {
    color: #ef4444;
}

.nuoang-header-user-menu-item.logout .nuoang-menu-icon {
    color: #ef4444;
}

.nuoang-header-user-menu-item.logout:hover {
    background: #fef2f2;
    color: #dc2626;
}

.nuoang-header-user-menu-item.logout:hover .nuoang-menu-icon {
    color: #dc2626;
}

.nuoang-header-user-menu-divider {
    height: 1px;
    background: #f0f1f5;
    margin: 4px 0;
}

.nuoang-header-user-balance {
    margin-left: auto;
    font-style: normal;
    font-weight: 600;
    color: #ff7043;
    font-size: 13px;
}

.nuoang-btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 24px;
    background: var(--nuoang-primary-color);
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    text-decoration: none;
    border-radius: 6px;
    transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.nuoang-btn-primary:hover {
    background: #0118d4;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(2, 36, 253, 0.25);
}

.nuoang-btn-primary i { font-size: 14px; transition: transform 0.25s ease; }
.nuoang-btn-primary:hover i { transform: translateX(3px); }
.nuoang-btn-primary i { display: none; }

/* Mobile Toggle */
.nuoang-nav-toggle {
    display: none;
    background: none;
    border: none;
    font-size: 28px;
    color: var(--nuoang-text-color);
    cursor: pointer;
    padding: 4px 0;
    line-height: 1;
}
.nuoang-nav-toggle .ri-close-line {
    font-size: 32px;
}

.nuoang-nav-overlay {
    display: none;
}

.nuoang-mobile-tools {
    display: none;
}

/* Mobile Search Panel */
.nuoang-search-panel {
    display: none;
}

@media (max-width: 1024px) {
    .nuoang-search-panel {
        display: block;
        position: fixed;
        top: 64px;
        left: 0;
        width: 100%;
        height: calc(100vh - 64px);
        height: calc(100dvh - 64px);
        background: #fff;
        z-index: 10001;
        transform: translateY(-100%);
        opacity: 0;
        visibility: hidden;
        transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                    opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                    visibility 0s linear 0.35s;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        padding-bottom: env(safe-area-inset-bottom);
    }
    .nuoang-search-panel.active {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
        transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                    opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1),
                    visibility 0s linear 0s;
    }

    .nuoang-search-panel-overlay {
        display: none;
    }

    .nuoang-search-panel-inner {
        padding: 20px 20px 16px;
    }

    .nuoang-search-panel-box {
        display: flex;
        align-items: center;
        gap: 10px;
        height: 40px;
        padding: 0 14px;
        border-radius: 8px;
        background:
            linear-gradient(#fff, #fff) padding-box,
            linear-gradient(263.66deg, #8469ff -0.07%, #2450ff 99.93%) border-box;
        border: 1.5px solid transparent;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    }
    .nuoang-search-panel-icon {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
        object-fit: contain;
    }
    .nuoang-search-panel-input {
        flex: 1;
        border: none;
        outline: none;
        background: none;
        font-size: 15px;
        color: #1a1a2e;
        -webkit-appearance: none;
    }
    .nuoang-search-panel-input::placeholder {
        color: #bbb;
    }

    .nuoang-search-section {
        margin-top: 28px;
    }
    .nuoang-search-section-label {
        font-size: 13px;
        color: #999;
        margin-bottom: 14px;
    }
    .nuoang-search-tags {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }
    .nuoang-search-tag {
        display: inline-flex;
        align-items: center;
        height: 32px;
        padding: 0 14px;
        background: rgba(0, 0, 0, 0.04);
        border-radius: 6px;
        font-size: 13px;
        color: #333;
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
        transition: background 0.2s ease;
    }
    .nuoang-search-tag:active {
        background: rgba(0, 0, 0, 0.08);
    }

    .nuoang-search-recommend-grid {
        display: flex;
        gap: 24px;
    }
    .nuoang-search-recommend-col {
        flex: 1;
        min-width: 0;
    }
    .nuoang-search-recommend-title {
        font-size: 13px;
        color: #999;
        margin-bottom: 14px;
    }
    .nuoang-search-recommend-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 11px 0;
        font-size: 14px;
        color: #333;
        text-decoration: none;
        border-bottom: 1px solid #f0f0f3;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-tap-highlight-color: transparent;
    }
    .nuoang-search-recommend-item:last-child {
        border-bottom: none;
    }
    .nuoang-search-recommend-item i {
        font-size: 12px;
        color: #ccc;
        flex-shrink: 0;
        margin-left: 8px;
    }
    .nuoang-search-recommend-item:active {
        opacity: 0.6;
    }
}

/* Mobile Responsive */
/* 搜索历史清除按钮 */
.nuoang-search-clear-history { border: none; background: transparent; font-size: 12px; color: #9CA3AF; cursor: pointer; margin-left: auto; padding: 2px 6px; }
.nuoang-search-clear-history:hover { color: #EF4444; }

/* 实时搜索结果 */
.nuoang-search-live-results { display: flex; flex-direction: column; gap: 4px; }
.nuoang-live-group { padding: 4px 0; }
.nuoang-live-group:not(:last-child) { border-bottom: 1px solid #F3F4F6; }
.nuoang-live-group-label { font-size: 12px; color: #9CA3AF; padding: 4px 8px; font-weight: 500; }
.nuoang-live-item { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; border-radius: 8px; text-decoration: none; color: #374151; font-size: 14px; transition: background .15s; }
.nuoang-live-item:hover { background: #F3F4F6; }
.nuoang-live-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nuoang-live-price { font-size: 14px; font-weight: 600; color: #DC2626; margin-left: 12px; white-space: nowrap; }
.nuoang-live-meta { font-size: 12px; color: #9CA3AF; margin-left: 12px; white-space: nowrap; }

@media (max-width: 1024px) {
    .nuoang-nav-toggle { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; margin-right: 0; touch-action: manipulation; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; }
    .nuoang-nav-toggle:active { opacity: 0.6; }
    .nuoang-header-tools { display: none; }

    .nuoang-mobile-tools {
        display: flex;
        align-items: center;
        gap: 18px;
        margin-left: auto;
        margin-right: 14px;
    }
    .nuoang-mobile-icon-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 26px;
        height: 26px;
        margin-right: 0;
        background: none;
        border: none;
        padding: 0;
        cursor: pointer;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
    }
    .nuoang-mobile-icon-btn:last-child {
        margin-right: 0;
    }
    .nuoang-mobile-icon-btn:active { opacity: 0.6; }
    .nuoang-mobile-icon-btn img {
        width: 24px;
        height: 24px;
        opacity: 1;
    }

    /* 用户图标单独大一点 */
    .nuoang-mobile-user-btn {
        width: 30px;
        height: 30px;
    }
    .nuoang-mobile-user-btn img {
        width: 28px;
        height: 28px;
    }

    /* 手机端用户图标：默认显示图片，有 token 时显示圆形头像 */
    .nuoang-mobile-user-avatar {
        display: none;
        width: 26px;
        height: 26px;
        border-radius: 50%;
        background: var(--nuoang-primary-color, #3269ff);
        color: #fff;
        font-size: 12px;
        font-weight: 600;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    .nuoang-has-token .nuoang-mobile-user-icon {
        display: none;
    }

    .nuoang-has-token .nuoang-mobile-user-avatar {
        display: flex;
    }

    .nuoang-header-nav a,
    .nuoang-header-nav button,
    .nuoang-header-nav div {
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
    }
    .nuoang-header-nav a:active,
    .nuoang-mega-card:active,
    .nuoang-mega-cat-header:active {
        opacity: 0.6;
    }

    .nuoang-header {
        backdrop-filter: blur(20px) saturate(180%);
        -webkit-backdrop-filter: blur(20px) saturate(180%);
        background: rgba(255, 255, 255, 0.6);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    }
    .nuoang-header.scrolled {
        backdrop-filter: blur(24px) saturate(180%);
        -webkit-backdrop-filter: blur(24px) saturate(180%);
        background: rgba(255, 255, 255, 0.75);
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    }

    .nuoang-header-inner {
        position: static;
    }

    .nuoang-header-nav {
        position: absolute;
        top: 64px;
        left: 0;
        right: 0;
        height: calc(100vh - 64px);
        height: calc(100dvh - 64px);
        overflow: hidden;
        background: #fff;
        z-index: 10000;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: stretch;
        padding: 0;
        box-shadow: none;
        transform: translateX(-100%);
        transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .nuoang-header-nav.active {
        transform: translateX(0);
    }

    .nuoang-nav-overlay {
        display: block;
        position: absolute;
        top: 64px;
        left: 0;
        right: 0;
        height: calc(100vh - 64px);
        height: calc(100dvh - 64px);
        background: rgba(0, 4, 30, 0.4);
        z-index: 9998;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.35s ease;
        -webkit-tap-highlight-color: transparent;
    }
    .nuoang-nav-overlay.active {
        opacity: 1;
        pointer-events: auto;
    }

    .nuoang-nav-menu {
        flex: none;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        width: 128px;
        height: 100%;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        background: #f5f5f7;
        padding: 12px 0 env(safe-area-inset-bottom);
        -webkit-overflow-scrolling: touch;
    }
    .nuoang-nav-menu::-webkit-scrollbar {
        width: 3px;
    }
    .nuoang-nav-menu::-webkit-scrollbar-track {
        background: transparent;
    }
    .nuoang-nav-menu::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.15);
        border-radius: 3px;
    }

    .nuoang-nav-item {
        position: static;
        height: auto;
        border-bottom: none;
    }

    .nuoang-nav-item > a {
        position: relative;
        z-index: 2;
        flex: 1;
        padding: 14px 20px;
        font-size: 14px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        text-align: left;
        white-space: nowrap;
        color: #333;
        transition: color 0.2s ease;
        line-height: 1.3;
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
        touch-action: manipulation;
    }
    .nuoang-nav-item > a::after { display: none; }
    .nuoang-nav-item::after { display: none; }
    .nuoang-nav-item > a i { display: none; }

    .nuoang-nav-item.is-selected > a {
        color: #0224fd;
        font-weight: 600;
        background: #fff;
    }
    .nuoang-nav-item.is-selected > a::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 3px;
        background: #0224fd;
        z-index: 3;
    }

    .nuoang-mega {
        position: absolute;
        left: 128px;
        right: 0;
        top: 0;
        bottom: 0;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        display: none;
        background: #fff;
        padding: 12px 20px env(safe-area-inset-bottom);
        -webkit-overflow-scrolling: touch;
        opacity: 1;
        visibility: visible;
        transform: none;
        border-radius: 0;
        box-shadow: none;
    }
    .nuoang-nav-item.is-selected .nuoang-mega {
        display: block;
    }

    .nuoang-mega-side { display: none; }
    .nuoang-mega-main { display: none; }

    .nuoang-mega-accordion {
        display: block;
        padding: 0;
    }
    .nuoang-mega-cat-group {
        border-bottom: 1px solid #f0f1f3;
    }
    .nuoang-mega-cat-group:last-child {
        border-bottom: none;
    }
    .nuoang-mega-cat-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 14px 0;
        font-size: 14px;
        color: #333;
        text-decoration: none;
        cursor: pointer;
        line-height: 1.3;
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
        touch-action: manipulation;
    }
    .nuoang-mega-cat-header::after {
        content: "\ea4e";
        font-family: "remixicon";
        font-size: 12px;
        color: #c0c0c0;
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .nuoang-mega-cat-group.expanded .nuoang-mega-cat-header::after {
        transform: rotate(180deg);
    }
    .nuoang-mega-cat-content {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .nuoang-mega-cat-group.expanded .nuoang-mega-cat-content {
        max-height: 800px;
    }
    .nuoang-mega-cat-content .nuoang-mega-card {
        padding: 14px 0 14px 16px;
        border-bottom: none;
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
    }
    .nuoang-mega-cat-content .nuoang-mega-card:last-child {
        border-bottom: none;
    }
    .nuoang-mega-cat-content .nuoang-mega-card::after {
        display: none;
    }
    .nuoang-mega-grid {
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .nuoang-mega-card {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        padding: 14px 0;
        height: auto;
        min-height: auto;
        border-bottom: 1px solid #f0f1f3;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        transition: none;
        opacity: 1;
        transform: none;
        animation: none;
        line-height: 1.3;
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
        touch-action: manipulation;
    }
    .nuoang-mega-card:nth-child(n) { animation: none; }
    .nuoang-mega-card::after {
        content: "\ea6e";
        font-family: "remixicon";
        font-size: 12px;
        color: #c0c0c0;
        margin-left: 8px;
        flex-shrink: 0;
    }
    .nuoang-mega-card:hover {
        background: transparent;
        box-shadow: none;
        transform: none;
    }
    .nuoang-mega-card-top { flex: 1; margin-bottom: 0; }
    .nuoang-mega-card .nuoang-mega-name { font-size: 14px; color: #333; font-weight: 400; }
    .nuoang-mega-card .nuoang-mega-desc { display: none; }
    .nuoang-mega-card .nuoang-mega-badge { font-size: 11px; }
}

@media (max-width: 480px) {
    .nuoang-header-inner { padding: 0 16px; height: 56px; }
    .nuoang-header-logo img { height: 24px; }
    .nuoang-header-nav { top: 56px; height: calc(100vh - 56px); height: calc(100dvh - 56px); }
    .nuoang-nav-overlay { top: 56px; height: calc(100vh - 56px); height: calc(100dvh - 56px); }
    .nuoang-search-panel { top: 56px; height: calc(100vh - 56px); height: calc(100dvh - 56px); }
}
/* ------------------------ */
a { text-decoration: none; color: var(--nuoang-text-color); background-color: transparent; }

a, button, input { outline: medium none; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible {
    outline: 2px solid var(--nuoang-primary-color, #3269ff);
    outline-offset: 2px;
    border-radius: 4px;
}
input:focus-visible,
.nuoang-search-input:focus-visible,
.nuoang-news-search-input:focus-visible {
    outline: none;
}

/* ------------------------ */

/* ------------------------ */
/* ------------------------ */
/* ========================================================================== */

/* ------------------------ */
.nuoang-btn { align-items: center; display: inline-flex; gap: 12px; justify-content: center; text-align: center; white-space: nowrap; border: none; border-radius: 6px; overflow: hidden; padding: .75rem 1.0625rem; position: relative; -webkit-transition: all 300ms ease; transition: all 300ms ease; background-color: var(--nuoang-white-color); font-size: 15px; font-weight: 500; line-height: 1.25; letter-spacing: -0.05em; }

.nuoang-btn .btn-text { position: relative; color: var(--nuoang-white-color); }

.nuoang-btn.primary-btn { background: linear-gradient(
        115deg,
        var(--nuoang-accent-color),
        var(--nuoang-primary-color),
        var(--nuoang-secondary-color)
    );
    background-size: 150% 100%;
    
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out; }

.nuoang-btn.primary-btn:hover { background-position: 100% 0; }

.nuoang-hero-btn-group .nuoang-btn.primary-btn,
.nuoang-hero-btn-group .nuoang-btn.outline-btn { padding: 12px 30px; }

.nuoang-hero-btn-group .nuoang-btn.outline-btn {
    background: #fff;
    border: 1px solid #fff;
}
.nuoang-hero-btn-group .nuoang-btn.outline-btn .btn-text { color: #111; }
.nuoang-hero-btn-group .nuoang-btn.outline-btn:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
}

/* 内页 Banner 按钮组 */
.nuoang-page-hero-btn-group {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 24px;
}

.nuoang-page-hero-btn-group .nuoang-btn,
.nuoang-page-hero-btn-group .nuoang-btn.primary-btn,
.nuoang-page-hero-btn-group .nuoang-btn.outline-btn {
    padding: 12px 30px;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.25;
    border-radius: 6px;
}
.nuoang-page-hero-btn-group .nuoang-btn.primary-btn .btn-text { color: #fff; }
.nuoang-page-hero-btn-group .nuoang-btn.outline-btn {
    background: #fff;
    border: 1px solid #fff;
}
.nuoang-page-hero-btn-group .nuoang-btn.outline-btn .btn-text { color: #111; }
.nuoang-page-hero-btn-group .nuoang-btn.outline-btn:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
}
.nuoang-page-hero-btn-group .nuoang-btn.primary-btn:hover {
    opacity: 0.9;
}

@media (max-width: 768px) {
    .nuoang-page-hero-btn-group {
        gap: 10px;
        margin-top: 16px;
    }
    .nuoang-page-hero-btn-group .nuoang-btn,
    .nuoang-page-hero-btn-group .nuoang-btn.primary-btn,
    .nuoang-page-hero-btn-group .nuoang-btn.outline-btn {
        padding: 8px 16px;
        font-size: 13px;
        line-height: 1.2;
        min-height: 34px;
    }
}

/* ------------------------ */
html { height: auto; }

body { margin: 0; scroll-behavior: smooth; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-weight: 400; font-style: normal; font-size: 16px; line-height: 26px; color: var(--nuoang-body-color); background: #fff; overflow-x: clip; }

#page.site { overflow-x: clip; }

/* ------------------------ */
h1, h2, h3, h4, h5, h6 { margin-top: 0px; font-style: normal; margin-bottom: 10px; color: var(--nuoang-text-color); }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; }

h1 { font-size: 64px; line-height: 1.15; font-weight: 600; letter-spacing: -1px; }

h2 { font-size: 48px; line-height: 1.2; font-weight: 500; letter-spacing: -0.5px; }

h3 { font-size: 30px; line-height: 1.3; font-weight: 500; letter-spacing: -0.3px; }

h4 { font-size: 24px; line-height: 1.35; font-weight: 500; letter-spacing: -0.2px; }

h5 { font-size: 20px; line-height: 1.4; font-weight: 500; letter-spacing: -0.1px; }

h6 { font-size: 18px; line-height: 1.45; font-weight: 500; letter-spacing: 0; }

ul { margin: 0 0 1.5em 3em; list-style: disc; margin-left: 0; }

.page { margin: 0; }

p { margin: 0 0 25px; line-height: 1.6; }

table tbody th 
/* Sections ====== */

/** Remove the margin in all browsers. */

/* Normalize remnants (keep minimal resets) */

/* Forms ====== */

button, input { font-family: inherit;

	font-size: 100%;

	line-height: 1.15;

	margin: 0; }

button, input { overflow: visible; }

button { text-transform: none; appearance: button; cursor: pointer; }

/** Correct the inability to style clickable types in iOS and Safari. */


/*-------------------------------------------------------------- */

/* Typography */

h1, h2, h3, h4, h5, h6 { clear: both; }

p { margin-bottom: 1.5em; }

/* Elements */



li > ul, li > ol { margin-bottom: 0;

	margin-left: 1.5em; }


/* Links */


/* Forms */


.page { margin: 0; }

/* ==========================================================================
/* Bootstrap utility replacements */
.img-fluid { max-width: 100%; height: auto; }
.text-white { color: #fff; }
.text-center { text-align: center; }

/* ==========================================================================
   Unified Section Spacing System
   统一间距变量集中管理：
   --module-py        模块上下间距（桌面 80px / 移动 50px）
   --module-header-mb  模块标题/副标题下边距（桌面 36px / 移动 24px）
   一处修改全局生效
   ========================================================================== */

:root {
    --module-py: 80px;
    --module-header-mb: 36px;
    /* 主题色 */
    --nuoang-primary-color: #3269ff;
    --nuoang-accent-color: #2FF6F6;
    --nuoang-secondary-color: #007DFA;
    --nuoang-text-color: #00041E;
    --nuoang-body-color: #444444;
    --nuoang-white-color: #FFFFFF;
    --nuoang-bg-dark-color: #151619;
    --nuoang-border-light-color: #EDEDED;
}

@media (max-width: 768px) {
    :root {
        --module-py: 50px;
        --module-header-mb: 24px;
    }
}


/* ========================================================================== */
.nuoang-why-section {
    background: #F5F5F7;
    background-color: #F5F5F7;
    width: 100%;
    padding-top: var(--module-py);
    padding-bottom: var(--module-py);
}

.nuoang-why-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

.nuoang-why-header {
    text-align: center;
    margin-bottom: var(--module-header-mb);
}

.nuoang-why-title {
    font-family: Inter, sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
    margin: 0 0 12px 0;
    letter-spacing: -0.01em;
}

.nuoang-why-subtitle {
    font-family: Inter, sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #6B7280;
    line-height: 1.6;
    margin: 0;
}

.nuoang-why-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.nuoang-why-card {
    text-align: center;
    border-radius: 8px;
    background: #fff;
    padding: 32px 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
    will-change: transform;
}

/* hover 上浮效果（入场完成后内联 transition-delay 已被 JS 清除，无延迟） */
.nuoang-why-card.is-in:hover,
.nuoang-why-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.nuoang-why-icon-wrap {
    width: 72px;
    height: 72px;
    margin: 0 auto 20px auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nuoang-why-icon-wrap img {
    width: 72px;
    height: 72px;
    object-fit: contain;
}

.nuoang-why-card-title {
    font-family: Inter, sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #1a1a1a;
    line-height: 1.4;
    margin: 0 0 8px 0;
    transition: color 0.3s ease;
}

.nuoang-why-card:hover .nuoang-why-card-title {
    color: var(--nuoang-primary-color, #3269ff);
}

.nuoang-why-card-desc {
    font-family: Inter, sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #6B7280;
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 1024px) {
    .nuoang-why-grid { grid-template-columns: repeat(2, 1fr); }
    .nuoang-why-title { font-size: 28px; }
}

@media (max-width: 640px) {
    .nuoang-why-grid { grid-template-columns: 1fr; gap: 16px; }
    .nuoang-why-title { font-size: 22px; }
    .nuoang-why-subtitle { font-size: 14px; }
    .nuoang-why-card { padding: 24px 18px; }
    .nuoang-why-icon-wrap {
        width: 56px;
        height: 56px;
        margin-bottom: 14px;
    }
    .nuoang-why-icon-wrap img {
        width: 56px;
        height: 56px;
    }
}

/* ==========================================================================
   Scroll Reveal Animation (data-reveal 系统)
   ========================================================================== */
[data-reveal] {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.5s cubic-bezier(0.2, 0.8, 0.2, 1),
                transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
    /* CSS 兜底：3s 后若 JS 未能触发 .is-in，强制显示，防止内容永久隐藏 */
    animation: reveal-failsafe 0.01s 3s forwards;
}
[data-reveal][data-reveal-dir="left"] { transform: translateX(-24px); }
[data-reveal][data-reveal-dir="right"] { transform: translateX(24px); }
[data-reveal][data-reveal-dir="scale"] { transform: scale(0.98); }
[data-reveal].is-in {
    opacity: 1;
    transform: translateY(0) scale(1);
    animation: none;
}
@keyframes reveal-failsafe {
    to { opacity: 1; transform: translateY(0) scale(1); }
}


.nuoang-sw-section {
    position: relative;
    width: 100%;
    margin-top: 0;
}

/* ==========================================================================
   合作品牌跑马灯
   ========================================================================== */
.nuoang-brands-section {
    background: #ffffff;
    padding-top: var(--module-py);
    padding-bottom: var(--module-py);
    overflow: hidden;
}
.nuoang-brands-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}
.nuoang-brands-header {
    text-align: center;
    margin-bottom: var(--module-header-mb);
}
.nuoang-brands-title {
    font-family: Inter, sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
    margin: 0 0 10px 0;
    letter-spacing: -0.01em;
}
.nuoang-brands-subtitle {
    font-family: Inter, sans-serif;
    font-size: 15px;
    color: #6B7280;
    line-height: 1.6;
    margin: 0;
}
.nuoang-brands-marquee {
    position: relative;
    overflow: hidden;
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.marquee-track {
    display: flex;
    align-items: center;
    gap: 0;
    width: max-content;
    animation: marqueeScroll 40s linear infinite;
    will-change: transform;
}
.marquee-track:hover {
    animation-play-state: paused;
}
@keyframes marqueeScroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
.brand-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 20px 36px;
    flex-shrink: 0;
    text-decoration: none;
    transition: transform 0.3s ease;
}
.brand-item:hover {
    transform: translateY(-4px);
}
.brand-item img {
    width: 140px;
    height: 70px;
    object-fit: contain;
    opacity: 0.65;
    transition: opacity 0.3s ease, filter 0.3s ease;
    filter: grayscale(40%);
}
.brand-item:hover img {
    opacity: 1;
    filter: grayscale(0%);
}
.brand-name {
    font-family: Inter, sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: #6B7280;
    transition: color 0.3s ease;
    white-space: nowrap;
}
.brand-item:hover .brand-name {
    color: var(--nuoang-primary-color, #3269ff);
}
.marquee-fade {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 80px;
    pointer-events: none;
    z-index: 2;
}
.marquee-fade-left {
    left: 0;
    background: linear-gradient(90deg, #ffffff, transparent);
}
.marquee-fade-right {
    right: 0;
    background: linear-gradient(270deg, #ffffff, transparent);
}
@media (max-width: 768px) {
    .nuoang-brands-title { font-size: 22px; }
    .nuoang-brands-subtitle { font-size: 14px; line-height: 1.6; }
    .brand-item { padding: 16px 24px; }
    .brand-item img { width: 110px; height: 56px; }
    .brand-name { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .marquee-track { animation: none; }
}

.nuoang-sw-top-section {
    background: #ffffff;
    padding-top: var(--module-py);
    padding-bottom: 0;
    width: 100%;
}

.nuoang-sw-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

.nuoang-sw-header {
    text-align: center;
    margin-bottom: var(--module-header-mb);
}

.nuoang-sw-title {
    font-size: 32px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
    margin-bottom: 12px;
    letter-spacing: -0.01em;
}

.nuoang-sw-title .title-sub {
    font-style: normal;
    font-weight: 700;
}

.nuoang-sw-subtitle {
    font-size: 15px;
    color: #6B7280;
    line-height: 1.6;
    margin: 0;
}

.nuoang-sw-view-all {
    color: var(--nuoang-primary-color, #3269ff);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    margin-left: 8px;
    white-space: nowrap;
    transition: opacity 0.25s ease;
}
.nuoang-sw-view-all:hover {
    opacity: 0.8;
}

.nuoang-sw-tabs-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 72px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    flex-wrap: wrap;
}

.nuoang-sw-tab-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 12px 36px 16px 36px;
    cursor: pointer;
    position: relative;
    transition: all 0.25s ease;
    user-select: none;
    border: none;
    background: transparent;
}

.nuoang-sw-tab-icon-wrap {
    width: 72px;
    height: 72px;
    margin: 0 auto 10px auto;
    display: block;
    cursor: pointer;
    transition: transform 0.25s ease;
    background-repeat: no-repeat;
    background-position: center;
}

/* 默认雪碧图图标 */
.nuoang-sw-tab-sprite-icon {
    background-image: none;
    background-size: 100% 2100%;
    background-position: 0 calc(var(--frame, 0) * 5%);
    will-change: background-position;
}
.nuoang-sw-tab-sprite-icon.is-playing {
    animation: nuoangSpritePlay 1.2s steps(20) forwards;
    animation-delay: calc(var(--frame, 0) * -0.06s);
}
.nuoang-sw-tab-sprite-icon.is-reversing {
    animation: nuoangSpritePlay 1.2s steps(20) reverse forwards;
}

/* 自定义上传图标（也是雪碧图，使用相同的帧动画逻辑） */
.nuoang-sw-tab-custom-icon {
    background-size: 100% 2100%;
    background-position: 0 calc(var(--frame, 0) * 5%);
    will-change: background-position;
}
.nuoang-sw-tab-custom-icon.is-playing {
    animation: nuoangSpritePlay 1.2s steps(20) forwards;
    animation-delay: calc(var(--frame, 0) * -0.06s);
}
.nuoang-sw-tab-custom-icon.is-reversing {
    animation: nuoangSpritePlay 1.2s steps(20) reverse forwards;
}

.nuoang-sw-tab-text {
    font-size: 15px;
    font-weight: 500;
    color: #1a1a1a;
    transition: color 0.25s ease;
}

.nuoang-sw-tab-item:hover .nuoang-sw-tab-text { color: #3269ff; }
.nuoang-sw-tab-item:hover .nuoang-sw-tab-icon-wrap {
    transform: translateY(-2px);
}
.nuoang-sw-tab-item.active .nuoang-sw-tab-text { color: #3269ff; font-weight: 500; }

.nuoang-sw-tabs-nav { position: relative; }
.nuoang-sw-tabs-indicator {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 3px;
    background: #3269ff;
    border-radius: 6px 6px 0 0;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
    z-index: 1;
    will-change: transform, width;
}

@keyframes nuoangSpritePlay {
    0% { background-position: 0 0; }
    100% { background-position: 0 100%; }
}

.nuoang-sw-bottom-section {
    background: #F8F9FC;
    width: 100%;
    padding-top: 40px;
    padding-bottom: var(--module-py);
}

.nuoang-sw-tab-pane { display: none; opacity: 0; transition: opacity 0.3s ease; }
.nuoang-sw-tab-pane.active { display: block; opacity: 1; }
.nuoang-sw-tab-pane.active .nuoang-sw-card {
    opacity: 0;
    animation: nuoangCardFadeIn 0.65s ease forwards;
}
.nuoang-sw-tab-pane.active .nuoang-sw-card:nth-child(1) { animation-delay: 0.00s; }
.nuoang-sw-tab-pane.active .nuoang-sw-card:nth-child(2) { animation-delay: 0.07s; }
.nuoang-sw-tab-pane.active .nuoang-sw-card:nth-child(3) { animation-delay: 0.14s; }
.nuoang-sw-tab-pane.active .nuoang-sw-card:nth-child(4) { animation-delay: 0.21s; }
.nuoang-sw-tab-pane.active .nuoang-sw-card:nth-child(5) { animation-delay: 0.28s; }
.nuoang-sw-tab-pane.active .nuoang-sw-card:nth-child(6) { animation-delay: 0.35s; }

@keyframes nuoangCardFadeIn {
    from { opacity: 0; transform: translateY(45px); }
    to   { opacity: 1; transform: translateY(0); }
}

.nuoang-sw-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

@media (max-width: 991px) {
    .nuoang-sw-card-grid { grid-template-columns: 1fr; }
}

@media (max-width: 1199px) and (min-width: 768px) {
    .nuoang-sw-card-grid { grid-template-columns: repeat(2, 1fr); }
}

.nuoang-sw-right-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

@media (max-width: 1199px) and (min-width: 768px) {
    .nuoang-sw-right-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
    .nuoang-sw-container { padding: 0 20px; }
    .nuoang-sw-title { font-size: 22px; line-height: 1.3; margin-bottom: 10px; }
    .nuoang-sw-subtitle { font-size: 14px; line-height: 1.6; }
    .nuoang-sw-bottom-section { padding-top: 30px; padding-bottom: var(--module-py); }
    .nuoang-sw-card-grid { grid-template-columns: 1fr; }
    .nuoang-sw-tabs-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        gap: 0;
        justify-content: flex-start;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 0 16px;
    }
    .nuoang-sw-tabs-nav::-webkit-scrollbar { display: none; }
    .nuoang-sw-tab-item { padding: 12px 14px 16px 14px; flex: 1 0 0; min-width: 72px; }
    .nuoang-sw-tab-icon-wrap { width: 56px; height: 56px; margin-bottom: 8px; }
    .nuoang-sw-tab-text { font-size: 13px; white-space: nowrap; }
    .nuoang-sw-tabs-indicator { height: 2px; }
}

.nuoang-sw-card {
    position: relative;
    background: #ffffff url('https://www.kkidc.com/images/new_kkidc/index/kws-bg_01.jpg') center/cover no-repeat;
    border-radius: 6px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
    border: 1px solid #ffffff;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.35s ease,
                border-color 0.35s ease;
    min-height: 150px;
}
.nuoang-sw-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.1);
    z-index: 0;
    border-radius: 6px;
    transition: background 0.35s ease;
}
.nuoang-sw-card > * { position: relative; z-index: 1; }
.nuoang-sw-card.is-in:hover,
.nuoang-sw-card:hover {
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1);
    border-color: var(--nuoang-primary, #1677ff);
}
.nuoang-sw-card:hover::before {
    background: rgba(255, 255, 255, 0.05);
}
.nuoang-sw-card:hover .nuoang-sw-card-title {
    color: var(--nuoang-primary, #1677ff);
}

.nuoang-sw-ribbon-hot {
    position: absolute;
    top: -1px;
    right: -1px;
    width: 56px;
    height: 56px;
    overflow: hidden;
    pointer-events: none;
    z-index: 3;
}
.nuoang-sw-ribbon-hot::before {
    content: attr(data-ribbon);
    position: absolute;
    top: 10px;
    right: -18px;
    width: 72px;
    height: 16px;
    background: linear-gradient(135deg, #FF9500 0%, #E60012 100%);
    color: #ffffff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-align: center;
    line-height: 16px;
    transform: rotate(45deg);
    box-shadow: 0 2px 4px rgba(230, 0, 18, 0.25);
}

.nuoang-sw-card-head {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    padding-right: 32px;
    flex-wrap: wrap;
    gap: 6px;
}
.nuoang-sw-card-title { font-size: 16px; font-weight: 700; color: #1a1a1a; margin: 0; line-height: 1.4; }
.nuoang-sw-badge-tag { font-size: 11px; color: #F53F3F; background: #FFF0ED; padding: 1px 6px; border-radius: 6px; font-weight: 500; line-height: 1.3; }
.nuoang-sw-card-desc {
    font-size: 13px;
    color: #6B7280;
    margin: 0 0 8px 0;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 39px;
}
.nuoang-sw-tags { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.nuoang-sw-tag { font-size: 12px; color: #2E5BFF; background: #EFF3FF; border: 1px solid #D6E0FF; padding: 4px 10px; border-radius: 6px; line-height: 1; }
.nuoang-sw-card-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 12px;
    border-top: 1px solid #F0F1F3;
    margin-top: auto;
}
.nuoang-sw-price { display: flex; align-items: baseline; gap: 2px; }
.nuoang-sw-price-symbol { font-size: 14px; color: #F53F3F; font-weight: 700; }
.nuoang-sw-price-amount { font-size: 26px; color: #F53F3F; font-weight: 700; line-height: 1; }
.nuoang-sw-price-unit { font-size: 13px; color: #9CA3AF; margin-left: 2px; font-weight: 400; }
.nuoang-sw-btn-buy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 14px;
    background: linear-gradient(115deg, #2FF6F6, #3269ff, #007DFA);
    background-size: 150% 100%;
    color: #ffffff;
    font-size: 12px;
    font-weight: 500;
    border-radius: 6px;
    text-decoration: none;
    transition: all 0.4s ease-in-out;
    white-space: nowrap;
}
.nuoang-sw-btn-buy:hover { background-position: 100% 0; color: #ffffff; }

@media (max-width: 768px) {
    .nuoang-sw-card { padding: 16px 16px; }
    .nuoang-sw-card-title { font-size: 16px; }
    .nuoang-sw-badge-tag { font-size: 10px; padding: 2px 6px; }
    .nuoang-sw-card-desc { font-size: 12px; margin-bottom: 12px; }
    .nuoang-sw-tag { font-size: 13px; padding: 3px 8px; }
    .nuoang-sw-btn-buy { font-size: 11px; padding: 3px 12px; }
}

/* ========================================================================== */
.nuoang-news-section {
    background: #FFFFFF;
    background-color: #FFFFFF;
    position: relative;
    width: 100%;
    padding-top: var(--module-py);
    padding-bottom: var(--module-py);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #1a1a1a;
    overflow: hidden;
}

.nuoang-news-container { max-width: 1280px; margin: 0 auto; padding: 0 20px; }

.nuoang-news-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: var(--module-header-mb);
    gap: 12px;
}
.nuoang-news-title { font-size: 32px; font-weight: 700; color: #1a1a1a; line-height: 1.3; margin: 0; letter-spacing: -0.01em; }
.nuoang-news-title .title-sub { font-style: normal; font-weight: 700; }
.nuoang-news-sub-row { display: flex; align-items: center; gap: 16px; }
.nuoang-news-subtitle { font-size: 15px; color: #6B7280; font-weight: 400; line-height: 1.6; margin: 0; }
.nuoang-news-more-link { font-size: 14px; color: var(--nuoang-primary-color); font-weight: 500; text-decoration: none; white-space: nowrap; transition: opacity 0.25s ease; }
.nuoang-news-more-link:hover { opacity: 0.8; }

.nuoang-news-main {
    display: grid;
    grid-template-columns: 1.8fr 3fr;
    gap: 24px;
    align-items: stretch;
    margin-bottom: 24px;
}

/* 首页新闻模块：确保不受新闻列表页 flex 样式影响 */
.nuoang-front-news-main {
    display: grid !important;
    grid-template-columns: 1.8fr 3fr !important;
    flex-direction: row !important;
}

.nuoang-featured-card {
    display: flex;
    flex-direction: column;
    background: #f8fafc;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.04);
    transition: box-shadow 0.3s ease;
    text-decoration: none;
}
.nuoang-featured-card:hover { box-shadow: 0 8px 30px rgba(0,0,0,0.08); }
.nuoang-featured-thumb { width: 100%; height: 230px; overflow: hidden; background: #F3F4F6; flex-shrink: 0; }
.nuoang-featured-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s ease; }
.nuoang-featured-card:hover .nuoang-featured-thumb img { transform: scale(1.04); }
.nuoang-featured-body { flex: 1; padding: 20px 24px; display: flex; flex-direction: row; align-items: center; gap: 20px; }
.nuoang-featured-divider { width: 1px; align-self: stretch; background: #E5E7EB; flex-shrink: 0; }
.nuoang-featured-date-block { display: flex; flex-direction: column; align-items: center; gap: 6px; flex-shrink: 0; }
.nuoang-featured-day { font-size: 36px; font-weight: 700; color: #1a1a1a; line-height: 1; letter-spacing: -0.02em; font-family: 'DIN Alternate', DIN, 'Helvetica Neue', Arial, sans-serif; }
.nuoang-featured-ym { font-size: 13px; color: #9CA3AF; font-weight: 400; line-height: 1; }
.nuoang-featured-content { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.nuoang-featured-title {
    font-size: 16px;
    font-weight: 600;
    color: #1a1a1a;
    line-height: 1.5;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: -0.01em;
    transition: color 0.25s ease;
}
.nuoang-featured-card:hover .nuoang-featured-title { color: var(--nuoang-primary-color); }
.nuoang-featured-excerpt {
    font-size: 14px;
    font-weight: 400;
    color: #6B7280;
    line-height: 1.5;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nuoang-news-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-flow: column;
    grid-template-rows: repeat(3, 1fr);
    gap: 0;
    background: #f4f6fa;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.04);
}
.nuoang-grid-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    padding: 16px 24px;
    border-right: 1px solid #F3F4F6;
    border-bottom: 1px solid #F3F4F6;
    text-decoration: none;
    transition: background 0.2s ease;
    overflow: hidden;
    min-width: 0;
}
.nuoang-grid-item:nth-child(2n) { border-right: none; }
.nuoang-grid-item:nth-last-child(-n+2) { border-bottom: none; }
.nuoang-grid-item { border-right: none; border-bottom: none; }
.nuoang-grid-item:hover { background: #F8FAFF; }
.nuoang-grid-meta { display: flex; align-items: center; gap: 8px; }
.nuoang-grid-tag { font-size: 13px; color: #4B5563; font-weight: 500; line-height: 1; }
.nuoang-grid-title { font-size: 15px; font-weight: 500; color: #1a1a1a; line-height: 1.5; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; transition: color 0.25s ease; }
.nuoang-grid-item:hover .nuoang-grid-title { color: var(--nuoang-primary-color); }
.nuoang-grid-date { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: #9CA3AF; font-weight: 400; white-space: nowrap; }
.nuoang-grid-date svg { width: 12px; height: 12px; flex-shrink: 0; }

.nuoang-notice-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.nuoang-notice-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-image: url('https://www.kkidc.com/images/new_kkidc/index/trends_bg.jpg');
    background-size: cover;
    background-position: center;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.04);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    text-decoration: none;
    min-height: 130px;
    padding: 0;
}
.nuoang-notice-card:hover { box-shadow: 0 8px 30px rgba(0,0,0,0.08); transform: translateY(-2px); }
.nuoang-notice-tag { position: absolute; top: 0; left: 0; display: inline-block; font-size: 11px; color: #FFFFFF; background: #6B7280; padding: 2px 10px; border-radius: 0 0 6px 0; font-weight: 500; }
.nuoang-notice-title { font-size: 14px; font-weight: 500; color: #1a1a1a; line-height: 1.5; margin: 0; text-align: center; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color 0.25s ease; }
.nuoang-notice-card:hover .nuoang-notice-title { color: var(--nuoang-primary-color); }

@media (max-width: 768px) {
    .nuoang-news-title { font-size: 22px; }
    .nuoang-news-subtitle { font-size: 14px; }
    .nuoang-news-sub-row { flex-direction: column; gap: 8px; }
    .nuoang-news-main { grid-template-columns: 1fr; gap: 20px; }
    .nuoang-front-news-main { grid-template-columns: 1fr !important; gap: 20px !important; }
    .nuoang-featured-thumb { height: 180px; }
    .nuoang-featured-body { padding: 14px 16px; flex-direction: row; gap: 14px; }
    .nuoang-featured-day { font-size: 28px; }
    .nuoang-featured-title { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .nuoang-featured-excerpt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .nuoang-news-grid { grid-template-columns: 1fr; grid-auto-flow: row; grid-template-rows: none; }
    .nuoang-grid-item { border-right: none; border-bottom: 1px solid #F3F4F6; }
    .nuoang-grid-item:last-child { border-bottom: none; }
    .nuoang-grid-title { font-size: 14px; }
    .nuoang-notice-grid { display: flex; grid-template-columns: none; gap: 12px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; scroll-snap-type: x mandatory; padding-bottom: 4px; margin-top: 20px; }
    .nuoang-notice-grid::-webkit-scrollbar { display: none; }
    .nuoang-notice-card { flex: 0 0 60%; min-width: 60%; scroll-snap-align: start; min-height: 100px; }
    .nuoang-notice-img { height: 80px; }
    .nuoang-notice-title { font-size: 12px; }
}

/* ========================================================================== */
.nuoang-cta-section {
    position: relative;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0;
}

.nuoang-cta-bg {
    display: block;
    width: 100%;
    height: 180px;
    overflow: hidden;
    z-index: 0;
}

.nuoang-cta-bg img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nuoang-cta-container {
    position: absolute;
    inset: 0;
    z-index: 1;
    max-width: 1280px;
    margin: 0 auto;
    left: 0;
    right: 0;
    padding: 0 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.nuoang-cta-title {
    font-size: 26px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.01em;
    color: #FFFFFF;
    margin: 0 0 14px 0;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.nuoang-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 30px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
    border-radius: 6px;
    text-decoration: none;
    color: #FFFFFF;
    background: rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.35);
    transition: all 0.3s ease;
}

.nuoang-cta-btn:hover {
    background: rgba(255, 255, 255, 0.28);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

/* 移动端 */
@media (max-width: 768px) {
    .nuoang-cta-bg {
        height: 100px;
    }

    .nuoang-cta-container {
        padding: 0 20px;
    }

    .nuoang-cta-title {
        font-size: 16px;
        margin-bottom: 8px;
    }

    .nuoang-cta-btn {
        padding: 5px 20px;
        font-size: 11px;
    }
}

/* ========================================================================== */
.nuoang-footer {
    background: #F5F8FF;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #1a1a1a;
    width: 100%;
}

.nuoang-footer-features {
    border-bottom: 1px solid #E5E7EB;
    padding: 40px 0;
}
.nuoang-features-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0;
}
.nuoang-feature-item { display: flex; align-items: center; gap: 16px; min-width: 0; position: relative; }
.nuoang-feature-item:first-child { justify-content: flex-start; }
.nuoang-feature-item:last-child { justify-content: flex-end; }
.nuoang-feature-item img { width: 44px; height: 44px; flex-shrink: 0; }
.nuoang-feature-text-wrap { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.nuoang-feature-title { font-size: 16px; font-weight: 400; color: #1a1a1a; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nuoang-feature-sub { font-size: 13px; color: #9CA3AF; font-weight: 400; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.nuoang-footer-main { padding: 48px 0 40px 0; }
.nuoang-footer-main-container { max-width: 1280px; margin: 0 auto; padding: 0 20px; display: flex; align-items: flex-start; justify-content: space-between; gap: 0; }
.nuoang-footer-logo-col { flex: 1 1 0%; min-width: 0; padding-right: 20px; }
.nuoang-footer-logo { margin-bottom: 16px; }
.nuoang-footer-logo img { height: 40px; width: auto; }
.nuoang-footer-desc { font-size: 13px; color: #6B7280; line-height: 1.7; margin: 0 0 20px 0; max-width: 100%; }
.nuoang-footer-social { display: flex; gap: 12px; }
.nuoang-footer-social-icon {
    width: 40px; height: 40px; border-radius: 50%; background: #fff;
    border: none; display: flex; align-items: center; justify-content: center;
    font-size: 18px; color: #4B5563; text-decoration: none;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, color 0.25s ease, background 0.25s ease;
    will-change: transform;
    flex-shrink: 0;
}
.nuoang-footer-social-icon:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(50, 105, 255, 0.25);
    background: #3269ff; color: #fff;
}

.nuoang-footer-nav-wrap { display: flex; flex: 4 1 0%; min-width: 0; flex-direction: column; }
.nuoang-footer-nav-cols { display: flex; flex: none; width: 100%; gap: 0; min-width: 0; }
.nuoang-footer-trust { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-top: 28px; padding: 0 20px; }
.nuoang-footer-trust a { display: block; line-height: 0; }
.nuoang-footer-trust img { display: block; height: 42px; width: auto; }
.nuoang-footer-col { display: flex; flex-direction: column; gap: 0; flex: 1 1 0%; min-width: 0; padding: 0 20px; }
.nuoang-footer-col-title { font-size: 14px; font-weight: 600; color: #1a1a1a; margin: 0 0 16px 0; line-height: 1.4; }
.nuoang-footer-col a { display: block; font-size: 13px; color: #6B7280; text-decoration: none; line-height: 1.5; padding: 6px 0; transition: color 0.2s ease; }
.nuoang-footer-col a:hover { color: #3269ff; }
.nuoang-footer-col .nuoang-footer-menu { list-style: none; margin: 0; padding: 0; }
.nuoang-footer-col .nuoang-footer-menu li { list-style: none; margin: 0; padding: 0; }

.nuoang-footer-contact-col { flex: 1 1 0%; min-width: 0; padding-left: 32px; border-left: 1px solid #E5E7EB; display: flex; flex-direction: column; gap: 0; }
.nuoang-footer-contact-col .nuoang-footer-col-title { margin-bottom: 16px; }
.nuoang-footer-contact-item { font-size: 13px; color: #6B7280; line-height: 1.5; padding: 6px 0; }
.nuoang-footer-contact-label { color: #1a1a1a; }
.nuoang-footer-contact-item strong { color: #1a1a1a; font-weight: 600; }
.nuoang-footer-contact-col .nuoang-footer-social { margin-top: 16px; position: relative; }
.nuoang-footer-social-qr-mobile { display: none; }
.nuoang-footer-social-item { position: relative; display: inline-block; }
.nuoang-footer-social-qr-popup {
    position: absolute;
    bottom: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%);
    width: 130px;
    padding: 10px;
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
    z-index: 10;
    text-align: center;
}
.nuoang-footer-social-qr-popup::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: #fff;
    filter: drop-shadow(0 1px 0 #E5E7EB);
}
.nuoang-footer-social-qr-popup img { width: 100%; height: auto; border-radius: 4px; }
.nuoang-footer-social-qr-label { display: block; margin-top: 6px; font-size: 12px; color: #6B7280; line-height: 1.4; }
.nuoang-footer-social-item:hover .nuoang-footer-social-qr-popup {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(-4px);
}
.nuoang-footer-qr-row { display: flex; gap: 16px; margin-top: 8px; }
.nuoang-footer-qr-item { display: flex; flex-direction: column; align-items: center; gap: 6px; position: relative; }
.nuoang-footer-qr-item img { width: 72px; height: 72px; border: 1px solid #E5E7EB; border-radius: 6px; cursor: pointer; }
.nuoang-footer-qr-preview {
    display: none;
    position: absolute;
    bottom: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%);
    width: 160px;
    height: 160px;
    border: 1px solid #E5E7EB;
    border-radius: 6px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
    z-index: 100;
}
.nuoang-footer-qr-preview::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: #fff;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.1));
}
.nuoang-footer-qr-preview img { width: 100%; height: 100%; border: none; border-radius: 6px; object-fit: contain; }
.nuoang-footer-qr-item:hover .nuoang-footer-qr-preview { display: block; }
.nuoang-footer-qr-label { font-size: 11px; color: #9CA3AF; }

.nuoang-footer-bottom { border-top: 1px solid #E5E7EB; padding: 20px 0; }
.nuoang-footer-bottom-container { max-width: 1280px; margin: 0 auto; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.nuoang-footer-copyright { font-size: 13px; color: #1a1a1a; line-height: 1.8; }
.nuoang-footer-legal-links { display: flex; align-items: center; gap: 16px; font-size: 13px; color: #1a1a1a; }
.nuoang-footer-legal-sep { width: 1px; height: 13px; background: #D1D5DB; }
.nuoang-footer-beian { display: flex; align-items: center; gap: 6px; }
.nuoang-footer-beian img { width: 16px; height: 16px; flex-shrink: 0; }

@media (max-width: 1024px) {
    .nuoang-footer-main-container { flex-wrap: wrap; gap: 32px; }
    .nuoang-footer-nav-wrap { flex: 3 1 0%; }
    .nuoang-footer-contact-col { flex: 1 1 0%; padding-left: 32px; }
    .nuoang-features-container { flex-wrap: wrap; gap: 16px; justify-content: center; }
    .nuoang-feature-item { flex: 1 1 45%; justify-content: center; }
    .nuoang-feature-item:first-child,
    .nuoang-feature-item:last-child { justify-content: center; }
}
@media (max-width: 768px) {
    .nuoang-footer-features { padding: 16px 0; }
    .nuoang-features-container { display: flex; flex-wrap: nowrap; gap: 8px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 0 16px; }
    .nuoang-features-container::-webkit-scrollbar { display: none; }
    .nuoang-feature-item { flex-direction: column; text-align: center; gap: 6px; flex: 1; min-width: 80px; }
    .nuoang-feature-item img { width: 28px; height: 28px; }
    .nuoang-feature-title { font-size: 12px; }
    .nuoang-feature-sub { display: none; }
    .nuoang-footer-main { padding: 0 0 24px 0; }
    .nuoang-footer-main-container { flex-direction: column; align-items: stretch; gap: 0; }
    .nuoang-footer-nav-wrap { width: 100%; flex: none; }
    .nuoang-footer-nav-cols { flex-direction: column; gap: 0; width: 100%; flex: none; }
    .nuoang-footer-trust { display: none; }
    .nuoang-footer-nav-cols .nuoang-footer-col { padding: 0 20px; gap: 0; border-bottom: 1px solid #E5E7EB; margin: 0 -20px; }
    .nuoang-footer-nav-cols .nuoang-footer-col > .nuoang-footer-col-title,
    .nuoang-footer-nav-cols .nuoang-footer-col > a,
    .nuoang-footer-nav-cols .nuoang-footer-col > .nuoang-footer-menu { display: none; }
    .nuoang-footer-details { display: block; }
    .nuoang-footer-summary {
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 0;
        font-size: 15px;
        font-weight: 400;
        cursor: pointer;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
    }
    .nuoang-footer-summary::-webkit-details-marker { display: none; }
    .nuoang-footer-summary::after {
        content: '';
        width: 8px;
        height: 8px;
        border-right: 1.5px solid #9CA3AF;
        border-bottom: 1.5px solid #9CA3AF;
        transform: rotate(45deg) translateY(-1px);
        transition: transform 0.3s ease;
        flex-shrink: 0;
    }
    .nuoang-footer-details[open] .nuoang-footer-summary::after { transform: rotate(-135deg); }
    .nuoang-footer-details[open] .nuoang-footer-summary { border-bottom: 1px solid #E5E7EB; margin: 0 -20px; padding-left: 20px; padding-right: 20px; }
    .nuoang-footer-details-content {
        background: #f0f2f5;
        margin: 0 -20px;
        padding: 8px 20px 14px;
    }
    .nuoang-footer-details-content a { display: block; padding: 8px 0; font-size: 13px; color: #6B7280; text-decoration: none; }
    .nuoang-footer-details-content a:hover { color: #3269ff; }
    .nuoang-footer-details-content .nuoang-footer-menu { list-style: none; margin: 0; padding: 0; }
    .nuoang-footer-details-content .nuoang-footer-menu li { list-style: none; margin: 0; padding: 0; }
    .nuoang-footer-contact-col { gap: 0; width: 100%; margin: 0 -20px; padding: 0 20px; border-left: none; }
    .nuoang-footer-contact-col .nuoang-footer-col-title { padding: 12px 0 8px 0; font-size: 15px; font-weight: 400; margin-bottom: 0; margin-top: 0; }
    .nuoang-footer-contact-item { font-size: 13px; line-height: 1.4; padding: 6px 0; }
    .nuoang-footer-contact-item strong { font-weight: 400; }
    .nuoang-footer-social-desktop { display: none; }
    .nuoang-footer-social-qr-mobile {
        display: flex;
        gap: 16px;
        margin-top: 12px;
        flex-wrap: wrap;
    }
    .nuoang-footer-qr-item-mobile {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
    }
    .nuoang-footer-qr-item-mobile img {
        width: 80px;
        height: 80px;
        border: 1px solid #E5E7EB;
        border-radius: 6px;
        object-fit: contain;
    }
    .nuoang-footer-qr-item-mobile span {
        font-size: 12px;
        color: #6B7280;
    }
    .nuoang-footer-bottom { padding: 16px 0; }
    .nuoang-footer-bottom-container { flex-direction: column; text-align: center; gap: 12px; align-items: center; }
    .nuoang-footer-copyright { text-align: center; }
    .nuoang-footer-legal-links { flex-wrap: wrap; justify-content: center; gap: 12px; }
}

/* ==========================================================================
   Hero Banner Section (华为云风格首屏轮播)
   ========================================================================== */

/* Banner 入场动画：页面加载即播放，不依赖 IntersectionObserver */
.banner-reveal .nuoang-hero-slide-content > *,
.banner-reveal .nuoang-hero-hero-pagination-wrap,
.banner-reveal .nuoang-hero-hero-bottom-bar {
    opacity: 0;
    transform: translateY(20px);
}
.banner-reveal.is-loaded .nuoang-hero-banner-slide.is-active .nuoang-hero-slide-content > *,
.banner-reveal.is-loaded .nuoang-hero-hero-pagination-wrap,
.banner-reveal.is-loaded .nuoang-hero-hero-bottom-bar {
    animation: banner-fade-up 0.6s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}
.banner-reveal.is-loaded .nuoang-hero-banner-slide.is-active .nuoang-hero-slide-content > *:nth-child(1) { animation-delay: 0.1s; }
.banner-reveal.is-loaded .nuoang-hero-banner-slide.is-active .nuoang-hero-slide-content > *:nth-child(2) { animation-delay: 0.25s; }
.banner-reveal.is-loaded .nuoang-hero-banner-slide.is-active .nuoang-hero-slide-content > *:nth-child(3) { animation-delay: 0.4s; }
.banner-reveal.is-loaded .nuoang-hero-banner-slide.is-active .nuoang-hero-slide-content > *:nth-child(4) { animation-delay: 0.55s; }
.banner-reveal.is-loaded .nuoang-hero-hero-pagination-wrap { animation-delay: 0.5s; }
.banner-reveal.is-loaded .nuoang-hero-hero-bottom-bar { animation-delay: 0.7s; }
@keyframes banner-fade-up {
    to { opacity: 1; transform: translateY(0); }
}

.nuoang-hero-hero-section {
    --hero-pad-top: 72px;
    --hero-pad-bottom: 82px;
    position: relative;
    width: 100%;
    height: 580px;
    padding-top: var(--hero-pad-top);
    padding-bottom: var(--hero-pad-bottom);
    overflow: hidden;
    background: #F5F7FB;
    display: flex;
    align-items: center;
}

/* 彻底移除遮罩，还原高清纯净质感 */
.nuoang-hero-hero-section::before {
    display: none;
}

/* 背景视频全屏铺满，标准居中对齐还原华为云真实视角 */
.nuoang-hero-hero-video-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    z-index: 0;
    pointer-events: none;
    opacity: 1;
}

/* 2. 中间活动内容容器：在导航栏与底栏之间的可视区域内严格垂直居中 */
.nuoang-hero-hero-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

/* Banner 轮播容器 */
.nuoang-hero-banner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.nuoang-hero-banner-slides {
    position: relative;
    width: 100%;
    height: 100%;
}

/* 单个 slide：默认隐藏，active 时淡入 */
.nuoang-hero-banner-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-top: var(--hero-pad-top);
    padding-bottom: var(--hero-pad-bottom);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s ease, visibility 0.6s ease;
    pointer-events: none;
}

.nuoang-hero-banner-slide.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* 背景：视频/图片全屏铺满 */
.nuoang-hero-banner-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    z-index: 0;
    pointer-events: none;
}

/* 内容容器：在 slide 内居中，宽度与全局一致 */
.nuoang-hero-banner-slide .nuoang-hero-hero-container {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

/* 文字内容区域 */
.nuoang-hero-slide-content {
    width: 100%;
    max-width: 720px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    text-align: left;
    position: relative;
    z-index: 2;
}

/* 顶部徽章 */
.nuoang-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    border-radius: 30px;
    background: rgba(2, 36, 253, 0.08);
    border: 1px solid rgba(2, 36, 253, 0.22);
    color: #3269ff;
    font-size: 13px;
    font-weight: 600;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 2px 10px rgba(2, 36, 253, 0.06);
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    margin: 0 0 14px 0;
}

.nuoang-hero-badge i {
    font-size: 14px;
    color: #3269ff;
}

/* 轮播主标题 */
.nuoang-hero-slide-title {
    font-size: 38px;
    line-height: 1.28;
    font-weight: 700;
    color: #1a1a1a;
    letter-spacing: -0.02em;
    text-shadow: none;
    margin: 0 0 12px 0;
    white-space: nowrap;
}

.nuoang-hero-gradient-text {
    background: linear-gradient(135deg, #3269ff 0%, #007DFA 60%, #00C4FF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

/* 描述文字 */
.nuoang-hero-slide-desc {
    font-size: 16px;
    line-height: 1.65;
    color: #6B7280;
    max-width: 580px;
    text-shadow: none;
    margin: 0 0 24px 0;
}

/* 按钮组 */
.nuoang-hero-btn-group {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin: 0;
}

/* 3. 分页指示胶囊（居中对齐，浮于底部卡片上方） */
.nuoang-hero-hero-pagination-wrap {
    position: absolute;
    bottom: 96px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0;
    padding: 5px 12px;
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: 20px;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 8px rgba(0, 4, 30, 0.03);
    width: fit-content;
    z-index: 15;
}

.nuoang-hero-pag-dot {
    position: relative;
    width: 8px;
    height: 5px;
    border-radius: 6px;
    background: rgba(0, 4, 30, 0.18);
    cursor: pointer;
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.3s ease;
    overflow: hidden;
}

.nuoang-hero-pag-dot:hover {
    background: rgba(2, 36, 253, 0.4);
}

.nuoang-hero-pag-dot.is-active {
    width: 36px;
    background: rgba(2, 36, 253, 0.18);
}

.nuoang-hero-pag-progress {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #3269ff 0%, #007DFA 100%);
    border-radius: 6px;
}

/* 4. 华为云风格底部 4 特色卡片（桌面端绝对定位贴底，高度固定 82px，毛玻璃融合） */
.nuoang-hero-hero-bottom-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 82px;
    z-index: 10;
    background: rgba(255, 255, 255, 0.42);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-top: 1px solid rgba(255, 255, 255, 0.65);
    box-shadow: 0 -4px 20px rgba(0, 4, 30, 0.02);
}

.nuoang-hero-hero-bottom-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
    height: 100%;
}

.nuoang-hero-hero-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 0;
    padding: 0;
    list-style: none;
    height: 100%;
}

.nuoang-hero-card-item {
    position: relative;
    height: 100%;
    padding: 0 20px;
    cursor: pointer;
    text-align: left;
    transition: all 0.25s ease;
    background: transparent;
    border: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    text-decoration: none;
    user-select: none;
    gap: 12px;
}

.nuoang-hero-card-icon {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.25s ease;
}
.nuoang-hero-card-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.nuoang-hero-card-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

/* 移除顶部蓝色横条 hover 效果 */
.nuoang-hero-card-item::before {
    display: none;
}

.nuoang-hero-card-item:hover {
    background: rgba(255, 255, 255, 0.58);
}

.nuoang-hero-card-title {
    font-size: 15px;
    font-weight: 600;
    color: #1a1a1a;
    margin-bottom: 3px;
    transition: color 0.25s ease;
    line-height: 1.35;
}

.nuoang-hero-card-item:hover .nuoang-hero-card-title {
    color: #3269ff;
}

.nuoang-hero-card-desc {
    font-size: 12px;
    color: #6B7280;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    transition: color 0.25s ease;
}

.nuoang-hero-card-item:hover .nuoang-hero-card-desc {
    color: #4B5563;
}

/* 5. 响应式与移动端深度适配 */
@media (max-width: 1399px) and (min-width: 1200px) {
    .nuoang-hero-slide-title {
        font-size: 34px;
    }
}

@media (max-width: 1199px) and (min-width: 992px) {
    .nuoang-hero-hero-section {
        height: 520px;
    }
    .nuoang-hero-slide-title {
        font-size: 30px;
    }
    .nuoang-hero-slide-desc {
        font-size: 14px;
        margin-bottom: 20px;
    }
}

@media (max-width: 991px) {
    .nuoang-hero-hero-section {
        position: relative;
        width: 100%;
        height: 520px;
        --hero-pad-top: 56px;
        --hero-pad-bottom: 136px;
        padding-top: var(--hero-pad-top);
        padding-bottom: var(--hero-pad-bottom);
        display: flex;
        align-items: center;
        background: #F5F7FB;
    }
    .nuoang-hero-hero-section::before {
        display: none;
    }
    .nuoang-hero-hero-video-bg {
        object-position: center top;
        opacity: 1;
    }
    .nuoang-hero-hero-container {
        width: 100%;
        padding: 0 20px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        position: relative;
    }
    .nuoang-hero-banner-slide {
        padding-top: var(--hero-pad-top);
        padding-bottom: var(--hero-pad-bottom);
    }
    .nuoang-hero-badge {
        font-size: 12px;
        padding: 5px 12px;
        margin-bottom: 10px;
        white-space: normal;
        line-height: 1.4;
    }
    .nuoang-hero-slide-title {
        font-size: 24px;
        line-height: 1.3;
        margin-bottom: 10px;
        white-space: normal;
    }
    .nuoang-hero-slide-desc {
        font-size: 14px;
        line-height: 1.6;
        margin-bottom: 16px;
        max-width: 100%;
    }
    .nuoang-hero-btn-group {
        margin: 0;
    }
    .nuoang-hero-slide-content .nuoang-btn.primary-btn,
    .nuoang-hero-slide-content .nuoang-btn.outline-btn {
        padding: 8px 16px;
        font-size: 13px;
        line-height: 1.2;
        height: auto;
        min-height: 34px;
    }
    .nuoang-hero-hero-pagination-wrap {
        position: absolute;
        bottom: 150px;
        left: 50%;
        transform: translateX(-50%);
        margin: 0;
        padding: 4px 10px;
        align-self: center;
        justify-content: center;
        z-index: 15;
    }
    .nuoang-hero-hero-bottom-bar {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: auto;
        background: rgba(255, 255, 255, 0.5);
        backdrop-filter: blur(20px) saturate(180%);
        -webkit-backdrop-filter: blur(20px) saturate(180%);
        border-top: 1px solid rgba(255, 255, 255, 0.65);
        box-shadow: 0 -4px 20px rgba(0, 4, 30, 0.02);
        padding: 0;
        margin-top: 0;
        z-index: 10;
    }
    .nuoang-hero-hero-bottom-container {
        padding: 0;
        height: auto;
    }
    .nuoang-hero-hero-cards {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0;
        height: auto;
    }
    .nuoang-hero-card-item {
        height: auto;
        padding: 14px 16px;
        border-radius: 0;
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: none;
        box-shadow: none;
        align-items: flex-start;
        text-align: left;
    }
    .nuoang-hero-card-item:hover {
        background: transparent;
    }
    /* 全宽通栏 + 发丝分割线：中缝竖线、中缝横线 */
    .nuoang-hero-card-item:nth-child(odd) {
        border-right: 1px solid rgba(0, 4, 30, 0.08);
    }
    .nuoang-hero-card-item:nth-child(-n+2) {
        border-bottom: 1px solid rgba(0, 4, 30, 0.08);
    }
    .nuoang-hero-card-item::before {
        display: none;
    }
    .nuoang-hero-card-icon {
        display: none;
    }
    .nuoang-hero-card-title {
        font-size: 14px;
        margin-bottom: 3px;
    }
    .nuoang-hero-card-desc {
        font-size: 11px;
        white-space: normal;
        line-height: 1.35;
    }
}

@media (max-width: 575px) {
    .nuoang-hero-hero-section {
        height: 420px;
        --hero-pad-top: 56px;
        --hero-pad-bottom: 120px;
        padding-top: var(--hero-pad-top);
        padding-bottom: var(--hero-pad-bottom);
    }
    .nuoang-hero-hero-container {
        padding: 0 20px;
    }
    .nuoang-hero-banner-slide {
        padding-top: var(--hero-pad-top);
        padding-bottom: var(--hero-pad-bottom);
    }
    .nuoang-hero-badge {
        padding: 4px 10px;
        font-size: 11px;
        margin-bottom: 8px;
        gap: 5px;
    }
    .nuoang-hero-badge i {
        font-size: 11px;
    }
    .nuoang-hero-slide-title {
        font-size: 20px;
        line-height: 1.3;
        margin-bottom: 8px;
        white-space: normal;
    }
    .nuoang-hero-slide-desc {
        font-size: 12px;
        line-height: 1.55;
        margin-bottom: 14px;
    }
    .nuoang-hero-hero-pagination-wrap {
        bottom: 140px;
        margin: 0;
        padding: 3px 8px;
        align-self: center;
    }
    .nuoang-hero-pag-dot {
        width: 6px;
        height: 4px;
    }
    .nuoang-hero-pag-dot.is-active {
        width: 24px;
    }
    .nuoang-hero-hero-bottom-container {
        padding: 0;
    }
    .nuoang-hero-hero-cards {
        gap: 0;
    }
    .nuoang-hero-card-item {
        padding: 10px 14px;
    }
    .nuoang-hero-card-title {
        font-size: 12px;
    }
    .nuoang-hero-card-desc {
        font-size: 10px;
    }
}

/* ==========================================================================
   签发流程 Section（5步卡片 + 箭头连接）
   ========================================================================== */
.nuoang-flow-section {
    background: #F5F7FA;
    width: 100%;
    padding-top: var(--module-py);
    padding-bottom: var(--module-py);
}

.nuoang-flow-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

.nuoang-flow-header {
    text-align: center;
    margin-bottom: var(--module-header-mb);
}

.nuoang-flow-title {
    font-family: Inter, sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
    margin: 0 0 12px 0;
    letter-spacing: -0.01em;
}

.nuoang-flow-subtitle {
    font-family: Inter, sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #6B7280;
    line-height: 1.6;
    margin: 0;
}

.nuoang-flow-steps {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
}

.nuoang-flow-step {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
}

.nuoang-flow-step-top {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 20px;
    position: relative;
}

.nuoang-flow-step-icon {
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    z-index: 1;
}

.nuoang-flow-step:hover .nuoang-flow-step-icon {
    transform: translateY(-4px);
}

.nuoang-flow-step-num {
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), color 0.35s ease;
}

.nuoang-flow-step:hover .nuoang-flow-step-num {
    transform: translateY(-3px);
}

.nuoang-flow-step-title {
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), color 0.35s ease;
}

.nuoang-flow-step:hover .nuoang-flow-step-title {
    transform: translateY(-3px);
    color: #2450ff;
}

.nuoang-flow-step-desc {
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), color 0.35s ease;
}

.nuoang-flow-step:hover .nuoang-flow-step-desc {
    transform: translateY(-3px);
    color: #6B7280;
}

.nuoang-flow-step-icon img {
    width: 72px;
    height: 72px;
    object-fit: contain;
}

.nuoang-flow-step-line {
    position: absolute;
    left: calc(50% + 48px);
    right: calc(-50% + 8px);
    top: 50%;
    height: 1px;
    background: repeating-linear-gradient(
        to right,
        #D1D5DB 0,
        #D1D5DB 5px,
        transparent 5px,
        transparent 10px
    );
    z-index: 0;
}

.nuoang-flow-step-line-last {
    display: none;
}

.nuoang-flow-step-body {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.nuoang-flow-step-num {
    font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    font-size: 28px;
    font-weight: 700;
    color: #2450ff;
    line-height: 1;
    margin-bottom: 10px;
    letter-spacing: -0.01em;
}

.nuoang-flow-step-title {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 8px 0;
    line-height: 1.4;
}

.nuoang-flow-step-desc {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #9CA3AF;
    margin: 0;
    line-height: 1.6;
}

@media (max-width: 1024px) {
    .nuoang-flow-steps {
        flex-direction: column;
        gap: 32px;
    }

    .nuoang-flow-step {
        flex-direction: column;
        align-items: center;
        text-align: center;
        width: 100%;
        max-width: 500px;
        margin: 0 auto;
    }

    .nuoang-flow-step-top {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width: auto;
        margin-bottom: 10px;
        margin-right: 0;
        gap: 12px;
    }

    .nuoang-flow-step-line {
        display: none;
    }

    .nuoang-flow-step-body {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 10px;
        flex-wrap: wrap;
        padding: 0;
    }

    .nuoang-flow-step-num {
        margin-bottom: 0;
    }

    .nuoang-flow-step-title {
        margin: 0;
    }

    .nuoang-flow-step-desc {
        width: 100%;
        margin-top: 8px;
    }
}

@media (max-width: 768px) {
    .nuoang-flow-title {
        font-size: 24px;
    }

    .nuoang-flow-subtitle {
        font-size: 14px;
    }

    .nuoang-flow-step-icon {
        width: 56px;
        height: 56px;
    }

    .nuoang-flow-step-icon img {
        width: 56px;
        height: 56px;
    }

    .nuoang-flow-step-num {
        font-size: 22px;
    }

    .nuoang-flow-step-title {
        font-size: 16px;
    }

    .nuoang-flow-step-desc {
        font-size: 12px;
    }
}

/* ==========================================================================
   解决方案 Section（行业 Tab 切换 + 案例卡片）
   ========================================================================== */
.nuoang-solution-section {
    background: #FFFFFF;
    width: 100%;
    padding-top: var(--module-py);
    padding-bottom: var(--module-py);
    position: relative;
    overflow: hidden;
}

.nuoang-solution-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: blur(8px);
    transform: scale(1.05);
    opacity: 0.85;
    z-index: 0;
    transition: background-image 0.6s ease;
}

.nuoang-solution-section::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.55);
    z-index: 0;
}

.nuoang-solution-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 1;
}

.nuoang-solution-header {
    text-align: center;
    margin-bottom: var(--module-header-mb);
}

.nuoang-solution-title {
    font-family: Inter, sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
    margin: 0 0 12px 0;
    letter-spacing: -0.01em;
}

.nuoang-solution-accent {
    color: var(--nuoang-primary-color);
}

.nuoang-solution-subtitle {
    font-family: Inter, sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #6B7280;
    line-height: 1.6;
    margin: 0;
}

.nuoang-solution-tabs {
    display: flex;
    justify-content: center;
    gap: 80px;
    margin-bottom: 32px;
    border-bottom: 1px solid #E5E7EB;
    position: relative;
}

.nuoang-solution-tab {
    padding: 12px 24px;
    font-family: Inter, sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #6B7280;
    background: none;
    border: none;
    cursor: pointer;
    transition: color 0.25s ease;
    margin-bottom: -1px;
    position: relative;
    z-index: 1;
}

.nuoang-solution-tab:hover {
    color: #1a1a1a;
}

.nuoang-solution-tab.active {
    color: var(--nuoang-primary-color);
    font-weight: 600;
}

.nuoang-solution-tab-indicator {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 1px;
    height: 2px;
    background: var(--nuoang-primary-color);
    z-index: 0;
    transform: translateX(0) scaleX(0);
    transform-origin: left center;
    will-change: transform;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.nuoang-solution-card {
    display: flex;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
}

.nuoang-solution-card-image {
    flex: 0 0 50%;
    overflow: hidden;
    background: transparent;
    padding: 20px;
}

.nuoang-solution-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 6px;
}

/* ==========================================================================
   prefers-reduced-motion: 为需要减少动效的用户禁用动画
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ==========================================================================
   404 Page
   ========================================================================== */
.nuoang-404-page { min-height: 60vh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 100px 20px; }
.nuoang-404-container { max-width: 600px; }
.nuoang-404-title { font-size: 80px; font-weight: 800; color: var(--nuoang-primary-color, #3269ff); margin-bottom: 20px; line-height: 1; }
.nuoang-404-subtitle { font-size: 24px; font-weight: 600; color: #00041E; margin-bottom: 15px; }
.nuoang-404-desc { font-size: 15px; color: #666; margin-bottom: 30px; line-height: 1.6; }
.nuoang-404-actions { display: flex; gap: 15px; justify-content: center; }
.nuoang-404-actions .nuoang-btn { padding: 12px 30px; border-radius: 6px; }

/* ==========================================================================
   Search Result Page
   ========================================================================== */
.search-result-section { margin-bottom: 40px; }
.search-result-heading { font-size: 20px; font-weight: 600; color: #111827; margin-bottom: 20px; display: flex; align-items: center; gap: 8px; }
.search-result-count { font-size: 14px; font-weight: 400; color: #9CA3AF; }
.search-product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
@media (max-width: 1024px) {
    .search-product-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
    .search-product-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
}

.nuoang-solution-card-info {
    flex: 1;
    padding: 36px 40px;
    display: flex;
    flex-direction: column;
}

.nuoang-solution-company {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.nuoang-solution-company-logo {
    height: 32px;
    width: auto;
    display: block;
    flex-shrink: 0;
}

.nuoang-solution-company-meta {
    display: flex;
    flex-direction: column;
}

.nuoang-solution-company-name {
    font-family: Inter, sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
}

.nuoang-solution-company-tagline {
    font-family: Inter, sans-serif;
    font-size: 13px;
    color: #9CA3AF;
    font-weight: 400;
}

.nuoang-solution-desc {
    font-family: Inter, sans-serif;
    font-size: 14px;
    color: #6B7280;
    line-height: 1.7;
    margin: 0 0 20px 0;
}

.nuoang-solution-products {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.nuoang-solution-products-label {
    font-family: Inter, sans-serif;
    font-size: 13px;
    color: #1a1a1a;
    font-weight: 500;
    flex-shrink: 0;
}

.nuoang-solution-product-list {
    display: flex;
    gap: 12px;
}

.nuoang-solution-product {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #F0F5FF;
    border-radius: 6px;
    font-family: Inter, sans-serif;
    font-size: 13px;
    color: var(--nuoang-primary-color);
    font-weight: 500;
}

.nuoang-solution-product svg {
    width: 16px;
    height: 16px;
}

.nuoang-solution-features {
    list-style: none;
    padding: 0;
    margin: 0 0 24px 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.nuoang-solution-feature {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-family: Inter, sans-serif;
    font-size: 14px;
    color: #4B5563;
    line-height: 1.5;
}

.nuoang-solution-feature-check {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--nuoang-primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 1px;
}

.nuoang-solution-feature-check svg {
    width: 11px;
    height: 11px;
    color: #fff;
}

.nuoang-solution-actions {
    display: flex;
    gap: 12px;
    margin-top: auto;
}

.nuoang-solution-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 20px;
    border-radius: 0;
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.25s ease;
}

.nuoang-solution-btn-primary {
    background: var(--nuoang-primary-color);
    color: #fff;
    border: 1px solid var(--nuoang-primary-color);
}

.nuoang-solution-btn-primary:hover {
    background: #2574e5;
    border-color: #2574e5;
}

.nuoang-solution-btn-outline {
    background: transparent;
    color: var(--nuoang-primary-color);
    border: 1px solid var(--nuoang-primary-color);
}

.nuoang-solution-btn-outline:hover {
    background: #F0F5FF;
}

@media (max-width: 1024px) {
    .nuoang-solution-card {
        flex-direction: column;
    }

    .nuoang-solution-card-image {
        flex: 0 0 240px;
        height: 240px;
    }

    .nuoang-solution-card-info {
        padding: 24px 28px;
    }
}

@media (max-width: 768px) {
    .nuoang-solution-title {
        font-size: 24px;
    }

    .nuoang-solution-subtitle {
        font-size: 14px;
    }

    .nuoang-solution-tabs {
        overflow: visible;
        justify-content: center;
        padding-bottom: 0;
        gap: 20px;
        flex-wrap: wrap;
    }

    .nuoang-solution-tab {
        padding: 10px 12px;
        font-size: 14px;
        white-space: nowrap;
    }

    .nuoang-solution-card-image {
        flex: 0 0 220px;
        height: 220px;
    }

    .nuoang-solution-card-info {
        padding: 20px;
    }

    .nuoang-solution-company-name {
        font-size: 16px;
    }

    .nuoang-solution-desc {
        font-size: 13px;
    }

    .nuoang-solution-actions {
        flex-direction: row;
        gap: 10px;
    }

    .nuoang-solution-btn {
        flex: 1;
        text-align: center;
        justify-content: center;
        padding: 6px 12px;
    }
}

/* ===== Anchor Navigation ===== */
.nuoang-anchor-nav {
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #E5E7EB;
    position: sticky;
    top: 0;
    z-index: 998;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
    transition: box-shadow 0.25s ease;
}
body.admin-bar .nuoang-anchor-nav {
    top: 32px;
}
@media screen and (max-width: 782px) {
    body.admin-bar .nuoang-anchor-nav {
        top: 46px;
    }
}

.nuoang-anchor-nav-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: flex-start; /* 没接管（未吸顶）时显示在左侧 */
    align-items: center;
    gap: 64px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    position: relative;
}
.nuoang-anchor-nav-inner::-webkit-scrollbar {
    display: none;
}
.nuoang-anchor-nav.is-sticky {
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}
.nuoang-anchor-nav.is-sticky .nuoang-anchor-nav-inner {
    justify-content: center; /* 吸顶接管后居中显示，不满五个项自动弹性均等居中 */
    gap: clamp(28px, 5vw, 84px);
}
.nuoang-anchor-nav-item {
    padding: 16px 0;
    font-size: 15px;
    color: #6B7280;
    text-decoration: none;
    white-space: nowrap;
    position: relative;
    transition: color 0.25s ease;
    font-weight: 500;
    cursor: pointer;
    flex-shrink: 0;
}
.nuoang-anchor-nav-item:hover {
    color: #1a1a1a;
}
.nuoang-anchor-nav-item.active {
    color: var(--nuoang-primary-color, #0224FD);
    font-weight: 600;
}

/* 锚点导航滑动激活指示条（全局保障） */
.nuoang-anchor-indicator {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 24px;
    height: 2px;
    background: var(--nuoang-primary-color, #0224FD);
    border-radius: 6px;
    pointer-events: none;
    transition: left 0.4s cubic-bezier(0.16, 1, 0.3, 1), width 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    transform: translateX(-50%);
    opacity: 0;
    z-index: 2;
}
.nuoang-anchor-indicator.is-ready {
    opacity: 1;
    transition: opacity 0.3s ease, left 0.4s cubic-bezier(0.16, 1, 0.3, 1), width 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

@media (max-width: 768px) {
    .nuoang-anchor-nav-inner {
        padding: 0 16px;
        gap: 20px;
        justify-content: center;
    }
    .nuoang-anchor-nav.is-sticky .nuoang-anchor-nav-inner {
        justify-content: center;
        gap: 20px;
    }
    .nuoang-anchor-nav-item {
        font-size: 13px;
        padding: 12px 0;
    }
}