/* LRGB滤镜产品详情页样式 - 完整版 */

/* ========== CSS变量扩展 ========== */
:root {
    --filter-l-color: #888888;
    --filter-r-color: #e04156;
    --filter-g-color: #27c18a;
    --filter-b-color: #1cb5e0;
    --filter-ha-color: #DC143C;
    --filter-sii-color: #8B0000;
    --filter-oiii-color: #00CED1;
}

/* ========== 页面布局样式 ========== */
.page-wrapper {
    background: linear-gradient(180deg, #f8fafb 0%, #f3f6f9 100%);
    min-height: 100vh;
}

.atf_portfolio__details-area {
    padding: 40px 0;
}

.atf_portfolio__details-area .container {
    background-color: #ffffff;
    border-radius: 24px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
    padding: 40px;
    margin-top: 20px;
    margin-bottom: 20px;
}

/* ========== 基础样式 ========== */
.filter-product-details {
    font-family: var(--thm-font);
    color: var(--thm-p);
    line-height: 1.6;
    position: relative;
    background-color: transparent;
}

.filter-product-details * {
    box-sizing: border-box;
}

/* ========== 悬浮导航样式 ========== */
.filter-floating-nav {
    position: fixed;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1000;
    transition: all 0.3s ease;
}

.filter-floating-nav .nav-toggle {
    position: absolute;
    left: 0;
    top: 0;
    width: auto;
    padding: 12px 16px;
    background: var(--thm-line);
    border: none;
    border-radius: 0 8px 8px 0;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
    font-size: 14px;
    font-weight: 500;
    animation: pulse 2s infinite;
}

.filter-floating-nav .nav-toggle:hover {
    background: var(--thm-base);
    padding-right: 20px;
}

.filter-floating-nav.active .nav-toggle .nav-text {
    opacity: 0;
    width: 0;
    overflow: hidden;
}

.filter-floating-nav .nav-content {
    position: relative;
    background: #fff;
    border-radius: 0 12px 12px 0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    padding: 20px;
    padding-right: 40px;
    padding-bottom: 30px;
    width: 240px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-100%);
    transition: all 0.3s ease;
}

.filter-floating-nav.active .nav-content {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.filter-floating-nav .nav-close {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 30px;
    height: 30px;
    background: var(--thm-f6);
    border: none;
    border-radius: 50%;
    color: var(--thm-gray);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.filter-floating-nav .nav-close:hover {
    background: var(--thm-base);
    color: #fff;
}

.filter-floating-nav h3 {
    font-size: 16px;
    font-weight: 600;
    color: var(--thm-black);
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--thm-f6);
}

.filter-floating-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.filter-floating-nav li {
    margin-bottom: 8px;
}

.filter-floating-nav .nav-link {
    display: block;
    padding: 8px 12px;
    color: var(--thm-p);
    text-decoration: none;
    border-radius: 6px;
    font-size: 14px;
    transition: all 0.3s ease;
    position: relative;
}

.filter-floating-nav .nav-link:hover,
.filter-floating-nav .nav-link.active {
    background: var(--thm-f6);
    color: var(--thm-base);
}

.filter-floating-nav .nav-divider {
    height: 1px;
    background: var(--thm-f3);
    margin: 20px 0;
}

.filter-floating-nav .manual-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: linear-gradient(135deg, var(--thm-base), var(--thm-color));
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.filter-floating-nav .manual-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* ========== 产品区块样式 ========== */
.product-section {
    background-color: #ffffff;
    padding: 60px;
    border-radius: 16px;
    margin-bottom: 30px;
    scroll-margin-top: 100px;
}

/* 英雄区域 */
.hero-section {
    text-align: center;
    margin-bottom: 60px;
}

.product-title {
    font-size: 48px;
    font-weight: 700;
    background: linear-gradient(135deg, var(--thm-black), var(--thm-base));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 20px;
    line-height: 1.2;
}

.product-subtitle {
    font-size: 20px;
    color: var(--thm-gray);
    max-width: 800px;
    margin: 0 auto;
}

/* 主产品图片 */
.main-product-image {
    text-align: center;
    margin-bottom: 40px;
}

/* 主产品图片 - 兼容 picture 标签和 img 标签 */
.main-product-image img,
.main-product-image picture,
.main-product-image .img-fluid {
    max-width: 100%;
    height: auto;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
    cursor: zoom-in;
    transition: transform 0.3s ease;
    display: block;
}

/* picture 标签内的 img 继承样式 */
.main-product-image picture img {
    max-width: 100%;
    height: auto;
    display: block;
}

.main-product-image img:hover,
.main-product-image picture:hover {
    transform: scale(1.02);
}

/* 图片弹窗链接样式 - 兼容 picture 标签和 img 标签 */
.image-popup {
    display: inline-block;
    position: relative;
    overflow: hidden;
    cursor: zoom-in;
}

.image-popup img,
.image-popup picture {
    transition: transform 0.3s ease;
    display: block;
}

/* picture 标签内的 img 继承样式 */
.image-popup picture img {
    width: 100%;
    height: auto;
    display: block;
}

.image-popup:hover img,
.image-popup:hover picture {
    transform: scale(1.05);
}

/* 概览内容 */
.overview-content {
    max-width: 100%;
    margin: 0 auto;
    font-size: 18px;
    line-height: 1.8;
}

.overview-content p {
    margin-bottom: 20px;
    color: var(--thm-gray);
}

.overview-content .lead-text {
    font-size: 20px;
    font-weight: 500;
    color: var(--thm-p);
    margin-bottom: 30px;
}

.overview-content .highlight {
    color: var(--thm-base);
    font-weight: 600;
}

/* 区块标题 */
.section-title {
    font-size: 36px;
    font-weight: 700;
    color: var(--thm-black);
    margin-bottom: 40px;
    text-align: center;
    position: relative;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: var(--thm-base);
    border-radius: 2px;
}

/* ========== 技术参数样式 ========== */
.specs-card {
    background: linear-gradient(135deg, var(--thm-f6) 0%, #ffffff 100%);
    border-radius: 20px;
    padding: 40px;
    margin-bottom: 40px;
}

.specs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-bottom: 40px;
}

.spec-item {
    display: flex;
    flex-direction: column;
    padding: 20px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.spec-label {
    font-size: 14px;
    color: var(--thm-gray);
    margin-bottom: 8px;
    letter-spacing: 0.5px;
}

.spec-value {
    font-size: 18px;
    font-weight: 600;
    color: var(--thm-black);
}

/* 透射范围 */
.transmission-ranges {
    margin-bottom: 30px;
}

.transmission-ranges h3 {
    font-size: 24px;
    font-weight: 600;
    color: var(--thm-black);
    margin-bottom: 20px;
}

.range-items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.range-item {
    text-align: center;
    padding: 20px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.range-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.12);
}

.range-item .band-label {
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    border-radius: 50%;
    margin-bottom: 10px;
}

.l-band .band-label {
    background: var(--filter-l-color);
}

.r-band .band-label {
    background: var(--filter-r-color);
}

.g-band .band-label {
    background: var(--filter-g-color);
}

.b-band .band-label {
    background: var(--filter-b-color);
}

/* SHO Filter Band Styles */
.ha-band .band-label {
    background: var(--filter-ha-color);
}

.sii-band .band-label {
    background: var(--filter-sii-color);
}

.oiii-band .band-label {
    background: var(--filter-oiii-color);
}

.band-range {
    font-size: 16px;
    font-weight: 600;
    color: var(--thm-black);
}

/* 技术细节 */
.tech-details {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
}

.detail-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 15px;
    background: #fff;
    border-radius: 8px;
    border-left: 3px solid var(--thm-base);
}

