/* Product Page Premium Upgrade - 光影織藝 Editorial Artisanship */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:wght@400;700&family=Manrope:wght@300;400;500;700&display=swap');

.pp-hero { min-height: 45vh; background: #30312e; }
.pp-hero__gradient { background: linear-gradient(135deg, rgba(48,49,46,0.85) 0%, rgba(48,49,46,0.4) 50%, transparent 100%) !important; }
.pp-hero__title { font-family: 'Noto Sans TC', serif !important; font-size: clamp(2.5rem, 6vw, 4.5rem) !important; font-weight: 400 !important; letter-spacing: 0.05em; }
.pp-breadcrumb { font-family: 'Noto Sans TC', sans-serif !important; letter-spacing: 0.05em; }
.pp-breadcrumb a { color: rgba(255,255,255,0.6) !important; }
.pp-breadcrumb a:hover { color: #f7bd48 !important; }

.product-detail { padding: 80px 0 40px !important; background: #fbf9f5 !important; }
.product-layout { gap: 64px !important; }
.product-gallery-main { border-radius: 2px !important; overflow: hidden; box-shadow: 0 10px 40px rgba(27,28,26,0.06) !important; }

.product-info h1 { font-family: 'Noto Sans TC', serif !important; font-size: 2rem !important; font-weight: 400 !important; color: #1b1c1a !important; }
.product-subtitle { font-family: 'Noto Sans TC', sans-serif !important; color: #785600 !important; letter-spacing: 0.2em !important; text-transform: uppercase !important; font-size: 0.8rem !important; }
.product-desc-lead { font-family: 'Noto Sans TC', sans-serif !important; color: #5f5e5e !important; font-size: 1rem !important; line-height: 1.9 !important; letter-spacing: 0.02em !important; }

.feature-badges { gap: 10px !important; margin: 24px 0 !important; }
.feature-badge { background: transparent !important; border: 1px solid #d3c4af !important; color: #4f4535 !important; font-family: 'Noto Sans TC', sans-serif !important; font-size: 0.8rem !important; letter-spacing: 0.05em; padding: 8px 18px !important; border-radius: 2px !important; transition: all 0.3s ease !important; }
.feature-badge:hover { background: #785600 !important; border-color: #785600 !important; color: #fff !important; }

.quick-specs { border: 1px solid rgba(211,196,175,0.4); overflow: hidden; }
.quick-spec-item { background: #fbf9f5 !important; padding: 20px !important; }
.quick-spec-item .qs-label { font-family: 'Noto Sans TC', sans-serif !important; text-transform: uppercase !important; letter-spacing: 0.15em !important; font-size: 0.65rem !important; color: #817563 !important; }
.quick-spec-item .qs-value { font-family: 'Noto Sans TC', serif !important; font-weight: 400 !important; color: #1b1c1a !important; }

.install-difficulty .label { text-transform: uppercase !important; letter-spacing: 0.1em !important; font-size: 0.7rem !important; color: #817563 !important; }
.dot.filled { background: #785600 !important; }

.product-tabs-section { background: #f5f3ef !important; padding: 80px 0 !important; }
.tab-btn { font-family: 'Noto Sans TC', sans-serif !important; font-size: 0.85rem !important; letter-spacing: 0.08em !important; color: #817563 !important; }
.tab-btn.active { color: #1b1c1a !important; }
.tab-btn::after { background: #785600 !important; }

.spec-table th, .spec-table td { font-family: 'Noto Sans TC', sans-serif !important; border-color: rgba(211,196,175,0.3) !important; }
.spec-table th { color: #4f4535 !important; font-weight: 600 !important; font-size: 0.85rem !important; background: #efeeea !important; }
.spec-table td { color: #1b1c1a !important; font-size: 0.9rem !important; }

.faq-question { font-family: 'Noto Sans TC', serif !important; color: #1b1c1a !important; font-weight: 400 !important; }
.faq-answer-inner { font-family: 'Noto Sans TC', sans-serif !important; color: #5f5e5e !important; line-height: 1.8 !important; }

.pp-cta { background: #30312e !important; }
.pp-cta__eyebrow { color: #f7bd48 !important; letter-spacing: 0.25em !important; }
.pp-cta__heading { font-family: 'Noto Sans TC', serif !important; font-weight: 400 !important; }
.pp-btn--primary { background: #785600 !important; border-color: #785600 !important; letter-spacing: 0.12em !important; border-radius: 2px !important; }
.pp-btn--primary:hover { background: #5d4200 !important; border-color: #5d4200 !important; }
.pp-btn--outline { border-radius: 2px !important; }

.pp-related { background: #fbf9f5 !important; padding: 80px 0 !important; }
.pp-related__eyebrow { color: #785600 !important; letter-spacing: 0.2em !important; text-transform: uppercase !important; font-size: 0.75rem !important; }
.pp-related__title { font-family: 'Noto Sans TC', serif !important; font-weight: 400 !important; font-size: 2rem !important; }
.pp-related__card { border: none !important; background: #f5f3ef !important; border-radius: 2px !important; box-shadow: 0 10px 40px rgba(27,28,26,0.04) !important; }
.pp-related__card:hover { box-shadow: 0 10px 40px rgba(27,28,26,0.08) !important; }
.pp-related__card h3 { font-family: 'Noto Sans TC', serif !important; font-weight: 400 !important; }
.pp-related__card-link { color: #785600 !important; letter-spacing: 0.1em !important; }

/* Related posts grid (knowledge articles) */
.pp-related__header { text-align: center; margin-bottom: 48px; }
.pp-related__header .pp-related__eyebrow { display: inline-block; margin-bottom: 12px; }
.pp-related__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 28px; }
.pp-related__grid .pp-related__card { display: flex; flex-direction: column; text-decoration: none; color: inherit; border-radius: 2px; overflow: hidden; transition: box-shadow .3s ease, transform .3s ease; }
.pp-related__grid .pp-related__card:hover { transform: translateY(-2px); }
.pp-related__grid .pp-related__card-img { aspect-ratio: 16 / 10; overflow: hidden; background: #efeeea; }
.pp-related__grid .pp-related__card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.pp-related__grid .pp-related__card:hover .pp-related__card-img img { transform: scale(1.04); }
.pp-related__grid .pp-related__card-body { padding: 22px 24px 26px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.pp-related__grid .pp-related__card-body h3 { font-family: 'Noto Sans TC', serif !important; font-weight: 400 !important; font-size: 1.1rem !important; margin: 0; color: #1b1c1a; line-height: 1.5; }

/* Pairing Guide (搭配建議) */
.pp-pairing { background: #f5f3ef; padding: 80px 0; }
.pp-pairing__header { text-align: center; margin-bottom: 48px; }
.pp-pairing__eyebrow { display: inline-block; color: #785600; letter-spacing: 0.2em; text-transform: uppercase; font-family: 'Noto Sans TC', sans-serif; font-size: 0.75rem; margin-bottom: 12px; }
.pp-pairing__title { font-family: 'Noto Sans TC', serif; font-weight: 400; font-size: 2rem; color: #1b1c1a; margin: 0 0 14px; }
.pp-pairing__intro { font-family: 'Noto Sans TC', sans-serif; color: #5f5e5e; font-size: 0.95rem; line-height: 1.8; max-width: 540px; margin: 0 auto; }
.pp-pairing__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 28px; }
.pp-pairing__card { background: #fbf9f5; border-radius: 2px; overflow: hidden; box-shadow: 0 8px 28px rgba(27,28,26,0.05); transition: box-shadow .3s ease, transform .3s ease; display: flex; flex-direction: column; }
.pp-pairing__card:hover { box-shadow: 0 12px 36px rgba(27,28,26,0.09); transform: translateY(-2px); }
.pp-pairing__card-img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #efeeea; }
.pp-pairing__card-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.pp-pairing__card:hover .pp-pairing__card-img img { transform: scale(1.04); }
.pp-pairing__card-body { padding: 22px 24px 26px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.pp-pairing__card-body h3 { font-family: 'Noto Sans TC', serif; font-weight: 400; font-size: 1.2rem; margin: 0; color: #1b1c1a; }
.pp-pairing__card-body h3 a { color: inherit; text-decoration: none; }
.pp-pairing__card-body h3 a:hover { color: #785600; }
.pp-pairing__reason { font-family: 'Noto Sans TC', sans-serif; color: #5f5e5e; font-size: 0.9rem; line-height: 1.75; margin: 0; flex: 1; }
.pp-pairing__link { display: inline-flex; align-items: center; gap: 6px; font-family: 'Noto Sans TC', sans-serif; color: #785600; font-size: 0.85rem; letter-spacing: 0.1em; text-decoration: none; margin-top: 6px; }
.pp-pairing__link:hover { color: #5d4200; }
.pp-pairing__link svg { transition: transform .2s ease; }
.pp-pairing__link:hover svg { transform: translateX(3px); }

.curtain-options-section { background: #fbf9f5 !important; }
.curtain-options-section h2 { font-family: 'Noto Sans TC', serif !important; font-weight: 400 !important; }
.option-card { border: 1px solid rgba(211,196,175,0.3) !important; border-radius: 2px !important; }
.option-card h4 { font-family: 'Noto Sans TC', serif !important; font-weight: 400 !important; }
