/* pages-cc.css — Shared styles for inner pages */

/* Breadcrumbs */
.breadcrumb-k{display:flex;align-items:center;gap:0.213334rem;font-size:0.298666rem;line-height:0.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.15em;color:var(--text-muted);margin-bottom:0.746666rem;flex-wrap:wrap}
.breadcrumb-k a{color:var(--text-muted);transition:color .2s}
.breadcrumb-k a:hover{color:var(--primary)}
.breadcrumb-k .current{color:var(--text);font-weight:800}
.breadcrumb-k .sep{font-size:0.256rem;opacity:.5}
.article-detail-page .breadcrumb-k{display:block;height:1.306666rem;line-height:1.306666rem;font-size:0;font-weight:400;text-transform:none;letter-spacing:0;color:#A9A9A9;margin-bottom:0;overflow:hidden}
.article-detail-page .breadcrumb-k a,.article-detail-page .breadcrumb-k .current{display:inline-block;font-size:0.373333rem;line-height:1.306666rem;color:#A9A9A9;font-weight:400;text-transform:none;letter-spacing:0;vertical-align:top}
.article-detail-page .breadcrumb-k a:hover{color:#A9A9A9}
.article-detail-page .breadcrumb-k span,.article-detail-page .breadcrumb-k i{display:inline-block;vertical-align:middle}
.article-detail-page .breadcrumb-k .ico16h{margin-right:0.16rem}
.article-detail-page .breadcrumb-k .fg{margin:0 .2rem;font-style:normal;color:#A9A9A9}
.product-list-page .crumb_order,.product-detail-page .crumb_order{margin-bottom:0.32rem}
.product-list-page .crumb_order .current,.product-detail-page .crumb_order .current{display:inline-block;font-size:0.373333rem;line-height:1.306666rem;color:#A9A9A9;font-weight:400;vertical-align:top}
.product-list-page .crumb_order .current font,.product-detail-page .crumb_order .current font{display:inline-block;vertical-align:middle}
.product-list-page.product-list-page-no-pagination{padding-bottom:0.96rem}

/* Page Header */
.page-header{margin-bottom: .5333rem}
.page-header h1{font-size:clamp(0.853334rem,5vw,1.493334rem);font-weight:900;letter-spacing:-.03em;text-transform:uppercase;line-height:.95;margin:0 0 0.213334rem}
.page-header .subtitle{color:var(--text-muted);font-size:0.362666rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em}

/* Sort Bar */
.sort-bar{display:flex;align-items:center;gap:0.32rem}
.sort-bar label{font-size:0.277334rem;font-weight:800;text-transform:uppercase;letter-spacing:.15em;color:var(--text-muted)}
.sort-bar select{background:var(--bg-alt);border:none;border-radius:var(--radius-sm);padding:0.266666rem 0.426666rem;font-size:0.349866rem;font-weight:600;color:var(--text);outline:none;min-width:5.333334rem;cursor:pointer}
.sort-bar select:focus{box-shadow:0 0 0 0.053334rem var(--primary)}

/* Sidebar Filters */
.filter-section{margin-bottom:0.96rem}
.filter-title{font-size:0.290134rem;font-weight:900;text-transform:uppercase;letter-spacing:.18em;color:var(--text);border-bottom:0.026666rem solid var(--border-soft);padding-bottom:0.213334rem;margin-bottom:0.426666rem}
.filter-check{display:flex;align-items:center;gap:0.266666rem;margin-bottom:0.266666rem;cursor:pointer;font-size:0.362666rem;font-weight:600;color:var(--text);transition:color .2s}
.filter-check:hover{color:var(--primary)}
.filter-check input[type="checkbox"]{accent-color:var(--primary);width:0.426666rem;height:0.426666rem;border-radius:0.106666rem}
.filter-chips{display:flex;flex-wrap:wrap;gap:0.213334rem}
.filter-chip{padding:0.16rem 0.426666rem;border-radius:26.64rem;font-size:0.264534rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;transition:all .2s;border:none}
.filter-chip-active{background:var(--primary);color:#fff}
.filter-chip-default{background:var(--surface-dim);color:var(--text-secondary)}
.filter-chip-default:hover{background:#dce2f7}
.filter-range{width:100%;accent-color:var(--primary);cursor:pointer}
.filter-range-labels{display:flex;justify-content:space-between;margin-top:0.266666rem;font-size:0.298666rem;font-weight:800;color:var(--text-muted);text-transform:uppercase}

/* Product List Grid */
.plp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0.64rem 0.533334rem}
.plp-card{position:relative;cursor:pointer}
.plp-card-media{aspect-ratio:3/4;border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-alt);margin-bottom:0.426666rem;position:relative}
.plp-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.plp-card:hover .plp-card-media img{transform:scale(1.08)}
.plp-badge{position:absolute;top:0.32rem;left:0.32rem}
.plp-brand{font-size:0.256rem;font-weight:800;color:var(--primary);text-transform:uppercase;letter-spacing:.12em;margin-bottom:0.106666rem}
.plp-name{font-size:0.426666rem;font-weight:800;line-height:1.3;margin:0 0 0.213334rem;min-height:1.173334rem;transition:color .2s}
.plp-card:hover .plp-name{color:var(--primary)}
.plp-price{font-size:0.597334rem;font-weight:900;letter-spacing:-.02em}
.plp-price-old{font-size:0.298666rem;font-weight:700;color:var(--text-muted);text-decoration:line-through;display:block}
.plp-stock{font-size:0.256rem;font-weight:800;text-transform:uppercase;display:flex;align-items:center;gap:0.16rem}
.plp-stock .dot{width:0.16rem;height:0.16rem;border-radius:50%;display:inline-block}
.plp-stock.in-stock{color:#16a34a}
.plp-stock.in-stock .dot{background:#16a34a}
.plp-stock.low-stock{color:var(--error)}
.plp-stock.low-stock .dot{background:var(--error)}

/* Pagination */
.pagination-k{display:flex;justify-content:center;align-items:center;gap:0.16rem;margin-top: .5333rem}
.page-btn{width:1.066666rem;height:1.066666rem;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;border:none;background:transparent;font-weight:800;font-size:0.375466rem;color:var(--text-muted);cursor:pointer;transition:all .2s}
.page-btn:hover{background:var(--surface-dim)}
.page-btn.active{background:var(--primary);color:#fff}
.page-btn svg{width:0.533334rem;height:0.533334rem}

/* Newsletter CTA */
.newsletter-cta{background:var(--bg-alt);padding:2.133334rem 0;position:relative;overflow:hidden}
.newsletter-cta .glow{position:absolute;width:10.133334rem;height:10.133334rem;border-radius:50%;filter:blur(2.666666rem);opacity:.05}
.newsletter-cta .glow-r{background:var(--primary);right:-2.666666rem;bottom:-2.666666rem}
.newsletter-cta .glow-l{background:var(--secondary);left:-2.666666rem;top:-2.666666rem}
.newsletter-form{display:flex;gap:0.32rem;max-width:16rem;margin:0 auto}
.newsletter-form input{flex:1;border:none;border-radius:var(--radius-lg);padding:0.426666rem 0.64rem;font-size:0.362666rem;outline:none;background:var(--surface)}
.newsletter-form input:focus{box-shadow:0 0 0 0.053334rem var(--primary)}
.newsletter-form button{white-space:nowrap}
.newsletter-note{font-size:0.256rem;font-weight:800;text-transform:uppercase;letter-spacing:.15em;color:var(--text-muted);margin-top:0.426666rem}

/* ===== Product Detail Page ===== */
.pdp-gallery{display:flex;flex-direction:row-reverse;gap:0.32rem}
.pdp-main-img{flex:1;aspect-ratio:4/5;border-radius:var(--radius-lg);overflow:hidden;background:var(--surface);position:relative}
.pdp-main-img img{width:100%;height:100%;object-fit:cover}
.pdp-thumbs{display:flex;flex-direction:column;gap:0.266666rem;width:2.133334rem}
.pdp-thumb{aspect-ratio:1;border-radius:var(--radius-sm);overflow:hidden;cursor:pointer;border:0.053334rem solid transparent;background:var(--bg-alt);transition:border-color .2s}
.pdp-thumb.active{border-color:var(--primary)}
.pdp-thumb:hover{border-color:var(--primary-strong)}
.pdp-thumb img{width:100%;height:100%;object-fit:cover}

/* PDP Info */
.pdp-series{font-size:0.256rem;font-weight:800;color:var(--primary);text-transform:uppercase;letter-spacing:.18em}
.pdp-title{font-size:clamp(0.682666rem,4vw,1.024rem);font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:1;margin:0.16rem 0 0}
.pdp-rating{display:flex;align-items:center;gap:0.266666rem;margin-top:0.373334rem}
.pdp-rating .label{font-size:0.349866rem;font-weight:600;color:var(--text-secondary)}
.pdp-price-block{margin:0.746666rem 0 0.533334rem}
.pdp-price{font-size:0.938666rem;font-weight:900;letter-spacing:-.02em}
.pdp-price-old{font-size:0.426666rem;color:var(--text-muted);text-decoration:line-through;margin-left:0.266666rem}
.pdp-save{background:#4069f2;color:#fff;padding:0.053334rem 0.213334rem;border-radius:0.106666rem;font-size:0.256rem;font-weight:800;text-transform:uppercase;margin-left:0.213334rem}
.pdp-stock{display:flex;align-items:center;gap:0.16rem;margin-top:0.213334rem;font-size:0.298666rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#16a34a}
.pdp-stock .dot{width:0.213334rem;height:0.213334rem;border-radius:50%;background:#16a34a}
.pdp-stock.low-stock{color:var(--error)}
.pdp-stock.low-stock .dot{background:var(--error)}
.pdp-stock.out-stock{color:var(--text-muted)}
.pdp-stock.out-stock .dot{background:var(--text-muted)}

/* Selectors */
.selector-label{display:block;font-size:0.256rem;font-weight:800;color:var(--text-muted);text-transform:uppercase;letter-spacing:.18em;margin-bottom:0.266666rem}
.selector-group{display:flex;flex-wrap:wrap;gap:0.213334rem;margin-bottom:0.533334rem}
.selector-btn{padding:0.266666rem 0.533334rem;border-radius:var(--radius-sm);font-size:0.32rem;font-weight:800;text-transform:uppercase;border:0.053334rem solid transparent;cursor:pointer;transition:all .2s}
.selector-btn-default{background:var(--bg-alt);color:var(--text-secondary);border-color:transparent}
.selector-btn-default:hover{background:#dce2f7}
.selector-btn-active{background:rgba(87,76,213,.1);color:var(--primary);border-color:var(--primary)}

/* Qty + ATC */
.pdp-action-stack{margin-top:0.746666rem;padding:0.426666rem;border:0.026666rem solid rgba(62,47,188,.12);border-radius:var(--radius-lg);background:linear-gradient(135deg,rgba(87,76,213,.08),rgba(255,255,255,.92) 55%,rgba(255,111,59,.08));box-shadow:0 0.426666rem 1.28rem rgba(15,23,42,.06)}
.btn-buy-now{width:100%;min-height:1.706666rem;margin-top:0.32rem;border:none;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--primary),var(--primary-strong));color:#fff;display:flex;align-items:center;gap:0.32rem;padding:0.32rem 0.426666rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;box-shadow:0 0.32rem 0.853334rem rgba(62,47,188,.32);transition:transform .2s,box-shadow .2s,filter .2s}
.btn-buy-now:hover{transform:translateY(-0.053334rem);box-shadow:0 0.426666rem 1.066666rem rgba(62,47,188,.38);filter:saturate(1.05)}
.btn-buy-now-copy{display:flex;flex-direction:column;align-items:flex-start;line-height:1.05;flex:1}
.btn-buy-now-copy .eyebrow{font-size:0.213334rem;letter-spacing:.18em;opacity:.72}
.btn-buy-now-copy .title{font-size:0.469334rem;letter-spacing:.14em}
.btn-buy-now-meta{font-size:0.213334rem;letter-spacing:.16em;opacity:.82;white-space:nowrap}
.btn-buy-now-icon{width:0.853334rem;height:0.853334rem;border-radius:50%;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.btn-buy-now-icon svg{width:0.48rem;height:0.48rem}
.pdp-buy-note{margin-top:0.213334rem;font-size:0.256rem;font-weight:700;color:var(--text-secondary)}
.pdp-action-trust{display:flex;flex-wrap:wrap;gap:0.16rem;margin-top:0.266666rem}
.pdp-action-trust span{font-size:0.213334rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:var(--primary);background:rgba(87,76,213,.09);border-radius:13.32rem;padding:0.106666rem 0.266666rem}
.qty-wrap{display:flex;align-items:center;background:var(--bg-alt);border-radius:var(--radius-lg);height:1.493334rem;padding:0 0.16rem}
.qty-btn{width:1.066666rem;height:1.066666rem;border:none;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);transition:color .2s}
.qty-btn:hover{color:var(--primary)}
.qty-btn svg{width:0.533334rem;height:0.533334rem}
.qty-input{width:1.28rem;border:none;background:transparent;text-align:center;font-weight:800;font-size:0.426666rem;color:var(--text);outline:none}
.btn-atc{flex:1;height:1.493334rem;border:none;border-radius:var(--radius-lg);background:var(--primary);color:#fff;font-weight:800;font-size:0.349866rem;text-transform:uppercase;letter-spacing:.12em;cursor:pointer;transition:all .2s;box-shadow:0 0.213334rem 0.64rem rgba(62,47,188,.2)}
.btn-atc:hover{background:var(--primary-strong)}
.btn-atc:disabled,.btn-buy-now:disabled{opacity:.55;cursor:not-allowed;box-shadow:none;transform:none;filter:none}

/* Info Bar */
.info-bar{display:grid;grid-template-columns:1fr 1fr;gap:0.426666rem;margin-top:0.746666rem;padding-top:0.746666rem;border-top:0.026666rem solid var(--border-soft)}
.info-item{display:flex;align-items:flex-start;gap:0.266666rem}
.info-item svg{width:0.586666rem;height:0.586666rem;color:var(--primary);flex-shrink:0;margin-top:0.053334rem}
.info-item .title{font-size:0.290134rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;line-height:1}
.info-item .desc{font-size:0.290134rem;color:var(--text-muted);margin-top:0.08rem}

/* Tabs */
.pdp-tabs{margin-top:1.6rem}
.tab-nav{display:flex;border-bottom:0.026666rem solid var(--border-soft);overflow-x:auto;gap:0}
.tab-btn{padding:0.426666rem 0.746666rem;font-size:0.298666rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;border:none;background:transparent;color:var(--text-muted);cursor:pointer;white-space:nowrap;border-bottom:0.053334rem solid transparent;transition:all .2s}
.tab-btn.active{color:var(--primary);border-bottom-color:var(--primary)}
.tab-btn:hover{color:var(--primary)}
.tab-panel{padding:1.066666rem 0;display:none}
.tab-panel.active{display:block}
.tab-panel h3{font-size:0.597334rem;font-weight:900;text-transform:uppercase;letter-spacing:-.01em;margin:0 0 0.426666rem}
.tab-panel p{color:var(--text-secondary);line-height:1.7;font-weight:500}
.tab-panel .check-list{list-style:none;padding:0;margin:0.533334rem 0 0}
.tab-panel .check-list li{display:flex;align-items:center;gap:0.266666rem;margin-bottom:0.32rem;font-size:0.375466rem;font-weight:600}
.tab-panel .check-list li svg{width:0.533334rem;height:0.533334rem;color:var(--secondary);flex-shrink:0}

/* Progress bars */
.progress-card{background:var(--bg-alt);padding:0.746666rem;border-radius:var(--radius-lg)}
.progress-card h4{font-size:0.3328rem;font-weight:900;text-transform:uppercase;letter-spacing:.1em;margin:0 0 0.426666rem}
.progress-item{margin-bottom:0.373334rem}
.progress-label{display:flex;justify-content:space-between;font-size:0.264534rem;font-weight:800;text-transform:uppercase;margin-bottom:0.16rem}
.progress-bar-k{height:0.213334rem;background:var(--surface-dim);border-radius:26.64rem;overflow:hidden}
.progress-bar-k .fill{height:100%;border-radius:26.64rem}
.progress-bar-k .fill-primary{background:var(--primary)}
.progress-bar-k .fill-secondary{background:var(--secondary)}

/* Recommended */
.rec-card{background:var(--surface);padding:0.426666rem;border-radius:var(--radius-lg);transition:transform .25s}
.rec-card:hover{transform:translateY(-0.106666rem)}
.rec-card-media{aspect-ratio:1;border-radius:var(--radius-md);overflow:hidden;background:var(--bg-alt);margin-bottom:0.373334rem}
.rec-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.rec-card:hover .rec-card-media img{transform:scale(1.06)}
.rec-tag{font-size:0.234666rem;font-weight:800;color:var(--primary);text-transform:uppercase;letter-spacing:.15em}
.rec-name{font-size:0.349866rem;font-weight:800;text-transform:uppercase;margin:0.106666rem 0 0.266666rem}
.rec-price{font-weight:900}
.rec-atc{border:none;background:rgba(87,76,213,.1);color:var(--primary);padding:0.213334rem;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.rec-atc:hover{background:var(--primary);color:#fff}

/* ===== News List Page ===== */
.category-tabs{display:flex;flex-wrap:wrap;gap:0.266666rem;margin-bottom: .5333rem;}
.cat-tab{padding:0.213334rem 0.64rem;border-radius:26.64rem;font-size:0.3072rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;border:none;cursor:pointer;transition:all .2s}
.cat-tab-active{background:var(--primary);color:#fff}
.cat-tab-default{background:var(--surface-dim);color:var(--text-secondary)}
.cat-tab-default:hover{background:#dce2f7}

.news-hero{display:flex;border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-alt);min-height:11.2rem;margin-bottom: .5333rem}
.news-hero-img{flex:2;position:relative;overflow:hidden}
.news-hero-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.news-hero:hover .news-hero-img img{transform:scale(1.05)}
.news-hero-body{flex:1;padding:1.28rem;display:flex;flex-direction:column;justify-content:center}
.news-hero-tag{display:inline-block;padding:0.106666rem 0.32rem;border-radius:0.106666rem;font-size:0.256rem;font-weight:800;text-transform:uppercase;letter-spacing:.15em;background:var(--sale);color:#fff;margin-bottom:0.533334rem;width:fit-content}
.news-hero-title{font-size:0.768rem;font-weight:900;letter-spacing:-.02em;line-height:1.15;margin:0 0 0.426666rem}
.news-hero-excerpt{color:var(--text-secondary);font-size:0.375466rem;line-height:1.6;margin-bottom:0.64rem}
.news-hero-link{display:inline-flex;align-items:center;gap:0.16rem;color:var(--primary);font-size:0.298666rem;font-weight:800;text-transform:uppercase;letter-spacing:.15em;transition:gap .2s}
.news-hero-link:hover{gap:0.32rem}
.news-hero-link svg{width:0.426666rem;height:0.426666rem}

.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0.853334rem}
.news-card{cursor:pointer}
.news-card-media{aspect-ratio:16/9;border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-alt);margin-bottom:0.533334rem}
.news-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.news-card:hover .news-card-media img{transform:scale(1.1)}
.news-card-meta{display:flex;align-items:center;gap:0.266666rem;margin-bottom:0.266666rem}
.news-card-cat{font-size:0.256rem;font-weight:900;text-transform:uppercase;letter-spacing:.15em;color:var(--primary)}
.news-card-dot{width:0.106666rem;height:0.106666rem;border-radius:50%;background:var(--text-muted)}
.news-card-time{font-size:0.256rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}
.news-card-title{font-size:0.490666rem;font-weight:800;line-height:1.35;margin:0 0 0.213334rem;transition:color .2s}
.news-card:hover .news-card-title{color:var(--primary)}
.news-card-excerpt{font-size:0.349866rem;color:var(--text-secondary);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ===== News Detail Page ===== */
.article-container{max-width:22.933334rem;margin:0 auto}
.article-title{font-size:clamp(0.853334rem,5vw,1.493334rem);font-weight:900;letter-spacing:-.03em;line-height:1.1;margin:.5333rem 0 0.853334rem 0;}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0.533334rem;padding:0.533334rem 0;border-top:0.026666rem solid var(--border-soft);border-bottom:0.026666rem solid var(--border-soft)}
.article-author{display:flex;align-items:center;gap:0.32rem}
.article-avatar{width:1.28rem;height:1.28rem;border-radius:50%;overflow:hidden;background:var(--bg-alt)}
.article-avatar img{width:100%;height:100%;object-fit:cover}
.article-author-name{font-weight:700;font-size:0.375466rem}
.article-author-role{font-size:0.290134rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em}
.article-info{display:flex;align-items:center;gap:0.533334rem;color:var(--text-secondary);font-size:0.349866rem}
.article-info svg{width:0.48rem;height:0.48rem;color:var(--primary)}
.article-info-item{display:flex;align-items:center;gap:0.16rem}

.article-featured{width:100%;aspect-ratio:16/9;border-radius:var(--radius-lg);overflow:hidden;margin-bottom:1.28rem;box-shadow:var(--shadow-xl)}
.article-featured img{width:100%;height:100%;object-fit:cover}

.article-body{font-size:0.426666rem;line-height:1.8;color:var(--text-secondary)}
.article-body p{margin-bottom:0.64rem}
.article-body .article-lead{font-size:0.512rem;line-height:1.7;color:var(--text);font-weight:600}
.article-body h2{font-size:0.64rem;font-weight:900;letter-spacing:-.01em;color:var(--text);margin:1.28rem 0 0.426666rem}
.article-body img{display:block;max-width:100%;height:auto;margin:1.066666rem auto;border-radius:var(--radius-lg)}
.article-body ul,.article-body ol{margin:0 0 0.64rem 0.64rem}
.article-body li{margin-bottom:0.213334rem}
.article-body .callout{background:var(--bg-alt);padding:0.853334rem;border-radius:var(--radius-lg);margin:1.066666rem 0;position:relative;overflow:hidden;border:0.026666rem solid var(--border-soft)}
.article-body .callout-label{font-size:0.256rem;font-weight:900;color:var(--primary);text-transform:uppercase;letter-spacing:.2em;margin-bottom:0.213334rem}
.article-body .callout p{font-style:italic;font-size:0.469334rem;color:var(--text);margin:0}
.article-body .dual-img{display:grid;grid-template-columns:1fr 1fr;gap:0.533334rem;margin:1.066666rem 0}
.article-body .dual-img img{width:100%;height:6.933334rem;object-fit:cover;border-radius:var(--radius-lg);box-shadow:var(--shadow-soft)}

.article-tags{display:flex;flex-wrap:wrap;gap:0.213334rem;margin-top:1.28rem}
.article-tag{padding:0.213334rem 0.533334rem;border-radius:26.64rem;font-size:0.256rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;background:var(--surface-dim);color:var(--primary);cursor:pointer;transition:all .2s;border:none}
.article-tag:hover{background:var(--primary);color:#fff}

.article-nav{display:flex;align-items:center;justify-content:space-between;padding:1.066666rem 0;border-top:0.026666rem solid var(--border-soft);font-size:0.426666rem}
.article-nav a{display:flex;align-items:center;gap:0.206666rem;transition:color .2s}
.article-nav a:hover{color:var(--primary)}
.article-nav svg{width:0.96rem;height:0.96rem;flex:0 0 auto}
.article-nav .nav-label{font-size:0.256rem;font-weight:800;text-transform:uppercase;letter-spacing:.15em;color:var(--text-muted);display:flex;align-items:center;gap:0.16rem}
.article-nav .nav-label svg{width:0.373334rem;height:0.373334rem}
.article-nav .nav-title{font-weight:800;font-size:0.375466rem;line-height:1.45;max-width:5.333334rem}
.article-nav-next .nav-label{justify-content:flex-end;text-align:right}
.article-nav-next .nav-title{text-align:right}
.article-nav .divider{width:0.026666rem;height:1.066666rem;background:var(--border-soft)}

.related-section{background:var(--bg-alt);padding:1.133334rem 0;}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0.746666rem}
.related-card{background:var(--surface);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 0.053334rem 0.213334rem rgba(20,27,43,.04);transition:all .3s}
.related-card:hover{box-shadow:var(--shadow-xl);transform:translateY(-0.106666rem)}
.related-card-media{height:5.333334rem;overflow:hidden}
.related-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.related-card:hover .related-card-media img{transform:scale(1.05)}
.related-card-body{padding:0.64rem}
.related-card-cat{font-size:0.234666rem;font-weight:900;text-transform:uppercase;letter-spacing:.2em;color:var(--primary)}
.related-card-title{font-size:0.448rem;font-weight:800;line-height:1.35;margin:0.213334rem 0}
.related-card-excerpt{font-size:0.3328rem;color:var(--text-secondary);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ===== About Page ===== */
.about-hero{position:relative;min-height:16rem;display:flex;align-items:center;overflow:hidden;padding:2.133334rem 0}
.about-hero-bg{position:absolute;right:0;top:0;width:50%;height:100%;overflow:hidden}
.about-hero-bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.about-hero-bg .overlay{position:absolute;inset:0;background:linear-gradient(to right,var(--bg) 0%,rgba(249,249,255,.4) 50%,transparent 100%)}
.about-hero-chip{font-size:0.256rem;font-weight:800;color:var(--primary);text-transform:uppercase;letter-spacing:.2em;margin-bottom:0.426666rem;display:block}
.about-hero-title{font-size:clamp(1.066666rem,6vw,1.92rem);font-weight:900;letter-spacing:-.04em;line-height:.9;margin:0 0 0.853334rem}
.about-hero-title .gradient{background:linear-gradient(135deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.about-hero-copy{font-size:0.469334rem;color:var(--text-secondary);max-width:17.066666rem;margin-bottom:0.853334rem}

.brand-story{background:var(--bg-alt);padding:1.3333rem 0 .6667rem 0}
.brand-story-img{aspect-ratio:1/1; border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-xl)}
.brand-story-img img{width:100%;height:100%;object-fit:cover}
.brand-story h2{font: size 0.8em;font-weight:900;letter-spacing:-.02em;margin:0 0 0.64rem}
.brand-story p{color:var(--text-secondary);line-height: 1.4;margin-bottom:0.533334rem; font-size: .3733rem;}

.value-section{padding:1.3333rem 0}
.value-card{background:var(--surface);padding:1.066666rem;border-radius:var(--radius-lg);border:0.026666rem solid var(--border-soft);transition:all .3s}
.value-card:hover{transform:translateY(-0.213334rem);box-shadow:var(--shadow-soft)}
.value-icon{width:1.493334rem;height:1.493334rem;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;margin-bottom:0.746666rem}
.value-icon svg{width:0.746666rem;height:0.746666rem}
.value-icon-primary{background:rgba(87,76,213,.1);color:var(--primary)}
.value-icon-secondary{background:rgba(29,78,216,.1);color:var(--secondary)}
.value-icon-tertiary{background:rgba(156,74,0,.1);color:var(--sale)}
.value-card h3{font-size:0.597334rem;font-weight:900;margin:0 0 0.32rem}
.value-card p{color:var(--text-secondary);line-height:1.7}

.timeline-section{background:var(--bg-alt);padding:1.3333rem 0 .6667rem 0;overflow:hidden}
.timeline{position:relative;max-width:21.333334rem;margin:0 auto}
.timeline::before{content:'';position:absolute;left:50%;transform:translateX(-50%);width:0.053334rem;height:100%;background:linear-gradient(to bottom,transparent,var(--border-soft),transparent)}
.timeline-item{display:flex;align-items:center;margin-bottom:1.28rem;position:relative}
.timeline-item:nth-child(odd){flex-direction:row-reverse}
.timeline-dot{width:1.066666rem;height:1.066666rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.298666rem;font-weight:900;flex-shrink:0;z-index:1;position:absolute;left:50%;transform:translateX(-50%)}
.timeline-dot-active{background:var(--primary);color:#fff}
.timeline-dot-default{background:var(--surface-dim);color:var(--primary)}
.timeline-content{width:calc(50% - 1.066666rem);background:var(--surface);padding:0.64rem;border-radius:var(--radius-lg);box-shadow:0 0.053334rem 0.213334rem rgba(20,27,43,.04)}
.timeline-content h4{font-size:0.490666rem;font-weight:900;margin:0 0 0.16rem}
.timeline-content p{font-size:0.362666rem;color:var(--text-secondary);line-height:1.6;margin:0}

.team-section{padding: 1.3333rem 0}
.team-card{position:relative}
.team-card-img{aspect-ratio:3/4;border-radius:var(--radius-lg);overflow:hidden;margin-bottom:0.533334rem;position:relative}
.team-card-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:all .5s}
.team-card:hover .team-card-img img{filter:grayscale(0)}
.team-card-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(62,47,188,.8),transparent);opacity:0;transition:opacity .3s;display:flex;align-items:flex-end;padding:0.64rem}
.team-card:hover .team-card-overlay{opacity:1}
.team-card-overlay svg{width:0.533334rem;height:0.533334rem;color:#fff}
.team-card h4{font-size:0.490666rem;font-weight:900;margin:0 0 0.106666rem}
.team-card .role{font-size:0.277334rem;font-weight:800;color:var(--primary);text-transform:uppercase;letter-spacing:.12em}

/* ===== Auth Pages (Login / Register) ===== */
.auth-wrap{min-height:calc(100vh - 5.333334rem);display:flex;align-items:center;justify-content:center;padding:1.6rem 0.64rem;position:relative;overflow:hidden}
.auth-glow{position:absolute;border-radius:50%;filter:blur(2.666666rem);opacity:.08}
.auth-glow-r{width:10.666666rem;height:10.666666rem;background:var(--primary-strong);top:-10%;right:-5%}
.auth-glow-l{width:8rem;height:8rem;background:var(--secondary);bottom:-10%;left:-5%}
.auth-card{width:100%;max-width:12.8rem;background:var(--surface);border-radius:var(--radius-lg);padding:0.533333rem;box-shadow:var(--shadow-soft);border:0.026666rem solid var(--border-soft);position:relative;z-index:1}
.auth-card h1{font-size:0.768rem;font-weight:900;letter-spacing:-.02em;margin:0 0 0.213334rem}
.auth-card .subtitle{color:var(--text-secondary);font-size:0.362666rem;margin-bottom:0.853334rem}
.auth-label{display:block;font-size:0.277334rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:0.16rem}
.auth-input-wrap{position:relative;margin-bottom:0.533334rem}
.auth-input-wrap svg{position:absolute;left:0.373334rem;top:50%;transform:translateY(-50%);width:0.48rem;height:0.48rem;color:var(--text-muted)}
.auth-input{width:100%;height:1.28rem;background:var(--bg-alt);border:none;border-radius:var(--radius-sm);padding-left:1.12rem;padding-right:0.426666rem;font-size:0.362666rem;color:var(--text);outline:none;transition:box-shadow .2s}
.auth-input:focus{box-shadow:0 0 0 0.053334rem var(--primary)}
.auth-input-plain{padding-left:0.426666rem}
.auth-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.64rem}
.auth-check{display:flex;align-items:center;gap:0.213334rem;font-size:0.349866rem;color:var(--text-secondary);cursor:pointer}
.auth-check input{accent-color:var(--primary);width:0.426666rem;height:0.426666rem}
.auth-forgot{font-size:0.349866rem;color:var(--primary);font-weight:600}
.auth-forgot:hover{text-decoration:underline}
.auth-submit{width:100%;height:1.28rem;border:none;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--primary-strong),var(--primary));color:#fff;font-weight:800;font-size:0.349866rem;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;transition:filter .2s;display:flex;align-items:center;justify-content:center;gap:0.213334rem}
.auth-submit:hover{filter:brightness(1.06)}
.auth-submit svg{width:0.48rem;height:0.48rem}
.auth-divider{display:flex;align-items:center;gap:0.426666rem;margin:0.853334rem 0}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:0.026666rem;background:var(--border-soft)}
.auth-divider span{font-size:0.256rem;font-weight:900;text-transform:uppercase;letter-spacing:.2em;color:var(--text-muted)}
.social-btns{display:grid;grid-template-columns:1fr 1fr;gap:0.32rem;margin-bottom:0.746666rem}
.social-btn{display:flex;align-items:center;justify-content:center;gap:0.213334rem;height:1.173334rem;border-radius:var(--radius-sm);border:0.026666rem solid var(--border-soft);background:transparent;font-size:0.349866rem;font-weight:600;cursor:pointer;transition:background .2s}
.social-btn:hover{background:var(--bg-alt)}
.social-btn svg{width:0.48rem;height:0.48rem}
.auth-footer-text{text-align:center;font-size:0.362666rem;color:var(--text-secondary)}
.auth-footer-text a{color:var(--primary);font-weight:700}
.auth-footer-text a:hover{text-decoration:underline}
.auth-terms{display:flex;align-items:flex-start;gap:0.266666rem;margin-bottom:0.64rem}
.auth-terms input{accent-color:var(--primary);width:0.48rem;height:0.48rem;margin-top:0.053334rem;flex-shrink:0}
.auth-terms label{font-size:0.349866rem;color:var(--text-secondary);line-height:1.5}
.auth-terms a{color:var(--primary);font-weight:600}
.auth-pw-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.32rem;margin-bottom:0.533334rem}

/* Responsive — inner pages */
@media(max-width:149.9975rem){
  .plp-grid{grid-template-columns:repeat(3,1fr)}
  .news-grid{grid-template-columns:repeat(2,1fr)}
  .related-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:123.9975rem){
  .plp-grid{grid-template-columns:repeat(2,1fr)}
  .pdp-gallery{flex-direction:column}
  .pdp-thumbs{flex-direction:row;width:100%;order:2}
  .pdp-thumb{width:1.6rem}
  .newsletter-form{flex-direction:column}
  .info-bar{grid-template-columns:1fr}
  .news-hero{flex-direction:column}
  .news-hero-img{min-height:7.466666rem}
  .news-hero-body{padding:0.853334rem}
  .news-grid{grid-template-columns:repeat(2,1fr)}
  .related-grid{grid-template-columns:1fr}
  .about-hero{min-height:auto;padding:0.8rem 0}
  .about-hero-bg{display:none}
  .timeline-item,.timeline-item:nth-child(odd){flex-direction:column;align-items:flex-start;padding-left:1.6rem}
  .timeline::before{left:0.533334rem}
  .timeline-dot{left:0.533334rem;transform:translateX(-50%)}
  .timeline-content{width:100%}
  .article-body .dual-img{grid-template-columns:1fr}
  .auth-pw-grid{grid-template-columns:1fr}
}
@media(max-width:20.479466rem){
  .plp-grid{grid-template-columns:1fr 1fr;gap:0.426666rem 0.32rem}
  .plp-name{font-size:0.375466rem;min-height:auto}
  .plp-price{font-size:0.469334rem}
  .page-header h1{font-size:0.853334rem}
  .tab-btn{padding:0.32rem 0.426666rem;font-size:0.264534rem}
  .news-grid{grid-template-columns:1fr}
  .news-hero-title{font-size:0.597334rem}
  .article-title{font-size:0.768rem}
  .article-meta{flex-direction:column;align-items:flex-start}
  .about-hero-title{font-size:1.066666rem}
  .auth-card{padding:0.746666rem}
}