.detail-item i {
    color: var(--thm-base);
    font-size: 18px;
    margin-top: 2px;
}

/* ========== 光谱响应样式 ========== */
.spectrum-content {
    background: var(--thm-fb);
    border-radius: 20px;
    padding: 40px;
}

.spectrum-image {
    margin-bottom: 40px;
    text-align: center;
}

/* 光谱响应图片 - 兼容 picture 标签和 img 标签 */
.spectrum-image img,
.spectrum-image picture {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    cursor: zoom-in;
    display: block;
}

/* picture 标签内的 img 继承样式 */
.spectrum-image picture img {
    max-width: 100%;
    height: auto;
    display: block;
}

.spectrum-guide h3 {
    font-size: 24px;
    font-weight: 600;
    color: var(--thm-black);
    margin-bottom: 20px;
}

.guide-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.guide-list li {
    padding: 15px 20px;
    margin-bottom: 15px;
    background: #fff;
    border-radius: 10px;
    border-left: 4px solid var(--thm-base);
    font-size: 16px;
    line-height: 1.8;
}

.color-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 10px;
}

.legend-item {
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
}

.legend-item.gray {
    background: #f0f0f0;
    color: var(--filter-l-color);
}

.legend-item.red {
    background: rgba(224, 65, 86, 0.1);
    color: var(--filter-r-color);
}

.legend-item.green {
    background: rgba(39, 193, 138, 0.1);
    color: var(--filter-g-color);
}

.legend-item.blue {
    background: rgba(28, 181, 224, 0.1);
    color: var(--filter-b-color);
}

/* ========== Bootstrap折叠列表自定义样式 ========== */
.filter-features-accordion {
    margin-bottom: 40px;
}

.filter-features-accordion .accordion-item {
    background: #fff;
    border: none;
    border-radius: 12px !important;
    margin-bottom: 15px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.filter-features-accordion .accordion-item:hover {
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
}

.filter-features-accordion .accordion-header {
    background: transparent;
}

.filter-features-accordion .accordion-button {
    background: linear-gradient(135deg, var(--thm-base), var(--thm-color));
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    padding: 20px 30px;
    border: none;
    box-shadow: none;
    position: relative;
    padding-left: 60px;
}

.filter-features-accordion .accordion-button:not(.collapsed) {
    background: linear-gradient(135deg, var(--thm-black), var(--thm-base));
    box-shadow: none;
}

.filter-features-accordion .accordion-button:focus {
    box-shadow: none;
    outline: none;
}

.filter-features-accordion .accordion-button:hover {
    background: linear-gradient(135deg, var(--thm-color), var(--thm-base));
}

.filter-features-accordion .accordion-button::after {
    display: none;
}

/* 自定义图标 */
.filter-features-accordion .accordion-icon {
    position: absolute;
    left: 25px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.filter-features-accordion .accordion-icon i {
    font-size: 14px;
    transition: transform 0.3s ease;
}

.filter-features-accordion .accordion-button:not(.collapsed) .accordion-icon i {
    transform: rotate(90deg);
}

.filter-features-accordion .accordion-body {
    padding: 30px;
    background: #fff;
    font-size: 16px;
    line-height: 1.8;
    color: var(--thm-gray);
}

.filter-features-accordion .accordion-body p {
    margin-bottom: 20px;
}

/* 波段详情 */
.band-details {
    display: grid;
    gap: 15px;
}

.band-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: var(--thm-f6);
    border-radius: 8px;
    font-size: 15px;
}

.band-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-weight: bold;
    color: #fff;
    flex-shrink: 0;
}

.band-icon.l {
    background: var(--filter-l-color);
}

.band-icon.r {
    background: var(--filter-r-color);
}

.band-icon.g {
    background: var(--filter-g-color);
}

.band-icon.b {
    background: var(--filter-b-color);
}

/* SHO Filter Band Icon Styles */
.band-icon.sii {
    background: var(--filter-sii-color, #8B0000);
}

.band-icon.ha {
    background: var(--filter-ha-color, #DC143C);
}

.band-icon.oiii {
    background: var(--filter-oiii-color, #00CED1);
}

/* 安装列表 */
.installation-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.installation-list li {
    padding: 10px 0;
    border-bottom: 1px solid var(--thm-f3);
}

.installation-list li:last-child {
    border-bottom: none;
}

/* 兼容性列表 */
.compatibility-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin: 20px 0;
}

.compat-item {
    padding: 15px;
    background: var(--thm-f6);
    border-radius: 8px;
    border-left: 3px solid var(--thm-base);
}

.compat-note {
    margin-top: 20px;
    padding: 15px;
    background: rgba(85, 198, 239, 0.05);
    border-radius: 8px;
    font-style: italic;
    color: var(--thm-gray);
}

/* ========== 实拍效果画廊 ========== */
.gallery-grid {
    display: grid;
    gap: 40px;
}

.gallery-item {
    background: var(--thm-fb);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.gallery-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
}

.gallery-item.full-width {
    grid-column: 1 / -1;
}

.image-wrapper {
    position: relative;
    overflow: hidden;
    background: #000;
}

/* 图片容器 - 兼容 picture 标签和 img 标签 */
.image-wrapper img,
.image-wrapper picture {
    width: 100%;
    height: auto;
    display: block;
    cursor: zoom-in;
}

/* picture 标签内的 img 继承样式 */
.image-wrapper picture img {
    width: 100%;
    height: auto;
    display: block;
}

.image-info {
    padding: 30px;
}

.image-info h3 {
    font-size: 28px;
    font-weight: 700;
    color: var(--thm-black);
    margin-bottom: 20px;
}

.shooting-details p {
    font-size: 15px;
    line-height: 1.8;
    color: var(--thm-gray);
    margin-bottom: 8px;
}

.shooting-details strong {
    color: var(--thm-black);
}

.total-exposure {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid var(--thm-f3);
    font-size: 18px;
    font-weight: 600;
    color: var(--thm-base);
}

/* 通道示例 */
.channel-samples {
    margin-top: 40px;
    padding: 40px;
    background: linear-gradient(135deg, var(--thm-f6) 0%, #ffffff 100%);
    border-radius: 20px;
}

.channel-samples h3 {
    font-size: 24px;
    font-weight: 600;
    color: var(--thm-black);
    margin-bottom: 30px;
    text-align: center;
}

.channels-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.channel-item {
    text-align: center;
}

/* 通道示例图片 - 兼容 picture 标签和 img 标签 */
.channel-item img,
.channel-item picture {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1);
    margin-bottom: 10px;
    cursor: zoom-in;
    display: block;
}

/* picture 标签内的 img 继承样式 */
.channel-item picture img {
    width: 100%;
    height: auto;
    display: block;
}

.channel-label {
    font-size: 16px;
    font-weight: 600;
    color: var(--thm-black);
}

/* ========== 安装指南样式 ========== */
.installation-content {
    background: var(--thm-fb);
    border-radius: 20px;
    padding: 40px;
}

.install-instructions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-bottom: 40px;
}

.install-type {
    padding: 30px;
    background: #fff;
    border-radius: 12px;
    border-left: 4px solid var(--thm-base);
}

.install-type h3 {
    font-size: 22px;
    font-weight: 600;
    color: var(--thm-black);
    margin-bottom: 15px;
}

.install-type p {
    font-size: 16px;
    color: var(--thm-gray);
    line-height: 1.6;
}

.install-images {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* 安装图片 - 兼容 picture 标签和 img 标签 */
.install-images picture {
    width: 100%;
    display: block;
}

.install-images img,
.install-images picture img {
    width: 100%;
    height: auto;
    display: block;
}

/* 移除圆角和阴影，确保无缝拼接 */
.install-images picture:first-child img {
    border-radius: 12px 12px 0 0;
}

.install-images picture:last-child img {
    border-radius: 0 0 12px 12px;
}

/* 只有一张图片时恢复完整圆角 */
.install-images picture:only-child,
.install-images picture:only-child img {
    border-radius: 12px;
}

/* ========== 售后服务卡片 ========== */
.warranty-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.warranty-card {
    text-align: center;
    padding: 40px 30px;
    background: linear-gradient(135deg, var(--thm-f6) 0%, #ffffff 100%);
    border-radius: 16px;
    transition: all 0.3s ease;
}

.warranty-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}

.card-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--thm-base), var(--thm-color));
    border-radius: 50%;
    color: #fff;
    font-size: 36px;
}

