.category-page { padding-top:88px;background:#f4f5f1;min-height:70vh }
.category-banner { background:#273839;color:#fff;padding:82px 25px 76px }
.category-banner__inner { max-width:1160px;margin:auto;text-align:center }
.category-banner h1 { font-size:clamp(36px,5vw,68px);margin:0;letter-spacing:-.05em }
.category-banner p:not(.eyebrow) { color:#c8d3cc;margin:12px auto 0;max-width:650px }
.category-tabs { background:#fff;border-bottom:1px solid #e0e5df;position:sticky;top:calc(88px + var(--wp-admin--admin-bar--height, 0px));z-index:8 }
.category-tabs__inner { max-width:1160px;margin:auto;display:flex;justify-content:center;gap:8px;overflow-x:auto;padding:14px 20px }
.category-tabs a { padding:8px 18px;white-space:nowrap;font-size:14px;color:#76817b;border-radius:2px }
.category-tabs a:hover,.category-tabs a.is-active { background:#e9f0ec;color:#b27a43 }
.category-content { max-width:1160px;margin:auto;padding:70px 25px 100px }
.news-read-more { font-size:12px;color:#b27a43;border-bottom:1px solid #b27a43;padding-bottom:4px }
.news-read-more span { font-size:17px;margin-left:10px }
.category-pagination { text-align:center;padding-top:48px;color:#b27a43 }
.category-pagination a,.category-pagination span { display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;margin:0 3px;border:1px solid #d5ded7;font-size:12px }
.category-pagination a:hover,.category-pagination .this-page { background:#b27a43;color:#fff;border-color:#b27a43 }
.category-empty { text-align:center;color:#77827d;border:1px dashed #cbd5ce;padding:50px }
.category-page .site-footer { margin-top:0 }
@media(max-width:900px) {
  .category-page { padding-top:72px }
  .category-tabs { top:calc(72px + var(--wp-admin--admin-bar--height, 0px)) }
}
@media(max-width:560px) {
  .category-banner { padding:55px 20px }
  .category-tabs__inner { justify-content:flex-start }
  .category-content { padding:48px 18px 70px }
}
/* Material category page */
.material-page { padding-top:88px;background:#fff;min-height:70vh }
.material-category-nav { border-bottom:1px solid #e4e8e3;background:#fff }
.material-category-nav__inner { max-width:1160px;margin:auto;display:flex;gap:10px;overflow-x:auto;padding:18px 25px }
.material-category-nav a,.material-article-tab { flex:0 0 auto;border:1px solid #e1e6e1;color:#36433f;background:#fff;padding:10px 20px;font-size:14px;white-space:nowrap;transition:background .2s,color .2s,border-color .2s }
.material-category-nav a:hover,.material-category-nav a.is-active,.material-article-tab:hover,.material-article-tab.is-active { background:#b27a43;border-color:#b27a43;color:#fff }
.material-content { max-width:1160px;margin:auto;padding:64px 25px 100px }
.material-content__head { margin-bottom:32px }
.material-content__head h2 { font-size:30px;font-weight:500;margin:8px 0 0;color:#263b36 }
.material-article-tabs { display:flex;gap:10px;overflow-x:auto;padding-bottom:32px }
.material-article-panel { display:none;grid-template-columns:minmax(280px,36%) 1fr;gap:42px;align-items:start }
.material-article-panel.is-active { display:grid }
.material-article-panel__cover { display:block;aspect-ratio:4/5;background:#e3e8e3;overflow:hidden }
.material-article-panel__cover img { width:100%;height:100%;object-fit:cover;transition:transform .4s }
.material-article-panel__cover:hover img { transform:scale(1.04) }
.material-article-panel__body { min-width:0;padding:4px 0 }
.material-article-panel__body h3 { font-size:28px;font-weight:500;line-height:1.3;margin:9px 0 20px;color:#263b36 }
.material-article-panel__body h3 a:hover,.material-article-panel__more:hover { color:#b27a43 }
.material-article-panel__description { max-height:370px;overflow:auto;color:#54615c;font-size:15px;line-height:2 }
.material-article-panel__description>*:first-child { margin-top:0 }
.material-article-panel__description h1,.material-article-panel__description h2,.material-article-panel__description h3 { font-size:18px;font-weight:600;margin:18px 0 8px }
.material-article-panel__description p { margin:0 0 14px }
.material-article-panel__description img { max-width:100%;height:auto }
.material-article-panel__more { display:inline-block;margin-top:24px;border-bottom:1px solid currentColor;padding-bottom:4px;color:#263b36;font-size:13px }
.material-article-panel__more span { margin-left:10px;font-size:18px;vertical-align:-1px }
@media(max-width:900px) {
  .material-page { padding-top:72px }
  .material-article-panel { gap:28px }
  .material-content { padding-top:50px }
}
@media(max-width:640px) {
  .material-page { padding-top:64px }
  .material-category-nav__inner,.material-content { padding-left:16px;padding-right:16px }
  .material-category-nav__inner { padding-top:12px;padding-bottom:12px }
  .material-category-nav a,.material-article-tab { padding:8px 14px;font-size:13px }
  .material-content { padding-top:38px;padding-bottom:62px }
  .material-content__head h2 { font-size:25px }
  .material-article-tabs { padding-bottom:22px }
  .material-article-panel { grid-template-columns:1fr;gap:22px }
  .material-article-panel__cover { aspect-ratio:4/3 }
  .material-article-panel__body h3 { font-size:24px }
  .material-article-panel__description { max-height:none;font-size:14px;line-height:1.9 }
}
/* Article-name tabs intentionally do not navigate; only the detail controls do. */
.material-article-tab { appearance:none;cursor:pointer;font-family:inherit }
.material-article-panel__summary { max-height:none!important;overflow:visible!important;padding:0!important;color:#4f5c56!important;font-size:17px!important;line-height:2!important }
.material-article-panel__summary p { margin:0 0 14px!important }
.material-article-panel__summary p:last-child { margin-bottom:0!important }
.material-article-panel__summary ul,.material-article-panel__summary ol { margin:0 0 14px!important;padding-left:1.5em!important }
.material-article-panel__summary li { margin-bottom:6px!important }
.material-article-panel__summary br { content:"";display:block;margin-top:.45em }
.material-article-panel__summary:empty { display:none!important }
.material-article-panel__summary + .material-article-panel__more { display:inline-block!important }
@media(max-width:640px) {
  .material-article-panel__summary { font-size:15px!important;line-height:1.9!important }
}
/* Keep the material banner free of overlay text. */
.material-page .material-page__banner .category-banner__inner { display:none!important }
.material-page .material-page__banner { min-height:340px!important;padding:0!important;background-position:center!important;background-repeat:no-repeat!important;background-size:cover!important }
.material-page .material-page__banner::after { display:none!important }
.material-page .material-page__banner.category-banner--custom-bg { background-image:var(--material-banner-image)!important }
/* Material page follows the product collection banner and the material-detail
   composition: horizontal names, a fixed visual column, and a reading column. */
.material-page { padding-top:88px!important;background:#f7f7f5!important }
.material-page .material-page__banner { display:flex!important;min-height:420px!important;padding:80px 25px 74px!important;align-items:center!important;background:#273839!important }
.material-category-nav { background:#fff!important;border-bottom:1px solid #e3e5e1!important }
.material-category-nav__inner { box-sizing:border-box!important;max-width:1600px!important;min-height:88px!important;margin:0 auto!important;padding:18px 36px!important;gap:12px!important;align-items:center!important;justify-content:flex-start!important }
.material-category-nav a { box-sizing:border-box!important;min-width:112px!important;padding:13px 18px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#52615a!important;text-align:center!important;font-size:15px!important;line-height:1.2!important }
.material-category-nav a:hover,.material-category-nav a.is-active { background:#b98248!important;color:#fff!important }
.material-content { box-sizing:border-box!important;max-width:1600px!important;margin:0 auto!important;padding:56px 36px 110px!important;background:#fff!important }
.material-content__head { margin:0 0 28px!important }
.material-content__head .eyebrow { margin:0 0 14px!important;color:#b98248!important }
.material-content__head h2 { margin:0!important;color:#283b34!important;font-size:30px!important;font-weight:500!important;line-height:1.3!important }
.material-content__head h2 small { color:#a7aaa5!important;font-size:16px!important;font-weight:400!important }
.material-article-tabs { box-sizing:border-box!important;display:flex!important;gap:12px!important;overflow-x:auto!important;margin:0!important;padding:0 4px 33px!important }
.material-article-tab { box-sizing:border-box!important;min-width:164px!important;padding:15px 20px!important;border:1px solid #e4e6e2!important;border-radius:0!important;background:#fff!important;color:#1f2925!important;font-size:16px!important;line-height:1.25!important;text-align:center!important }
.material-article-tab:hover,.material-article-tab.is-active { border-color:#b98248!important;background:#b98248!important;color:#fff!important }
.material-article-panels { border-top:1px solid #eceeea!important;padding-top:32px!important }
.material-article-panel { box-sizing:border-box!important;display:none!important;grid-template-columns:416px minmax(0,1fr)!important;gap:48px!important;align-items:start!important }
.material-article-panel.is-active { display:grid!important }
.material-article-panel__cover { width:416px!important;height:416px!important;aspect-ratio:auto!important;background:#eaede8!important }
.material-article-panel__cover img { display:block!important;width:100%!important;height:100%!important;object-fit:cover!important }
.material-article-panel__body { box-sizing:border-box!important;padding:4px 0 0!important }
.material-article-panel__body .eyebrow { margin:0 0 12px!important;color:#b98248!important }
.material-article-panel__body h3 { margin:0 0 20px!important;color:#1f2925!important;font-size:28px!important;font-weight:500!important;line-height:1.3!important }
.material-article-panel__description { max-height:420px!important;overflow-y:auto!important;padding-right:22px!important;color:#222!important;font-size:16px!important;line-height:2.2!important }
.material-article-panel__description h1,.material-article-panel__description h2,.material-article-panel__description h3 { margin:0 0 12px!important;color:#111!important;font-size:20px!important;font-weight:600!important }
.material-article-panel__description p { margin:0 0 16px!important }
.material-article-panel__more { margin-top:24px!important;color:#b98248!important;font-size:14px!important }
.material-article-panel__more:hover { color:#273839!important }
@media(max-width:900px) {
  .material-page { padding-top:72px!important }
  .material-page .material-page__banner { min-height:300px!important;padding:58px 24px!important }
  .material-page .category-banner h1 { font-size:48px!important }
  .material-category-nav__inner,.material-content { padding-left:24px!important;padding-right:24px!important }
  .material-article-panel { grid-template-columns:320px minmax(0,1fr)!important;gap:30px!important }
  .material-article-panel__cover { width:320px!important;height:360px!important }
}
@media(max-width:640px) {
  .material-page { padding-top:64px!important }
  .material-page .material-page__banner { min-height:240px!important;padding:46px 16px!important }
  .material-category-nav__inner { min-height:0!important;padding:10px 16px!important;gap:6px!important }
  .material-category-nav a { min-width:auto!important;padding:9px 13px!important;font-size:13px!important }
  .material-content { padding:38px 16px 66px!important }
  .material-content__head h2 { font-size:24px!important }
  .material-content__head h2 small { display:block!important;margin-top:6px!important;font-size:13px!important }
  .material-article-tabs { gap:8px!important;padding-bottom:22px!important }
  .material-article-tab { min-width:136px!important;padding:11px 14px!important;font-size:14px!important }
  .material-article-panels { padding-top:22px!important }
  .material-article-panel.is-active { display:block!important }
  .material-article-panel__cover { width:100%!important;height:auto!important;aspect-ratio:4/3!important;margin-bottom:24px!important }
  .material-article-panel__body h3 { font-size:24px!important }
  .material-article-panel__description { max-height:none!important;padding-right:0!important;font-size:15px!important;line-height:2!important }
}
/* Product banner keeps the original full-height hero while remaining text-free. */
.category-page--product .category-banner { min-height:340px;box-sizing:border-box;background-position:center;background-size:cover;background-repeat:no-repeat }
.category-page--product .category-banner__inner { display:none }
.category-page--product .product-filter-row { display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:18px }
.category-page--product .product-filter-row>strong { font-family:var(--font-sans,Arial,sans-serif);font-size:14px;line-height:1.4;white-space:nowrap }
.category-page--product .product-filter-options a { font-family:var(--font-sans,Arial,sans-serif);font-size:13px }
.category-page--product .result-summary { font-family:var(--font-sans,Arial,sans-serif);font-size:13px }
/* Product gallery mode (P15) */
.product-gallery { width:100% }
.gallery-group { margin:44px 0 }
.gallery-group+ .gallery-group { padding-top:44px;border-top:1px solid #dfe5df }
.gallery-group__head { display:flex;align-items:baseline;gap:14px;margin-bottom:20px }
.gallery-group__title { margin:0;color:#263b36;font:22px var(--font-serif);font-weight:600 }
.gallery-group__count { color:var(--brass,#b7824b);font-size:13px;letter-spacing:.12em }
.gallery-group__grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px }
.gallery-thumb { display:block;overflow:hidden;aspect-ratio:4/3;padding:0;border:0;background:#dfe6e0;cursor:zoom-in }
.gallery-thumb img { display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s }
.gallery-lens { position:fixed;z-index:210;width:180px;height:180px;border-radius:50%;border:2px solid var(--brass,#b7824b);box-shadow:0 8px 24px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.6) inset;background-repeat:no-repeat;background-color:#fff;pointer-events:none;display:none }
.gallery-lightbox { position:fixed;inset:0;z-index:200;background:rgba(16,22,20,.93);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s }
.gallery-lightbox.is-open { opacity:1;visibility:visible }
.gallery-lightbox__image { max-width:88vw;max-height:80vh;object-fit:contain;box-shadow:0 20px 60px rgba(0,0,0,.5) }
.gallery-lightbox__caption { position:absolute;bottom:28px;color:#fff;font-size:13px;letter-spacing:.08em }
.gallery-lightbox__caption span { color:var(--brass,#b7824b);margin-left:12px }
.gallery-lightbox__button { position:absolute;width:46px;height:46px;border:1px solid rgba(255,255,255,.4);border-radius:50%;background:transparent;color:#fff;font-size:26px;line-height:1;cursor:pointer }
.gallery-lightbox__button:hover { border-color:var(--brass,#b7824b);background:var(--brass,#b7824b) }
.gallery-lightbox__close { top:24px;right:24px }
.gallery-lightbox__prev { left:24px }
.gallery-lightbox__next { right:24px }
body.gallery-lightbox-open { overflow:hidden }
@media(max-width:900px) {
  .gallery-group__grid { grid-template-columns:repeat(3,1fr);gap:10px }
  .gallery-group__head { flex-wrap:wrap }
  .gallery-group__count { flex-basis:100% }
}
@media(max-width:560px) {
  .gallery-group { margin:32px 0 }
  .gallery-group+ .gallery-group { padding-top:32px }
  .gallery-group__grid { grid-template-columns:repeat(2,1fr);gap:8px }
  .gallery-group__title { font-size:18px }
  .gallery-lightbox__button { width:38px;height:38px;font-size:21px }
  .gallery-lightbox__caption { font-size:12px;bottom:18px }
}
@media(hover:none) {
  .gallery-lens { display:none!important }
}
/* P16 gallery modes */
.category-page--product .category-content--mosaic { box-sizing:border-box;max-width:none;margin:0;padding:36px max(16px,calc((100vw - 1680px)/2)) 60px }
.category-page--product .category-content--mosaic .result-summary { max-width:1680px;margin:0 auto 18px }
.category-page--product .category-content--mosaic .mosaic { columns:5;column-gap:14px }
.category-page--product .category-content--mosaic .mosaic { position:relative;max-height:none;overflow:visible }
.category-page--product .category-content--mosaic .mosaic::after { display:none }
/* 筛选区悬浮置顶：整个筛选堆叠（分类+属性+已选条件）随滚动吸附，
   header 可见时停在其下方，header 下滑隐藏（body.header-hidden）后贴顶。
   sticky 依赖 responsive.css 中 body overflow-x:clip 的修复（hidden 会让
   body 变成滚动容器、后代 sticky 全部失效）。
   登录态须叠加 WP admin bar 高度（与 header 的 fixed 偏移一致）。 */
.category-page--product .product-filter-stack { position:sticky;top:calc(88px + var(--wp-admin--admin-bar--height, 0px));z-index:19;box-shadow:0 6px 14px rgba(34,53,48,.06);transition:top .3s }
body.header-hidden .category-page--product .product-filter-stack { top:var(--wp-admin--admin-bar--height, 0px) }
.category-page--product .product-filters { position:static }
.gallery-row { position:relative }
.gallery-row__grid { position:relative }
.category-page--product .gallery-row__grid>.carousel-arrow--prev { left:-18px;top:50%;transform:translateY(-50%) }
.category-page--product .gallery-row__grid>.carousel-arrow--next { right:-18px;top:50%;transform:translateY(-50%) }
.category-page--product .carousel-arrow:hover { background:var(--brass,#b7824b);color:#fff }
.mosaic { columns:5;column-gap:14px }
.mosaic-item { display:block;width:100%;break-inside:avoid;margin:0 0 14px;padding:0;border:0;background:#dfe6e0;cursor:pointer }
.mosaic-item--static { cursor:default }
.mosaic-item--static:hover { outline:0;transform:none }
.mosaic-item img { display:block;width:100%;height:auto }
.mosaic-item:hover { outline:2px solid var(--brass,#b7824b);transform:translateY(-2px) }
/* B-state layered carousel: 3 full cards centred, 1 semi-transparent card
   peeking out behind each arrow (home-page 精选案例 pattern). The track is
   wider than the viewport and shifted by one slot-width fraction so the
   peeking cards sit outside the 3-card centre. JS assigns is-main to slots
   0-2 and is-side to the cards adjacent beyond them. */
.group-carousel { position:relative;overflow:hidden;margin:0 -70px;padding:0 70px }
.group-carousel__track { display:flex;align-items:center;gap:14px;overflow:visible;padding:0 0 6px }
.group-carousel .gallery-thumb { flex:0 0 calc((100% - 56px)/5);width:auto;height:auto;aspect-ratio:4/3;transition:opacity .3s,transform .3s,filter .3s }
.group-carousel .gallery-thumb.is-main { position:relative;z-index:1 }
.group-carousel .gallery-thumb.is-side { position:relative;z-index:0;opacity:.32;transform:scale(.84);filter:saturate(.7) }
.group-carousel .gallery-thumb.is-hidden { display:none }
.gallery-group__all { margin-left:12px;border:1px solid var(--brass,#b7824b);padding:4px 10px;color:var(--brass,#b7824b);font-size:12px }
.gallery-row__grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px }
.group-carousel .group-carousel__track { transform:none }
@media(max-width:1100px) {
  .group-carousel { margin:0 -40px;padding:0 40px }
}
@media(max-width:900px) {
  .group-carousel { margin:0 -24px;padding:0 24px }
  .group-carousel .gallery-thumb { flex-basis:calc((100% - 14px)/2) }
}
@media(max-width:560px) {
  .group-carousel { margin:0;padding:0 44px }
  .group-carousel .group-carousel__track { transform:none;padding:0 }
  .group-carousel .gallery-thumb { flex-basis:100% }
  .group-carousel .gallery-thumb.is-side { display:none }
}
.category-page--product .carousel-arrow { position:absolute;z-index:3;width:42px;height:52px;border:1px solid #d8dfda;border-radius:50%;background:rgba(255,255,255,.94);color:var(--brass,#b7824b);font-size:18px;cursor:pointer;box-shadow:0 8px 22px rgba(32,53,43,.09) }
.category-page--product .group-carousel>.carousel-arrow--prev { left:48px;top:50%;transform:translateY(-50%) }
.category-page--product .group-carousel>.carousel-arrow--next { right:48px;top:50%;transform:translateY(-50%) }
.category-page--product .gallery-row__grid>.carousel-arrow--prev { left:8px }
.category-page--product .gallery-row__grid>.carousel-arrow--next { right:8px }
.category-page--product .category-pagination--mosaic { padding-top:28px }
.category-page--product .category-pagination--mosaic a,.category-page--product .category-pagination--mosaic span { min-width:72px;padding:0 14px }
.category-page--product .category-pagination--mosaic .is-disabled { opacity:.45 }
.gallery-load-more { display:block;margin:18px auto;padding:8px 18px;border:1px solid var(--brass,#b7824b);background:transparent;color:var(--brass,#b7824b) }
@media(max-width:1400px) {
  .category-page--product .category-content--mosaic .mosaic { columns:4 }
}
@media(max-width:1100px) {
  .category-page--product .category-content--mosaic .mosaic { columns:3 }
}
@media(max-width:900px) {
  .category-page--product .product-filter-stack { top:calc(72px + var(--wp-admin--admin-bar--height, 0px)) }
  .category-page--product .gallery-row__grid>.carousel-arrow--prev { left:-12px;width:32px;height:32px }
  .category-page--product .gallery-row__grid>.carousel-arrow--next { right:-12px;width:32px;height:32px }
  .mosaic { columns:3 }
  .gallery-row__grid { grid-template-columns:repeat(3,1fr) }
}
@media(max-width:560px) {
  .category-page--product .gallery-row__grid>.carousel-arrow--prev { left:-8px }
  .category-page--product .gallery-row__grid>.carousel-arrow--next { right:-8px }
  .mosaic { columns:2 }
  .gallery-row__grid { grid-template-columns:repeat(2,1fr) }
  .category-page--product .group-carousel>.carousel-arrow--prev { left:8px }
  .category-page--product .group-carousel>.carousel-arrow--next { right:8px }
}
.category-page--product .carousel-arrow { width:42px;height:52px;border-color:#d8dfda;background:rgba(255,255,255,.94);box-shadow:0 8px 22px rgba(32,53,43,.09) }
.category-page--product .selected-filters .selected-filter { display:inline-flex;align-items:center;gap:6px;margin:0;padding:4px 8px;border:1px solid #e4d2b9;background:#fff;color:var(--brass-deep,#9a693d);text-decoration:none }
.category-page--product .selected-filters .selected-filter b { padding:0;border:0;background:transparent;color:var(--brass,#b7824b);font-weight:500 }
.category-page--product .selected-filters .selected-filter:hover { border-color:var(--brass,#b7824b);background:#fbf5ee }
.category-page--product .selected-filters__clear { margin-left:auto;color:var(--brass-deep,#9a693d);text-decoration:underline }
