.brand-detail-container.data-v-8c1f83f2 { width: 100%; height: 100vh; background-color: #f5f6f8; display: flex; flex-direction: column; } /* 顶部回退沉浸式导航栏 */ .custom-header.data-v-8c1f83f2 { position: fixed; top: 0; left: 0; right: 0; z-index: 999; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); background: transparent; } .status-bar.data-v-8c1f83f2 { width: 100%; } .header-scrolled.data-v-8c1f83f2 { background: rgba(255, 255, 255, 0.98); -webkit-backdrop-filter: blur(20rpx); backdrop-filter: blur(20rpx); box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05); } .nav-bar.data-v-8c1f83f2 { height: 44px; display: flex; align-items: center; justify-content: space-between; padding: 0 30rpx; } .nav-left.data-v-8c1f83f2 { width: 80rpx; height: 100%; display: flex; align-items: center; } .back-icon.data-v-8c1f83f2 { font-size: 38rpx; color: #ffffff; font-weight: bold; text-shadow: 0 2rpx 4rpx rgba(0,0,0,0.4); } .header-scrolled .back-icon.data-v-8c1f83f2 { color: #333333; text-shadow: none; } .nav-title.data-v-8c1f83f2 { font-size: 32rpx; font-weight: bold; color: #333333; opacity: 0; transition: opacity 0.2s; } .header-scrolled .nav-title.data-v-8c1f83f2 { opacity: 1; } .nav-right.data-v-8c1f83f2 { width: 80rpx; } /* 滚动主体区 */ .main-scroll-view.data-v-8c1f83f2 { flex: 1; width: 100%; overflow-y: auto; } /* 品牌英雄大幕传记层 */ .hero-biography-section.data-v-8c1f83f2 { position: relative; width: 100%; min-height: 480rpx; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding-bottom: 40rpx; } .biography-bg.data-v-8c1f83f2 { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; } .biography-overlay.data-v-8c1f83f2 { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%, rgba(138,43,226,0.35) 50%, rgba(20,20,20,0.85) 100%); } .biography-core.data-v-8c1f83f2 { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; width: 100%; padding: 0 40rpx; box-sizing: border-box; } .logo-wrapper.data-v-8c1f83f2 { width: 140rpx; height: 140rpx; background: #ffffff; border-radius: 50%; padding: 12rpx; box-shadow: 0 6rpx 20rpx rgba(0,0,0,0.25); border: 4rpx solid rgba(255,255,255,0.8); margin-bottom: 16rpx; } .brand-logo-img.data-v-8c1f83f2 { width: 100%; height: 100%; border-radius: 50%; } .brand-title-box.data-v-8c1f83f2 { display: flex; flex-direction: column; align-items: center; } .b-name.data-v-8c1f83f2 { font-size: 40rpx; font-weight: 800; color: #ffffff; letter-spacing: 2rpx; text-shadow: 0 4rpx 8rpx rgba(0,0,0,0.4); } .capsules-row.data-v-8c1f83f2 { display: flex; align-items: center; justify-content: center; gap: 16rpx; margin-top: 10rpx; } .b-fans-capsule.data-v-8c1f83f2 { background: linear-gradient(to right, rgba(255,65,108,0.85), rgba(255,75,43,0.85)); padding: 4rpx 20rpx; border-radius: 20rpx; display: flex; align-items: center; -webkit-backdrop-filter: blur(8rpx); backdrop-filter: blur(8rpx); } .b-sale-capsule.data-v-8c1f83f2 { background: linear-gradient(to right, rgba(255,140,0,0.85), rgba(255,69,0,0.85)); padding: 4rpx 20rpx; border-radius: 20rpx; display: flex; align-items: center; -webkit-backdrop-filter: blur(8rpx); backdrop-filter: blur(8rpx); } .heart-icon.data-v-8c1f83f2, .fire-icon.data-v-8c1f83f2 { color: #ffffff; font-size: 22rpx; margin-right: 8rpx; } .b-fans-capsule text.data-v-8c1f83f2, .b-sale-capsule text.data-v-8c1f83f2 { color: #ffffff; font-size: 22rpx; font-weight: bold; } /* 拟态玻璃精编卖点与下沉简介卡片层 */ .card-intro-section.data-v-8c1f83f2 { margin-top: 16rpx; border-top: 1rpx dashed rgba(0,0,0,0.06); padding-top: 16rpx; width: 100%; } .c-intro-txt.data-v-8c1f83f2 { font-size: 26rpx; color: #333333; line-height: 1.6; text-align: justify; } .inline-toggle-btn.data-v-8c1f83f2 { color: #ff416c; font-size: 26rpx; font-weight: bold; padding-left: 6rpx; display: inline; } /* 拟态玻璃精编卖点卡片层 */ .compile-card-wrapper.data-v-8c1f83f2 { padding: 0 30rpx; margin-top: -24rpx; position: relative; z-index: 5; } .glass-compile-card.data-v-8c1f83f2 { background: rgba(255, 255, 255, 0.95); border-radius: 24rpx; padding: 30rpx; box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.06); border: 1rpx solid rgba(255,255,255,0.8); display: flex; flex-direction: column; } .card-tag-title.data-v-8c1f83f2 { font-size: 26rpx; font-weight: bold; color: #8a2be2; margin-bottom: 16rpx; } .compile-line-item.data-v-8c1f83f2 { display: flex; align-items: baseline; margin-bottom: 10rpx; } .line-dot.data-v-8c1f83f2 { color: #ff416c; font-size: 24rpx; margin-right: 12rpx; } .line-text.data-v-8c1f83f2 { font-size: 26rpx; color: #444444; line-height: 1.45; font-weight: 500; } .recommend-tags-scroll.data-v-8c1f83f2 { width: 100%; white-space: nowrap; box-sizing: border-box; } .tags-scroll-inner.data-v-8c1f83f2 { display: inline-flex; align-items: center; padding: 4rpx 0; } .r-tag.data-v-8c1f83f2 { font-size: 24rpx; color: #555555; background-color: #f4f5f9; padding: 10rpx 24rpx; border-radius: 26rpx; margin-right: 16rpx; font-weight: 500; display: inline-block; white-space: nowrap; word-break: keep-all; flex-shrink: 0; } /* 纯白装配大底盘与过滤排序引擎 */ .items-container-box.data-v-8c1f83f2 { background: #ffffff; border-top-left-radius: 24rpx; border-top-right-radius: 24rpx; margin: 0 24rpx; padding-bottom: 40rpx; overflow: hidden; box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.02); } .filter-bar.data-v-8c1f83f2 { display: flex; align-items: center; height: 88rpx; border-bottom: 1rpx solid #f6f6f6; background: #ffffff; } .filter-item.data-v-8c1f83f2 { flex: 1; text-align: center; font-size: 28rpx; color: #666666; display: flex; align-items: center; justify-content: center; } .filter-item.active.data-v-8c1f83f2 { color: #ff416c; font-weight: bold; } .filter-divider.data-v-8c1f83f2 { width: 2rpx; height: 24rpx; background-color: #eeeeee; } .price-arrows.data-v-8c1f83f2 { display: flex; flex-direction: column; margin-left: 8rpx; line-height: 1; } .price-arrows text.data-v-8c1f83f2 { font-size: 16rpx; color: #cccccc; } .price-arrows text.hl.data-v-8c1f83f2 { color: #ff416c; } /* 单列横排货盘流 */ .goods-list-single.data-v-8c1f83f2 { background: #ffffff; } .single-goods-item.data-v-8c1f83f2 { display: flex; padding: 24rpx; border-bottom: 1rpx solid #f9f9f9; } .g-img-left.data-v-8c1f83f2 { width: 220rpx; height: 220rpx; border-radius: 12rpx; overflow: hidden; flex-shrink: 0; background-color: #f5f5f5; } .goods-pic.data-v-8c1f83f2 { width: 100%; height: 100%; } .g-info-right.data-v-8c1f83f2 { flex: 1; margin-left: 24rpx; display: flex; flex-direction: column; justify-content: space-between; padding: 4rpx 0; overflow: hidden; } .g-title-row.data-v-8c1f83f2 { display: flex; align-items: flex-start; line-height: 1.4; } .platform-icon.data-v-8c1f83f2 { width: 26rpx; height: 26rpx; margin-right: 8rpx; margin-top: 4rpx; flex-shrink: 0; } .title-text.data-v-8c1f83f2 { font-size: 26rpx; color: #333333; font-weight: bold; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .g-labels-row.data-v-8c1f83f2 { display: flex; flex-wrap: wrap; margin-top: 10rpx; } .g-label-tag.data-v-8c1f83f2 { font-size: 20rpx; color: #ff416c; background: #fff5f7; border: 1rpx solid #ffd6de; padding: 2rpx 12rpx; border-radius: 20rpx; margin-right: 12rpx; margin-bottom: 6rpx; } .g-price-row.data-v-8c1f83f2 { display: flex; align-items: baseline; margin-top: auto; padding-top: 12rpx; } .price-left.data-v-8c1f83f2 { display: flex; align-items: baseline; } .p-tip.data-v-8c1f83f2 { font-size: 22rpx; color: #ff416c; margin-right: 4rpx; } .p-symbol.data-v-8c1f83f2 { font-size: 24rpx; color: #ff416c; font-weight: bold; } .p-integer.data-v-8c1f83f2 { font-size: 38rpx; color: #ff416c; font-weight: bold; } /* 连体实心红胶囊 */ .coupon-solid-box.data-v-8c1f83f2 { display: flex; align-items: center; background: #ff416c; border-radius: 6rpx; overflow: hidden; height: 32rpx; margin-left: 16rpx; } .c-left.data-v-8c1f83f2 { font-size: 18rpx; color: #ffffff; background: rgba(255, 255, 255, 0.2); padding: 0 8rpx; height: 100%; display: flex; align-items: center; font-weight: bold; } .c-right.data-v-8c1f83f2 { font-size: 18rpx; color: #ffffff; padding: 0 10rpx; font-weight: bold; } .g-bottom-row.data-v-8c1f83f2 { display: flex; align-items: center; font-size: 22rpx; color: #999999; margin-top: 10rpx; } .divider.data-v-8c1f83f2 { margin: 0 12rpx; color: #e0e0e0; } .shop.data-v-8c1f83f2 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; } .pure-loading-footer.data-v-8c1f83f2 { text-align: center; font-size: 24rpx; color: #999999; padding: 40rpx 0 20rpx; }