.warranty-card h3 {
    font-size: 22px;
    font-weight: 600;
    color: var(--thm-black);
    margin-bottom: 15px;
}

.warranty-card p {
    font-size: 16px;
    color: var(--thm-gray);
    line-height: 1.6;
}

.warranty-card a {
    color: var(--thm-base);
    text-decoration: none;
    font-weight: 500;
}

.warranty-card a:hover {
    text-decoration: underline;
}

/* ========== 注意事项样式 ========== */
.notes-content {
    display: grid;
    gap: 25px;
}

.note-item {
    display: flex;
    gap: 20px;
    padding: 25px;
    background: linear-gradient(135deg, rgba(85, 198, 239, 0.05) 0%, rgba(255, 255, 255, 0.8) 100%);
    border-radius: 12px;
    border-left: 4px solid var(--thm-base);
}

.note-item i {
    font-size: 24px;
    color: var(--thm-base);
    flex-shrink: 0;
    margin-top: 2px;
}

.note-text {
    flex: 1;
    font-size: 16px;
    line-height: 1.8;
}

.note-text strong {
    color: var(--thm-black);
}

/* ========== 产品图片展示 ========== */
.product-image-showcase,
.feature-image {
    text-align: center;
    margin-top: 40px;
}

/* 产品图片展示 - 兼容 picture 标签和 img 标签 */
.product-image-showcase img,
.product-image-showcase picture,
.feature-image img,
.feature-image picture {
    max-width: 100%;
    height: auto;
    border-radius: 16px;
    cursor: zoom-in;
    display: block;
}

/* picture 标签内的 img 继承样式 */
.product-image-showcase picture img,
.feature-image picture img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* ========== Magnific Popup自定义样式 ========== */
.mfp-fade.mfp-bg {
    opacity: 0;
    transition: all 0.3s ease;
}

.mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.9;
}

.mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
}

.mfp-fade .mfp-content {
    opacity: 0;
    transition: all 0.3s ease;
    transform: scale(0.95);
}

.mfp-fade.mfp-ready .mfp-content {
    opacity: 1;
    transform: scale(1);
}

.mfp-fade.mfp-removing .mfp-content {
    opacity: 0;
    transform: scale(0.95);
}

/* ========== 动画效果 ========== */
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(85, 198, 239, 0.4);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(85, 198, 239, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(85, 198, 239, 0);
    }
}

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

.product-section {
    animation: fadeIn 0.6s ease-out;
}

