.articles-page{min-height:100vh;background:linear-gradient(160deg,var(--tea-green-light) 0%,var(--tea-gold-soft) 100%);font-family:var(--font-ui);color:var(--text-primary)}.articles-hero{padding:56px 20px 40px;text-align:center;background:linear-gradient(180deg,rgba(47,75,60,.05) 0%,transparent 100%)}.articles-hero-title{font-family:var(--font-primary);font-size:clamp(24px,5vw,40px);color:var(--tea-dark);margin:0 0 8px;letter-spacing:.05em}.articles-hero-sub{font-size:15px;color:var(--text-secondary);margin:0}.articles-filter{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;padding:24px 20px 0}.filter-tab{padding:8px 18px;border-radius:999px;border:1px solid var(--mist-border);background:var(--mist-glass);-webkit-backdrop-filter:var(--blur-md);backdrop-filter:var(--blur-md);color:var(--text-secondary);font-size:13px;cursor:pointer;transition:all .2s var(--ease-soft);font-family:var(--font-ui)}.filter-tab:hover,.filter-tab.active{background:var(--tea-dark);color:var(--text-light);border-color:var(--tea-dark)}.articles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;padding:28px 20px 48px;max-width:1100px;margin:0 auto}.article-card{background:var(--mist-glass);-webkit-backdrop-filter:var(--blur-lg);backdrop-filter:var(--blur-lg);border:1px solid var(--mist-border);border-radius:var(--radius-md);overflow:hidden;cursor:pointer;transition:transform .25s var(--ease-soft),box-shadow .25s var(--ease-soft);text-decoration:none;color:inherit;display:flex;flex-direction:column}.article-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px var(--mist-shadow-hover)}.article-card-cover{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--tea-green-light)}.article-card-cover-placeholder{width:100%;aspect-ratio:16/9;background:linear-gradient(135deg,var(--tea-green-light) 0%,var(--tea-gold-soft) 100%);display:flex;align-items:center;justify-content:center;font-size:40px;opacity:.6}.article-card-body{padding:16px;flex:1;display:flex;flex-direction:column;gap:8px}.article-card-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.article-category-badge{font-size:11px;padding:2px 10px;border-radius:999px;background:#2f4b3c1a;color:var(--tea-dark);font-weight:600}.article-date,.article-read-time{font-size:12px;color:var(--text-secondary)}.article-card-title{font-family:var(--font-primary);font-size:17px;font-weight:700;color:var(--tea-dark);line-height:1.5;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.article-card-summary{font-size:13px;color:var(--text-secondary);line-height:1.7;margin:0;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.article-card-footer{padding:0 16px 14px;font-size:12px;color:var(--tea-main);font-weight:600}.articles-empty,.articles-loading{text-align:center;padding:60px 20px;color:var(--text-secondary)}.article-detail{max-width:760px;margin:0 auto;padding:0 20px 80px}.article-back-btn{display:inline-flex;align-items:center;gap:6px;padding:10px 0;color:var(--tea-main);font-size:14px;cursor:pointer;background:none;border:none;font-family:var(--font-ui);margin:24px 0 0}.article-back-btn:hover{color:var(--tea-dark)}.article-hero{margin:20px 0 32px}.article-hero-cover{width:100%;border-radius:var(--radius-md);aspect-ratio:16/9;object-fit:cover;box-shadow:0 8px 24px var(--mist-shadow)}.article-meta-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.article-title{font-family:var(--font-primary);font-size:clamp(22px,4vw,32px);color:var(--tea-dark);line-height:1.4;margin:0 0 16px}.article-author-row{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-secondary);padding-bottom:20px;border-bottom:1px solid var(--mist-border);margin-bottom:28px}.article-content{font-size:16px;line-height:1.9;color:var(--text-primary)}.article-content h1,.article-content h2,.article-content h3{font-family:var(--font-primary);color:var(--tea-dark);margin:2em 0 .6em;line-height:1.4}.article-content h1{font-size:1.6em}.article-content h2{font-size:1.3em;border-bottom:1px solid var(--mist-border);padding-bottom:.3em}.article-content h3{font-size:1.1em}.article-content p{margin:0 0 1.2em}.article-content img{width:100%;border-radius:var(--radius-md);margin:1.5em 0;display:block}.article-content a{color:var(--tea-main);text-decoration:underline;text-underline-offset:3px}.article-content blockquote{margin:1.5em 0;padding:14px 20px;border-left:4px solid var(--tea-accent);background:#8fb79c14;border-radius:0 var(--radius-md) var(--radius-md) 0;color:var(--text-secondary);font-style:italic}.article-content code{font-family:monospace;background:#2f4b3c14;padding:2px 6px;border-radius:4px;font-size:.9em;color:var(--tea-dark)}.article-content pre{background:#2f4b3c0f;border:1px solid var(--mist-border);border-radius:var(--radius-md);padding:16px;overflow-x:auto;margin:1.5em 0}.article-content pre code{background:none;padding:0;font-size:.85em}.article-content table{width:100%;border-collapse:collapse;margin:1.5em 0;font-size:14px}.article-content th{background:#2f4b3c14;color:var(--tea-dark);font-weight:700;padding:10px 14px;text-align:left;border-bottom:2px solid var(--tea-accent)}.article-content td{padding:9px 14px;border-bottom:1px solid var(--mist-border)}.article-content ul,.article-content ol{padding-left:1.6em;margin:0 0 1.2em}.article-content li{margin-bottom:.4em}.article-content ul li>a:only-child{display:flex;align-items:center;gap:10px;padding:10px 16px;margin:2px 0;background:#8fb79c12;border:1px solid var(--mist-border);border-left:4px solid var(--tea-accent);border-radius:0 var(--radius-md) var(--radius-md) 0;text-decoration:none;color:var(--tea-dark);font-weight:600;font-size:.95em;transition:background .18s,border-color .18s,transform .15s}.article-content ul li>a:only-child:before{content:"🔖";font-size:14px;flex-shrink:0}.article-content ul li>a:only-child:hover{background:#8fb79c29;border-left-color:var(--tea-main);transform:translate(3px)}.article-content ul:has(li>a:only-child){list-style:none;padding-left:0}.article-content hr{border:none;border-top:1px solid var(--mist-border);margin:2em 0}.related-products-section{margin-top:48px;padding:28px 20px;background:var(--mist-glass);-webkit-backdrop-filter:var(--blur-md);backdrop-filter:var(--blur-md);border:1px solid var(--mist-border);border-radius:var(--radius-lg)}.related-products-title{font-family:var(--font-primary);font-size:18px;color:var(--tea-dark);margin:0 0 16px}.related-products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}.related-product-card{background:#fff;border-radius:var(--radius-md);text-decoration:none;color:var(--text-primary);border:1px solid var(--mist-border);transition:transform .2s var(--ease-soft),box-shadow .2s;display:flex;flex-direction:column;overflow:hidden}.related-product-card:hover{transform:translateY(-3px);box-shadow:0 6px 20px #2f4b3c1f}.related-product-img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:var(--mist-glass)}.related-product-img-placeholder{width:100%;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;font-size:32px;background:#8fb79c1a}.related-product-info{padding:12px 14px}.related-product-name{font-family:var(--font-primary);font-size:14px;font-weight:700;color:var(--tea-dark);margin-bottom:6px;line-height:1.4}.related-product-cta{font-size:12px;color:var(--tea-main);font-weight:600}.latest-articles-section{padding:32px 0 8px}.latest-articles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:16px}.latest-article-link{text-decoration:none;color:inherit;display:block}@media (max-width: 600px){.articles-grid{grid-template-columns:1fr;padding:20px 16px 40px}.article-detail{padding:0 16px 60px}.related-products-grid{grid-template-columns:1fr 1fr}}