.firm-page { background: var(--bg-page); } .hero-section { position: relative; height: 520rpx; width: 100%; display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 80rpx; /* Space for overlap */ } .hero-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } .hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; /* Updated gradient to match Burgundy Red */ background: linear-gradient(to bottom, rgba(142, 34, 48, 0.4), rgba(92, 13, 21, 0.9)); z-index: 1; } .hero-content { position: relative; z-index: 2; padding: 0 var(--spacing-lg); display: flex; flex-direction: column; margin-bottom: 72rpx; } .firm-stats { display: inline-flex; align-items: center; width: fit-content; padding: 14rpx 22rpx; border-radius: 20rpx; border: 1rpx solid rgba(255, 255, 255, 0.32); background: linear-gradient(120deg, rgba(10, 21, 34, 0.62), rgba(19, 38, 56, 0.36)); box-shadow: 0 10rpx 28rpx rgba(7, 15, 27, 0.35), inset 0 1rpx 0 rgba(255, 255, 255, 0.24); backdrop-filter: blur(10rpx); -webkit-backdrop-filter: blur(10rpx); } .stat-item { display: flex; flex-direction: column; min-width: 120rpx; } .stat-num { font-size: 44rpx; font-weight: 700; color: #fff; line-height: 1.2; text-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.35); } .stat-label { font-size: 24rpx; color: rgba(242, 247, 252, 0.92); margin-top: 4rpx; text-shadow: 0 1rpx 8rpx rgba(0, 0, 0, 0.28); } .stat-divider { width: 2rpx; height: 40rpx; background: linear-gradient(to bottom, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.52), rgba(255, 255, 255, 0.12)); margin: 0 24rpx; } .content-container { position: relative; z-index: 3; margin-top: -60rpx; background: var(--bg-page); border-radius: 32rpx 32rpx 0 0; padding: var(--spacing-lg) var(--spacing-md); min-height: 50vh; } .address-card { display: flex; align-items: center; justify-content: space-between; padding: var(--spacing-md); margin-bottom: var(--spacing-lg); background: #fff; box-shadow: var(--shadow-base); } .address-info { display: flex; flex-direction: column; gap: 8rpx; } .address-label { font-size: 24rpx; color: var(--text-tertiary); } .address-text { font-size: 28rpx; color: var(--text-main); font-weight: 500; } .address-icon { font-size: 32rpx; color: var(--text-tertiary); } .section { margin-bottom: var(--spacing-xl); } .intro-text { font-size: 28rpx; color: var(--text-secondary); line-height: 1.8; text-align: justify; } .tags-wrapper { display: flex; flex-wrap: wrap; gap: 16rpx; } .area-tag { font-size: 26rpx; color: var(--primary-color); background: rgba(142, 34, 48, 0.08); /* Primary color opacity */ padding: 10rpx 24rpx; border-radius: 32rpx; font-weight: 500; } .bottom-bar { position: fixed; bottom: 0; left: 0; width: 100%; background: #fff; padding: 20rpx var(--spacing-md); box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.05); z-index: 10; box-sizing: border-box; } .cta-btn { background: var(--primary-color); color: #fff; font-size: 32rpx; font-weight: 500; border-radius: 50rpx; height: 88rpx; display: flex; align-items: center; justify-content: center; box-shadow: 0 8rpx 20rpx rgba(142, 34, 48, 0.3); } .cta-btn::after { border: none; }