/* ========== 响应式设计 ========== */
@media (max-width: 1200px) {
    .filter-floating-nav {
        display: none;
    }

    .product-title {
        font-size: 36px;
    }

    .section-title {
        font-size: 28px;
    }

    .range-items {
        grid-template-columns: repeat(2, 1fr);
    }

    .channels-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .atf_portfolio__details-area .container {
        padding: 20px;
        border-radius: 16px;
    }

    .product-section {
        padding: 40px 20px;
        margin-bottom: 20px;
    }

    .hero-section {
        margin-bottom: 40px;
    }

    .product-title {
        font-size: 28px;
    }

    .product-subtitle {
        font-size: 16px;
    }

    .section-title {
        font-size: 24px;
        margin-bottom: 30px;
    }

    .specs-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .range-items {
        grid-template-columns: 1fr;
    }

    .transmission-ranges .range-item {
        padding: 15px;
    }

    .install-instructions {
        grid-template-columns: 1fr;
    }

    .channels-grid {
        grid-template-columns: 1fr;
    }

    .warranty-cards {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .gallery-item {
        margin-bottom: 20px;
    }

    .filter-features-accordion .accordion-button {
        padding: 15px 20px 15px 50px;
        font-size: 16px;
    }

    .filter-features-accordion .accordion-icon {
        left: 20px;
    }

    .filter-features-accordion .accordion-body {
        padding: 20px;
    }

    .overview-content {
        font-size: 16px;
    }

    .overview-content .lead-text {
        font-size: 18px;
    }
}

@media (max-width: 480px) {
    .product-title {
        font-size: 24px;
    }

    .product-subtitle {
        font-size: 14px;
    }

    .section-title {
        font-size: 20px;
    }

    .specs-card {
        padding: 20px;
    }

    .range-item .band-label {
        width: 40px;
        height: 40px;
        line-height: 40px;
        font-size: 18px;
    }

    .band-range {
        font-size: 14px;
    }

    .shooting-details p {
        font-size: 14px;
    }

    .card-icon {
        width: 60px;
        height: 60px;
        font-size: 28px;
    }

    .warranty-card h3 {
        font-size: 18px;
    }

    .warranty-card p {
        font-size: 14px;
    }

    .filter-features-accordion .accordion-button {
        font-size: 14px;
        padding: 12px 15px 12px 45px;
    }
}

/* ========== 打印样式 ========== */
@media print {
    .filter-floating-nav {
        display: none;
    }

    .product-section {
        page-break-inside: avoid;
        margin-bottom: 20px;
    }

    .gallery-item {
        page-break-inside: avoid;
    }

    .image-popup {
        cursor: default;
    }
}

/* ============================================================
   V2 组件样式 - 新规范（渐进式迁移）
   使用 --v2-* 变量系统，参考 root.css 和 v2-components.css
   ============================================================ */

/**
 * V2 浮动导航样式
 * 添加 v2-nav 类名时启用新样式
 */
.filter-floating-nav.v2-nav {
    position: fixed;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1000;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filter-floating-nav.v2-nav .nav-toggle {
    position: absolute;
    left: 0;
    top: 0;
    width: auto;
    padding: var(--v2-spacing-sm, 12px) var(--v2-spacing-md, 16px);
    background-color: var(--v2-primary-500, #2967D3);
    border: none;
    border-radius: 0 var(--v2-radius-md, 12px) var(--v2-radius-md, 12px) 0;
    color: var(--v2-text-primary, #FFFFFF);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: var(--v2-spacing-xs, 8px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-size: var(--v2-font-size-sm, 14px);
    font-weight: 600;
    animation: none;
}

.filter-floating-nav.v2-nav .nav-toggle:hover {
    background-color: var(--v2-primary-600, #1B4AA0);
    padding-right: var(--v2-spacing-lg, 20px);
}

.filter-floating-nav.v2-nav.active .nav-toggle .nav-text {
    opacity: 0;
    width: 0;
    overflow: hidden;
}

.filter-floating-nav.v2-nav .nav-content {
    position: relative;
    background-color: var(--v2-bg-primary, #FFFFFF);
    border: 1px solid var(--v2-bg-divider, #E3E8F0);
    border-radius: 0 var(--v2-radius-md, 12px) var(--v2-radius-md, 12px) 0;
    padding: var(--v2-spacing-lg, 20px) var(--v2-spacing-xl, 40px) var(--v2-spacing-xl, 30px) var(--v2-spacing-lg, 20px);
    width: 260px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-100%);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filter-floating-nav.v2-nav.active .nav-content {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.filter-floating-nav.v2-nav .nav-close {
    position: absolute;
    right: var(--v2-spacing-sm, 10px);
    top: var(--v2-spacing-sm, 10px);
    width: 30px;
    height: 30px;
    background-color: var(--v2-bg-action, #EDF2F8);
    border: none;
    border-radius: var(--v2-radius-pill, 50%);
    color: var(--v2-text-secondary, #5A6B7C);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.filter-floating-nav.v2-nav .nav-close:hover {
    background-color: var(--v2-primary-500, #2967D3);
    color: var(--v2-text-primary, #FFFFFF);
}

.filter-floating-nav.v2-nav h3 {
    font-size: var(--v2-h4-font-size, 16px);
    font-weight: 700;
    color: var(--v2-text-primary, #182028);
    margin-bottom: var(--v2-spacing-md, 15px);
    padding-bottom: var(--v2-spacing-sm, 10px);
    border-bottom: 2px solid var(--v2-bg-divider, #E3E8F0);
}

.filter-floating-nav.v2-nav .nav-link {
    display: block;
    padding: var(--v2-spacing-xs, 8px) var(--v2-spacing-sm, 12px);
    color: var(--v2-text-secondary, #5A6B7C);
    text-decoration: none;
    border-radius: var(--v2-radius-sm, 8px);
    font-size: var(--v2-font-size-sm, 14px);
    transition: all 0.2s ease;
    position: relative;
}

.filter-floating-nav.v2-nav .nav-link:hover,
.filter-floating-nav.v2-nav .nav-link.active {
    background-color: var(--v2-bg-action, #EDF2F8);
    color: var(--v2-primary-600, #1B4AA0);
}

.filter-floating-nav.v2-nav .nav-divider {
    height: 1px;
    background-color: var(--v2-bg-divider, #E3E8F0);
    margin: var(--v2-spacing-lg, 20px) 0;
}

.filter-floating-nav.v2-nav .manual-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--v2-spacing-sm, 12px) var(--v2-spacing-md, 16px);
    background: linear-gradient(135deg, var(--v2-primary-500, #2967D3), var(--v2-primary-600, #1B4AA0));
    color: var(--v2-text-primary, #FFFFFF);
    text-decoration: none;
    border-radius: var(--v2-radius-sm, 8px);
    font-size: var(--v2-font-size-base, 15px);
    font-weight: 600;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.filter-floating-nav.v2-nav .manual-link:hover {
    transform: translateY(-2px);
}

/**
 * V2 产品区块样式
 * 添加 v2-section 类名时启用新样式
 */
.product-section.v2-section {
    background-color: var(--v2-bg-primary, #FFFFFF);
    padding: var(--v2-section-padding, 60px);
    border-radius: var(--v2-radius-lg, 16px);
    margin-bottom: var(--v2-spacing-xl, 30px);
    scroll-margin-top: 100px;
}

/**
 * V2 产品标题样式
 */
.product-title.v2-title {
    font-size: clamp(var(--v2-h1-font-size, 36px), 4vw, var(--v2-display-font-size, 48px));
    font-weight: 700;
    background: linear-gradient(135deg, var(--v2-text-primary, #182028), var(--v2-primary-600, #1B4AA0));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: var(--v2-spacing-lg, 20px);
    line-height: 1.2;
}

.product-subtitle.v2-subtitle {
    font-size: var(--v2-font-size-lg, 20px);
    color: var(--v2-text-secondary, #5A6B7C);
    max-width: 800px;
    margin: 0 auto;
}

/**
 * V2 规格卡片样式
 * 添加 v2-card 类名时启用新样式
 */
.specs-card.v2-card {
    background: linear-gradient(135deg, var(--v2-bg-functional, #F4F6F9) 0%, var(--v2-bg-primary, #FFFFFF) 100%);
    border: 1px solid var(--v2-bg-divider, #E3E8F0);
    border-radius: var(--v2-radius-lg, 20px);
    padding: var(--v2-spacing-xl, 40px);
    margin-bottom: var(--v2-spacing-xl, 40px);
}

.specs-card.v2-card .specs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--v2-spacing-lg, 24px);
    margin-bottom: var(--v2-spacing-xl, 40px);
}

.specs-card.v2-card .spec-item {
    display: flex;
    flex-direction: column;
    padding: var(--v2-spacing-md, 20px);
    border-radius: var(--v2-radius-md, 12px);
    background-color: var(--v2-bg-primary, #FFFFFF);
    border: 1px solid var(--v2-bg-divider, #E3E8F0);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.specs-card.v2-card .spec-item:hover {
    transform: translateY(-2px);
    border-color: var(--v2-primary-200, #A7CEFA);
}

.specs-card.v2-card .spec-label {
    font-size: var(--v2-font-size-sm, 13px);
    color: var(--v2-text-tertiary, #8B95A5);
    margin-bottom: var(--v2-spacing-xs, 8px);
    letter-spacing: 0.5px;
    /* 保留规格标签的原始英文大小写，避免前台被强制转成全大写。 */
    text-transform: none;
    font-weight: 600;
}

.specs-card.v2-card .spec-value {
    font-size: var(--v2-font-size-lg, 18px);
    font-weight: 600;
    color: var(--v2-text-primary, #182028);
}

/**
 * V2 售后卡片样式
 * 添加 v2-card 类名时启用新样式
 */
.warranty-cards.v2-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--v2-spacing-xl, 30px);
}

.warranty-card.v2-card {
    padding: var(--v2-spacing-xl, 40px) var(--v2-spacing-lg, 30px);
    background: linear-gradient(135deg, var(--v2-bg-functional, #F4F6F9) 0%, var(--v2-bg-primary, #FFFFFF) 100%);
    border: 1px solid var(--v2-bg-divider, #E3E8F0);
    border-radius: var(--v2-radius-lg, 16px);
    text-align: center;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.warranty-card.v2-card:hover {
    transform: translateY(-8px);
    border-color: var(--v2-primary-200, #A7CEFA);
}

.warranty-card.v2-card h3 {
    font-size: var(--v2-h4-font-size, 22px);
    font-weight: 700;
    color: var(--v2-text-primary, #182028);
    margin-bottom: var(--v2-spacing-md, 15px);
}

.warranty-card.v2-card p {
    font-size: var(--v2-font-size-base, 16px);
    color: var(--v2-text-secondary, #5A6B7C);
    line-height: 1.6;
}

.warranty-card.v2-card .card-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto var(--v2-spacing-lg, 25px);
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--v2-primary-500, #2967D3), var(--v2-primary-600, #1B4AA0));
    border-radius: var(--v2-radius-pill, 50%);
    color: var(--v2-text-primary, #FFFFFF);
    font-size: 36px;
}

.warranty-card.v2-card a {
    color: var(--v2-primary-600, #1B4AA0);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s ease;
}

.warranty-card.v2-card a:hover {
    color: var(--v2-primary-700, #163C82);
    text-decoration: underline;
}

/**
 * V2 注意事项卡片样式
 */
.notes-content.v2-notes .note-item {
    display: flex;
    gap: var(--v2-spacing-lg, 20px);
    padding: var(--v2-spacing-lg, 25px);
    background: linear-gradient(135deg, rgba(41, 103, 211, 0.05) 0%, rgba(255, 255, 255, 0.9) 100%);
    border: 1px solid var(--v2-primary-100, #D6E4FF);
    border-radius: var(--v2-radius-md, 12px);
    transition: all 0.3s ease;
}

.notes-content.v2-notes .note-item:hover {
    background: linear-gradient(135deg, rgba(41, 103, 211, 0.08) 0%, rgba(255, 255, 255, 1) 100%);
    border-color: var(--v2-primary-200, #A7CEFA);
}

.notes-content.v2-notes .note-item i {
    font-size: var(--v2-font-size-xl, 24px);
    color: var(--v2-primary-500, #2967D3);
    flex-shrink: 0;
    margin-top: 2px;
}

.notes-content.v2-notes .note-text {
    flex: 1;
    font-size: var(--v2-font-size-base, 16px);
    line-height: 1.8;
    color: var(--v2-text-secondary, #5A6B7C);
}

.notes-content.v2-notes .note-text strong {
    color: var(--v2-text-primary, #182028);
    font-weight: 600;
}

/**
 * V2 区块标题样式
 */
.section-title.v2-title {
    font-size: clamp(var(--v2-h2-font-size, 28px), 3vw, var(--v2-h1-font-size, 36px));
    font-weight: 700;
    color: var(--v2-text-primary, #182028);
    margin-bottom: var(--v2-spacing-xl, 40px);
    position: relative;
    text-align: center;
}

.section-title.v2-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, var(--v2-primary-500, #2967D3), var(--v2-primary-300, #79ABED));
    border-radius: 2px;
}

/**
 * V2 容器样式
 */
.atf_portfolio__details-area.v2-details .container {
    background-color: var(--v2-bg-primary, #FFFFFF);
    border: 1px solid var(--v2-bg-divider, #E3E8F0);
    border-radius: var(--v2-radius-xl, 24px);
    padding: var(--v2-spacing-xl, 40px);
    margin-top: var(--v2-spacing-lg, 20px);
    margin-bottom: var(--v2-spacing-lg, 20px);
}

/* ============================================================
   Packaging List Tab 切换样式
   ============================================================ */

/* Tab 按钮容器 */
.package-tabs {
    display: flex;
    justify-content: center;
    gap: var(--v2-spacing-md, 16px);
    margin-bottom: var(--v2-spacing-xl, 30px);
    flex-wrap: wrap;
}

/* Tab 按钮 */
.package-tab-btn {
    padding: var(--v2-spacing-sm, 12px) var(--v2-spacing-xl, 32px);
    background-color: var(--v2-bg-functional, #F4F6F9);
    border: 2px solid transparent;
    border-radius: var(--v2-radius-sm, 8px);
    color: var(--v2-text-secondary, #5A6B7C);
    font-size: var(--v2-font-size-lg, 16px);
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 100px;
}

.package-tab-btn:hover {
    background-color: var(--v2-primary-100, #D6E4FF);
    color: var(--v2-primary-600, #1B4AA0);
}

.package-tab-btn.active {
    background-color: var(--v2-primary-500, #2967D3);
    color: var(--v2-text-primary, #FFFFFF);
    border-color: var(--v2-primary-500, #2967D3);
}

/* Tab 内容容器 */
.package-tab-content {
    position: relative;
}

/* Tab 面板 */
.package-tab-pane {
    display: none;
    animation: fadeIn 0.3s ease-out;
}

.package-tab-pane.active {
    display: block;
}

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

/* 响应式适配 */
@media (max-width: 768px) {
    .package-tabs {
        gap: var(--v2-spacing-sm, 8px);
    }

    .package-tab-btn {
        padding: var(--v2-spacing-xs, 10px) var(--v2-spacing-lg, 20px);
        font-size: var(--v2-font-size-sm, 14px);
        min-width: 80px;
    }
}
/* ========================================
   V2 Shared Alignment
   说明：滤镜详情页保留滤镜色彩表达，但公共容器、目录和标题体系统一到 V2。
   ======================================== */

body.product-detail-v2 .page-wrapper {
    /* 详情页外层背景统一回到视觉规范内容底色，避免家族样式再次叠加品牌渐变。 */
    background: var(--v2-bg-content);
}

body.product-detail-v2 .atf_portfolio__details-area .container {
    border: 1px solid rgba(var(--v2-primary-500-rgb), 0.06);
    box-shadow: var(--v2-shadow-card);
}

body.product-detail-v2 .filter-product-details {
    color: var(--v2-text-body);
}

body.product-detail-v2 .filter-floating-nav .nav-toggle {
    animation: none;
}

body.product-detail-v2 .product-section {
    border: 1px solid rgba(var(--v2-primary-500-rgb), 0.06);
    border-radius: var(--v2-radius-lg);
    box-shadow: var(--v2-shadow-card);
    scroll-margin-top: var(--detail-scroll-offset);
}

body.product-detail-v2 .product-title {
    background: none;
    -webkit-text-fill-color: initial;
    color: var(--v2-text-heading);
}

body.product-detail-v2 .product-subtitle {
    color: var(--v2-text-secondary);
}

body.product-detail-v2 .main-product-image img,
body.product-detail-v2 .main-product-image picture,
body.product-detail-v2 .main-product-image .img-fluid {
    border-radius: var(--v2-radius-md);
    box-shadow: var(--v2-shadow-card);
}

body.product-detail-v2 .main-product-image img:hover,
body.product-detail-v2 .main-product-image picture:hover,
body.product-detail-v2 .main-product-image .img-fluid:hover {
    transform: translateY(-4px);
    box-shadow: var(--v2-shadow-card-hover);
}

/* ========================================
   V2 Filters Final Alignment
   说明：
   - 滤镜页允许保留滤镜展示色，但按钮、表格、参数卡和 package 区必须回到 V2。
   ======================================== */

body.product-detail-v2 .atf_portfolio__details-area.bg-f6 {
    background: transparent !important;
    background-color: transparent !important;
}

body.product-detail-v2 .product-section,
body.product-detail-v2 .filter-spec-card,
body.product-detail-v2 .transmission-card,
body.product-detail-v2 .package-item,
body.product-detail-v2 .scenario-card {
    background: var(--v2-bg-primary);
    border-color: var(--v2-bg-divider);
}

body.product-detail-v2 .filter-pill,
body.product-detail-v2 .spec-badge,
body.product-detail-v2 .package-tab-btn {
    background: var(--v2-bg-content);
    border: 1px solid var(--v2-bg-divider);
    color: var(--v2-text-body);
}

body.product-detail-v2 .package-tab-btn.active,
body.product-detail-v2 .buy-btn,
body.product-detail-v2 .manual-link,
body.product-detail-v2 .btn-primary {
    background: var(--v2-primary-500);
    border-color: var(--v2-primary-500);
    color: var(--v2-text-inverse);
}

body.product-detail-v2 .package-tab-btn:hover,
body.product-detail-v2 .buy-btn:hover,
body.product-detail-v2 .manual-link:hover,
body.product-detail-v2 .btn-primary:hover {
    background: var(--v2-primary-400);
    border-color: var(--v2-primary-400);
}

/* ============================================================
   Phase 8 filter-detail visual spec alignment
   Scope excludes PureSight A1, which has dedicated art-directed sections below.
   ============================================================ */
.atf_portfolio__details-area:not(.puresight-a1-page) > .container,
.atf_portfolio__details-area:not(.puresight-a1-page) .product-section,
.atf_portfolio__details-area:not(.puresight-a1-page) .specs-card,
.atf_portfolio__details-area:not(.puresight-a1-page) .spec-item,
.atf_portfolio__details-area:not(.puresight-a1-page) .range-item,
.atf_portfolio__details-area:not(.puresight-a1-page) .spectrum-content,
.atf_portfolio__details-area:not(.puresight-a1-page) .filter-features-accordion .accordion-item,
.atf_portfolio__details-area:not(.puresight-a1-page) .gallery-item,
.atf_portfolio__details-area:not(.puresight-a1-page) .channel-samples,
.atf_portfolio__details-area:not(.puresight-a1-page) .installation-content,
.atf_portfolio__details-area:not(.puresight-a1-page) .install-type,
.atf_portfolio__details-area:not(.puresight-a1-page) .warranty-card,
.atf_portfolio__details-area:not(.puresight-a1-page) .notes-content,
.atf_portfolio__details-area:not(.puresight-a1-page) .main-product-image img,
.atf_portfolio__details-area:not(.puresight-a1-page) .main-product-image picture,
.atf_portfolio__details-area:not(.puresight-a1-page) .spectrum-image img,
.atf_portfolio__details-area:not(.puresight-a1-page) .spectrum-image picture,
.atf_portfolio__details-area:not(.puresight-a1-page) .product-image-showcase img,
.atf_portfolio__details-area:not(.puresight-a1-page) .product-image-showcase picture,
.atf_portfolio__details-area:not(.puresight-a1-page) .feature-image img,
.atf_portfolio__details-area:not(.puresight-a1-page) .feature-image picture,
.atf_portfolio__details-area:not(.puresight-a1-page) .image-wrapper img,
.atf_portfolio__details-area:not(.puresight-a1-page) .image-wrapper picture,
.atf_portfolio__details-area:not(.puresight-a1-page) .install-images img,
.atf_portfolio__details-area:not(.puresight-a1-page) .install-images picture,
.atf_portfolio__details-area:not(.puresight-a1-page) .channel-item img,
.atf_portfolio__details-area:not(.puresight-a1-page) .channel-item picture,
.atf_portfolio__details-area ~ .atf-Subscribe-area .atf-subscribe-panel,
.atf_portfolio__details-area ~ .atf-Subscribe-area .atf-subscribe-input,
.atf_portfolio__details-area ~ .atf-Subscribe-area .atf-subscribe-btn {
    border-radius: var(--v2-radius-sm, 8px) !important;
}

.atf_portfolio__details-area:not(.puresight-a1-page) .filter-product-details,
.atf_portfolio__details-area:not(.puresight-a1-page) .filter-product-details p,
.atf_portfolio__details-area:not(.puresight-a1-page) .overview-content,
.atf_portfolio__details-area:not(.puresight-a1-page) .overview-content p,
.atf_portfolio__details-area:not(.puresight-a1-page) .overview-content .lead-text,
.atf_portfolio__details-area:not(.puresight-a1-page) .product-subtitle,
.atf_portfolio__details-area:not(.puresight-a1-page) .filter-features-accordion .accordion-body,
.atf_portfolio__details-area:not(.puresight-a1-page) .guide-list li,
.atf_portfolio__details-area:not(.puresight-a1-page) .install-type p,
.atf_portfolio__details-area:not(.puresight-a1-page) .warranty-card p,
.atf_portfolio__details-area:not(.puresight-a1-page) .notes-content,
.atf_portfolio__details-area:not(.puresight-a1-page) .notes-content li {
    font-size: var(--v2-font-size-base, 16px);
    line-height: var(--v2-line-height-base, 24px);
    font-weight: 400;
}

.atf_portfolio__details-area:not(.puresight-a1-page) .product-title {
    font-size: var(--v2-h0-font-size, 48px);
    line-height: var(--v2-h0-line-height, 56px);
    font-weight: 500;
    color: var(--v2-text-heading, #171A1D);
    background: none;
    -webkit-text-fill-color: currentColor;
}

.atf_portfolio__details-area:not(.puresight-a1-page) .section-title {
    font-size: var(--v2-h1-font-size, 32px);
    line-height: var(--v2-h1-line-height, 40px);
    font-weight: 500;
    color: var(--v2-text-heading, #171A1D);
}

.atf_portfolio__details-area:not(.puresight-a1-page) .transmission-ranges h3,
.atf_portfolio__details-area:not(.puresight-a1-page) .spectrum-guide h3,
.atf_portfolio__details-area:not(.puresight-a1-page) .image-info h3,
.atf_portfolio__details-area:not(.puresight-a1-page) .channel-samples h3,
.atf_portfolio__details-area:not(.puresight-a1-page) .install-type h3,
.atf_portfolio__details-area:not(.puresight-a1-page) .warranty-card h3 {
    font-size: var(--v2-h2-font-size, 24px);
    line-height: var(--v2-h2-line-height, 32px);
    font-weight: 500;
    color: var(--v2-text-heading, #171A1D);
}

.atf_portfolio__details-area:not(.puresight-a1-page) .filter-features-accordion .accordion-button,
.atf_portfolio__details-area:not(.puresight-a1-page) .spec-value,
.atf_portfolio__details-area:not(.puresight-a1-page) .band-range,
.atf_portfolio__details-area:not(.puresight-a1-page) .total-exposure,
.atf_portfolio__details-area:not(.puresight-a1-page) .channel-label {
    font-size: var(--v2-font-size-base, 16px);
    line-height: var(--v2-line-height-base, 24px);
    font-weight: 500;
}

@media (max-width: 768px) {
    .atf_portfolio__details-area:not(.puresight-a1-page) .product-title {
        font-size: var(--v2-h0-font-size, 28px);
        line-height: var(--v2-h0-line-height, 36px);
        font-weight: 500;
    }

    .atf_portfolio__details-area:not(.puresight-a1-page) .section-title {
        font-size: var(--v2-h1-font-size, 24px);
        line-height: var(--v2-h1-line-height, 32px);
        font-weight: 500;
    }

    .atf_portfolio__details-area:not(.puresight-a1-page) .transmission-ranges h3,
    .atf_portfolio__details-area:not(.puresight-a1-page) .spectrum-guide h3,
    .atf_portfolio__details-area:not(.puresight-a1-page) .image-info h3,
    .atf_portfolio__details-area:not(.puresight-a1-page) .channel-samples h3,
    .atf_portfolio__details-area:not(.puresight-a1-page) .install-type h3,
    .atf_portfolio__details-area:not(.puresight-a1-page) .warranty-card h3 {
        font-size: var(--v2-h2-font-size, 20px);
        line-height: var(--v2-h2-line-height, 28px);
        font-weight: 500;
    }
}

/* ========== PureSight A1 Dual Narrowband Filters 页面专属样式 ========== */
/* 说明：所有选择器都挂在 `.puresight-a1-page` 或 `.puresight-a1-banner` 下，避免影响其它滤镜详情页。 */
.puresight-a1-banner .atf-page-heading-title {
    max-width: min(760px, 100%);
}

.puresight-a1-page .product-section {
    border: 1px solid var(--v2-bg-divider);
    box-shadow: var(--v2-shadow-card);
}

.puresight-a1-page .section-title {
    border-left: 4px solid var(--v2-primary-500);
    padding-left: var(--v2-spacing-md);
    text-align: left;
}

.puresight-a1-page .section-title::after {
    display: none;
}

.puresight-a1-page .puresight-a1-eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0 var(--v2-spacing-md);
    margin: 0 auto var(--v2-spacing-md);
    color: var(--v2-primary-700);
    background: var(--v2-primary-50);
    border: 1px solid var(--v2-primary-100);
    border-radius: var(--v2-radius-pill);
    font-weight: 700;
    letter-spacing: 0.04em;
}

.puresight-a1-page .puresight-a1-intro-card {
    max-width: 920px;
    margin: 0 auto;
    padding: var(--v2-spacing-xl);
    background: var(--v2-bg-functional);
    border: 1px solid var(--v2-bg-divider);
    border-radius: var(--v2-radius-lg);
}

.puresight-a1-page .puresight-a1-overview .product-title {
    /* 详情 Banner 已经提供唯一 H1，这里的正文标题保持产品说明层级，避免页面出现两个一级标题。 */
    font-size: clamp(30px, 4vw, 46px);
}

.puresight-a1-page .puresight-a1-hero-image {
    width: 100%;
    max-width: 1360px;
    margin: 0 auto var(--v2-spacing-xl);
}

.puresight-a1-page .puresight-a1-hero-image picture,
.puresight-a1-page .puresight-a1-hero-image img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin-right: auto;
    margin-left: auto;
    border-radius: var(--v2-radius-md);
}

.puresight-a1-page .puresight-a1-product-views {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--v2-spacing-lg);
    max-width: 920px;
    margin: 0 auto var(--v2-spacing-xl);
}

.puresight-a1-page .puresight-a1-product-views picture,
.puresight-a1-page .puresight-a1-product-views img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--v2-radius-md);
    box-shadow: var(--v2-shadow-card);
}

.puresight-a1-page .puresight-gallery-grid {
    display: grid;
    gap: var(--v2-spacing-xl);
}

.puresight-a1-page .puresight-gallery-card {
    overflow: hidden;
    background: var(--v2-bg-primary);
    border: 1px solid var(--v2-bg-divider);
    border-radius: var(--v2-radius-lg);
    box-shadow: var(--v2-shadow-soft);
}

.puresight-a1-page .puresight-gallery-meta {
    padding: var(--v2-spacing-lg);
    background: var(--v2-bg-functional);
}

.puresight-a1-page .puresight-gallery-meta h3,
.puresight-a1-page .puresight-feature-stack h3 {
    margin: 0 0 var(--v2-spacing-md);
    color: var(--v2-text-heading);
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 800;
}

.puresight-a1-page .puresight-gallery-meta p {
    margin: 0 0 var(--v2-spacing-md);
    color: var(--v2-text-secondary);
    font-weight: 600;
}

.puresight-a1-page .puresight-gallery-meta ul,
.puresight-a1-page .puresight-check-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.puresight-a1-page .puresight-gallery-meta li,
.puresight-a1-page .puresight-check-list li {
    position: relative;
    padding-left: 22px;
    margin-bottom: var(--v2-spacing-sm);
    color: var(--v2-text-body);
    line-height: var(--v2-line-height-base);
}

.puresight-a1-page .puresight-gallery-meta li::before,
.puresight-a1-page .puresight-check-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 9px;
    width: 8px;
    height: 8px;
    border-radius: var(--v2-radius-pill);
    background: var(--v2-primary-500);
}

.puresight-a1-page .puresight-gallery-image img,
.puresight-a1-page .puresight-spectrum-image img,
.puresight-a1-page .puresight-purity-image img,
.puresight-a1-page .puresight-installation-image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--v2-radius-md);
}

.puresight-a1-page .puresight-gallery-image img {
    border-radius: 0;
}

.puresight-a1-page .puresight-a1-text-section p,
.puresight-a1-page .puresight-a1-installation-section p,
.puresight-a1-page .puresight-a1-purity-section p {
    color: var(--v2-text-body);
    font-size: var(--v2-font-size-base);
    line-height: 1.8;
}

.puresight-a1-page .puresight-a1-dark-section {
    color: var(--v2-text-inverse);
    background: linear-gradient(135deg, var(--v2-primary-900) 0%, var(--v2-bg-dark) 100%);
    border-color: rgba(var(--v2-primary-500-rgb), 0.28);
}

body.product-detail-v2 .puresight-a1-page .product-section.puresight-a1-dark-section {
    /*
     * 公共 V2 详情页规则使用 `body.product-detail-v2 .product-section` 统一写白底，
     * specificity 高于普通页面类选择器。这里用页面命名空间 + body 上下文精确覆盖，
     * 只恢复 PureSight A1 的深色 Key Features 区块，不影响其它滤镜详情页。
     */
    color: var(--v2-text-inverse, #ffffff);
    background:
        radial-gradient(circle at 18% 18%, rgba(var(--v2-primary-500-rgb, 41, 103, 211), 0.28) 0%, transparent 32%),
        linear-gradient(135deg, var(--v2-primary-900, #020f3b) 0%, var(--v2-bg-dark, #18202b) 100%);
    border-color: rgba(var(--v2-primary-500-rgb, 41, 103, 211), 0.28);
    padding: clamp(48px, 6vw, 72px) clamp(28px, 5vw, 64px);
    overflow: hidden;
    width: 100%;
    max-width: 1360px;
    margin-right: auto;
    margin-left: auto;
}

.puresight-a1-page .puresight-a1-dark-section .section-title,
.puresight-a1-page .puresight-a1-dark-section h3,
.puresight-a1-page .puresight-a1-dark-section p,
.puresight-a1-page .puresight-a1-dark-section strong {
    color: var(--v2-text-inverse);
}

body.product-detail-v2 .puresight-a1-page .puresight-a1-dark-section .section-title,
body.product-detail-v2 .puresight-a1-page .puresight-a1-dark-section h3,
body.product-detail-v2 .puresight-a1-page .puresight-a1-dark-section p,
body.product-detail-v2 .puresight-a1-page .puresight-a1-dark-section strong {
    color: var(--v2-text-inverse, #ffffff);
}

body.product-detail-v2 .puresight-a1-page .puresight-a1-dark-section .section-title {
    max-width: 100%;
    overflow-wrap: anywhere;
}

body.product-detail-v2 .puresight-a1-page .puresight-a1-dark-section p {
    max-width: 100%;
}

.puresight-a1-page .puresight-feature-stack {
    display: grid;
    gap: var(--v2-spacing-lg);
    width: 100%;
    max-width: 100%;
}

.puresight-a1-page .puresight-feature-stack article {
    padding: var(--v2-spacing-lg);
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--v2-radius-lg);
    overflow: hidden;
}

.puresight-a1-page .puresight-benefit-pills {
    display: flex;
    flex-wrap: wrap;
    gap: var(--v2-spacing-sm);
    margin-top: var(--v2-spacing-md);
}

.puresight-a1-page .puresight-benefit-pills span {
    padding: var(--v2-spacing-sm) var(--v2-spacing-md);
    color: var(--v2-text-inverse);
    background: rgba(var(--v2-primary-500-rgb), 0.28);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--v2-radius-pill);
    font-weight: 700;
}

.puresight-a1-page .puresight-parameter-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--v2-bg-divider);
    border-radius: var(--v2-radius-lg);
}

.puresight-a1-page .puresight-parameter-table {
    width: 100%;
    min-width: 680px;
    border-collapse: collapse;
    background: var(--v2-bg-primary);
}

.puresight-a1-page .puresight-parameter-table th,
.puresight-a1-page .puresight-parameter-table td {
    padding: var(--v2-spacing-md) var(--v2-spacing-lg);
    border-bottom: 1px solid var(--v2-bg-divider);
    text-align: left;
    vertical-align: top;
    line-height: var(--v2-line-height-base);
}

.puresight-a1-page .puresight-parameter-table th {
    width: 34%;
    color: var(--v2-text-heading);
    background: var(--v2-bg-functional);
    font-weight: 800;
}

.puresight-a1-page .puresight-parameter-table td {
    color: var(--v2-text-body);
}

.puresight-a1-page .puresight-parameter-table tr:last-child th,
.puresight-a1-page .puresight-parameter-table tr:last-child td {
    border-bottom: 0;
}

.puresight-a1-page .puresight-spectrum-image,
.puresight-a1-page .puresight-purity-image,
.puresight-a1-page .puresight-installation-image {
    margin: var(--v2-spacing-lg) 0;
}

.puresight-a1-page #related .section-title {
    margin-bottom: var(--v2-spacing-xl);
}

body.product-detail-v2 .puresight-a1-page .puresight-a1-overview .product-title {
    font-size: 48px;
    font-weight: 500;
    line-height: 56px;
}

body.product-detail-v2 .puresight-a1-page .section-title {
    font-size: 32px;
    font-weight: 500;
    line-height: 40px;
}

body.product-detail-v2 .puresight-a1-page .puresight-gallery-meta h3,
body.product-detail-v2 .puresight-a1-page .puresight-feature-stack h3,
body.product-detail-v2 .puresight-a1-page .puresight-a1-dark-section h3 {
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
}

body.product-detail-v2 .puresight-a1-page .puresight-a1-eyebrow,
body.product-detail-v2 .puresight-a1-page .puresight-a1-intro-card,
body.product-detail-v2 .puresight-a1-page .puresight-a1-intro-card p,
body.product-detail-v2 .puresight-a1-page .puresight-a1-text-section p,
body.product-detail-v2 .puresight-a1-page .puresight-a1-installation-section p,
body.product-detail-v2 .puresight-a1-page .puresight-a1-purity-section p,
body.product-detail-v2 .puresight-a1-page .puresight-a1-dark-section p,
body.product-detail-v2 .puresight-a1-page .puresight-gallery-meta p,
body.product-detail-v2 .puresight-a1-page .puresight-gallery-meta li,
body.product-detail-v2 .puresight-a1-page .puresight-check-list li,
body.product-detail-v2 .puresight-a1-page .puresight-parameter-table th,
body.product-detail-v2 .puresight-a1-page .puresight-parameter-table td {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0;
}

body.product-detail-v2 .puresight-a1-page .puresight-a1-eyebrow,
body.product-detail-v2 .puresight-a1-page .puresight-parameter-table th,
body.product-detail-v2 .puresight-a1-page .puresight-benefit-pills span {
    font-weight: 500;
}

body.product-detail-v2 .puresight-a1-page .product-section,
body.product-detail-v2 .puresight-a1-page .puresight-a1-intro-card,
body.product-detail-v2 .puresight-a1-page .puresight-a1-hero-image picture,
body.product-detail-v2 .puresight-a1-page .puresight-a1-hero-image img,
body.product-detail-v2 .puresight-a1-page .puresight-a1-product-views picture,
body.product-detail-v2 .puresight-a1-page .puresight-a1-product-views img,
body.product-detail-v2 .puresight-a1-page .puresight-gallery-card,
body.product-detail-v2 .puresight-a1-page .puresight-spectrum-image img,
body.product-detail-v2 .puresight-a1-page .puresight-purity-image img,
body.product-detail-v2 .puresight-a1-page .puresight-installation-image img,
body.product-detail-v2 .puresight-a1-page .puresight-feature-stack article,
body.product-detail-v2 .puresight-a1-page .puresight-parameter-table-wrap {
    border-radius: var(--v2-radius-sm, 8px);
}

@media (max-width: 991px) {
    .puresight-a1-page .puresight-a1-intro-card,
    .puresight-a1-page .puresight-gallery-meta,
    .puresight-a1-page .puresight-feature-stack article {
        padding: var(--v2-spacing-md);
    }

    .puresight-a1-page .puresight-a1-overview .hero-section {
        margin-bottom: var(--v2-spacing-lg);
    }

    .puresight-a1-page .puresight-a1-overview .main-product-image {
        margin-bottom: var(--v2-spacing-lg);
    }
}

@media (max-width: 575px) {
    .puresight-a1-page {
        padding-top: var(--v2-spacing-xl);
    }

    .puresight-a1-page .product-section {
        padding: var(--v2-spacing-lg) var(--v2-spacing-sm);
    }

    body.product-detail-v2 .puresight-a1-page .puresight-a1-overview .product-title,
    .puresight-a1-page .puresight-a1-overview .product-title {
        font-size: 28px;
        font-weight: 500;
        line-height: 36px;
    }

    body.product-detail-v2 .puresight-a1-page .section-title {
        font-size: 24px;
        line-height: 32px;
    }

    body.product-detail-v2 .puresight-a1-page .puresight-gallery-meta h3,
    body.product-detail-v2 .puresight-a1-page .puresight-feature-stack h3,
    body.product-detail-v2 .puresight-a1-page .puresight-a1-dark-section h3 {
        font-size: 20px;
        line-height: 28px;
    }

    .puresight-a1-page .puresight-a1-eyebrow {
        max-width: 100%;
        white-space: normal;
        letter-spacing: 0;
    }

    .puresight-a1-page .puresight-a1-intro-card {
        padding: var(--v2-spacing-md);
    }

    .puresight-a1-page .puresight-a1-product-views {
        grid-template-columns: 1fr;
    }

    .puresight-a1-page .puresight-parameter-table {
        min-width: 0;
        table-layout: fixed;
    }

    .puresight-a1-page .puresight-parameter-table th,
    .puresight-a1-page .puresight-parameter-table td {
        padding: var(--v2-spacing-sm);
        overflow-wrap: anywhere;
        word-break: normal;
    }

    .puresight-a1-page .puresight-benefit-pills span {
        width: 100%;
    }

    body.product-detail-v2 .puresight-a1-page .product-section.puresight-a1-dark-section {
        padding: var(--v2-spacing-xl) var(--v2-spacing-md);
    }
}