.category-hero { padding: 48px 0 60px; color: var(--paper); border-bottom: 8px solid var(--yellow); background: var(--ink); }
.category-hero__kicker { margin: 0 0 9px; color: var(--yellow); font-size: 11px; font-weight: 800; letter-spacing: 2px; }
.category-hero h1 { margin: 0; font-size: 52px; line-height: 1.15; }
.category-hero__description { max-width: 760px; margin: 18px 0 0; color: #cbd3cc; font-size: 17px; }

.category-subnav { position: sticky; top: 0; z-index: 45; border-bottom: 1px solid var(--line); background: var(--canvas); box-shadow: 0 8px 18px rgba(22, 31, 25, .08); }
.category-subnav__inner { display: flex; flex-wrap: wrap; gap: 0; min-height: 54px; align-items: stretch; }
.category-subnav a { display: flex; align-items: center; padding: 10px 16px; border-right: 1px solid var(--line); font-size: 13px; font-weight: 700; }
.category-subnav a:first-child { border-left: 1px solid var(--line); }
.category-subnav a:hover, .category-subnav a.active, .category-subnav a.is-active, .category-subnav a.is-current { color: var(--paper); background: var(--green); }

.category-content { padding: 72px 0 90px; }
.category-content__layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 58px; align-items: start; }
.category-list__heading { margin-bottom: 24px; padding-bottom: 20px; border-bottom: 3px solid var(--ink); }
.category-list__heading p { margin: 0 0 5px; color: var(--green); font-size: 12px; font-weight: 800; }
.category-list__heading h2 { margin: 0; font-size: 26px; }
.category-item { display: grid; grid-template-columns: 245px minmax(0, 1fr); gap: 28px; padding: 30px 0; border-bottom: 1px solid var(--line); }
.category-item__image { position: relative; min-height: 164px; overflow: hidden; background: #e5e9e5; }
.category-item__image:empty::before { content: "装修笔记"; position: absolute; inset: 0; display: grid; place-items: center; color: #89928a; font-size: 13px; font-weight: 800; border: 1px solid var(--line); }
.category-item__thumb { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.category-item:hover .category-item__thumb { transform: scale(1.03); }
.category-item__content { min-width: 0; }
.category-item__meta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; color: var(--muted); font-size: 12px; }
.category-item__meta { color: var(--green); font-weight: 800; }
.category-item h2 { margin: 13px 0 0; font-size: 23px; line-height: 1.4; }
.category-item h2 a:hover { color: var(--green); }
.category-item__content > p { margin: 10px 0 18px; color: var(--muted); font-size: 14px; }
.category-item__footer { display: flex; justify-content: space-between; gap: 20px; color: var(--muted); font-size: 12px; }
.category-item__footer a { color: var(--ink); font-weight: 800; }
.category-item__footer a:hover { color: var(--green); }
.category-pager { margin-top: 34px; }
.category-pager nav, .category-pager ul { display: flex; flex-wrap: wrap; gap: 7px; padding: 0; list-style: none; }
.category-pager a, .category-pager span { display: grid; min-width: 39px; min-height: 39px; place-items: center; padding: 5px 10px; border: 1px solid var(--line); }
.category-pager .active span, .category-pager a:hover { color: var(--paper); border-color: var(--ink); background: var(--ink); }
.category-pager .pt-cms-pager__item:hover { color: var(--green); border-color: var(--green); background: var(--green-soft); }
.category-pager .pt-cms-pager__item.is-active { color: var(--paper); border-color: var(--green); background: var(--green); }
.category-pager .pt-cms-pager__item.is-disabled { color: var(--muted); border-color: var(--line); background: var(--canvas); }

.category-aside { position: sticky; top: 22px; padding: 28px; border: 1px solid var(--line); border-radius: 3px; background: var(--canvas); }
.category-aside__rule { width: 46px; height: 6px; margin-bottom: 25px; background: var(--yellow); }
.category-aside__label { margin: 0 0 7px; color: var(--green); font-size: 11px; font-weight: 800; letter-spacing: 1.4px; }
.category-aside > h2 { margin: 0; font-size: 24px; line-height: 1.3; }
.category-aside > p:not(.category-aside__label) { margin: 14px 0 21px; color: var(--muted); font-size: 14px; }
.category-aside__search { display: flex; min-height: 43px; align-items: center; justify-content: center; color: var(--paper); font-size: 13px; font-weight: 800; background: var(--green); }
.category-aside__warning { margin-top: 22px; padding: 17px; border-left: 4px solid var(--red); background: var(--paper); }
.category-aside__warning strong, .category-aside__warning span { display: block; }
.category-aside__warning strong { margin-bottom: 5px; color: var(--red); font-size: 13px; }
.category-aside__warning span { color: var(--muted); font-size: 12px; }
.category-recommended { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.category-recommended > h2 { margin: 0 0 13px; font-size: 17px; }
.category-recommended article { padding: 13px 0; border-bottom: 1px solid var(--line); }
.category-recommended time { color: var(--muted); font-size: 11px; }
.category-recommended h3 { margin: 4px 0 0; font-size: 14px; line-height: 1.45; }

@media (max-width: 940px) {
    .category-content__layout { grid-template-columns: 1fr; gap: 42px; }
    .category-aside { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 15px 28px; }
    .category-aside__rule, .category-aside__label, .category-aside > h2, .category-aside > p, .category-aside__search { grid-column: 1; }
    .category-aside__warning, .category-recommended { grid-column: 2; grid-row: 1 / span 5; margin-top: 0; }
    .category-recommended { grid-row: 4 / span 4; margin-top: 80px; }
}

@media (max-width: 640px) {
    .category-hero { padding: 36px 0 44px; }
    .category-hero h1 { font-size: 39px; }
    .category-hero__description { font-size: 15px; }
    .category-subnav__inner { flex-wrap: nowrap; overflow-x: auto; }
    .category-subnav a { flex: 0 0 auto; }
    .category-content { padding-block: 52px 68px; }
    .category-item { grid-template-columns: 1fr; gap: 18px; }
    .category-item__image { min-height: 210px; }
    .category-aside { display: block; }
    .category-aside__warning, .category-recommended { margin-top: 22px; }
}
