.h5b-category-shell .h5b-category-hero {
  position: relative;
  padding: clamp(2.25rem, 6vw, 4.75rem) 0 clamp(2.5rem, 6vw, 4.5rem);
  overflow: hidden;
  border-bottom: 1px solid var(--h1-border);
  background:
    radial-gradient(circle at 88% 10%, rgba(214, 165, 69, 0.2), transparent 24rem),
    linear-gradient(135deg, #f7fbf9 0%, #eaf7f2 62%, #ffffff 100%);
}

.h5b-category-shell .h5b-category-hero::after {
  position: absolute;
  right: -8rem;
  bottom: -13rem;
  width: 28rem;
  height: 28rem;
  border: 1px solid rgba(11, 107, 79, 0.14);
  border-radius: 50%;
  box-shadow: 0 0 0 3.5rem rgba(11, 107, 79, 0.035), 0 0 0 7rem rgba(11, 107, 79, 0.02);
  content: "";
}

.h5b-category-shell .h5b-breadcrumbs,
.h5b-category-shell .h5b-category-heading {
  position: relative;
  z-index: 1;
}

.h5b-category-shell .h5b-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin: 0 0 1.5rem;
  padding: 0;
  color: var(--h1-text-muted);
  font-size: var(--h1-text-sm);
  list-style: none;
}

.h5b-category-shell .h5b-breadcrumbs li + li::before {
  margin-right: 0.45rem;
  color: #82918b;
  content: "/";
}

.h5b-category-shell .h5b-breadcrumbs a {
  color: var(--h1-primary-dark);
  font-weight: 700;
  text-decoration: none;
}

.h5b-category-shell .h5b-category-heading {
  max-width: 54rem;
}

.h5b-category-shell .h5b-category-heading h1 {
  margin: 0.6rem 0 1rem;
  color: var(--h1-text);
  font-family: var(--h1-font-display);
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  font-weight: 850;
  letter-spacing: -0.045em;
  line-height: 1.02;
}

.h5b-category-shell .h5b-category-heading h1 mark {
  padding: 0;
  color: inherit;
  background: transparent;
}

.h5b-category-shell .h5b-category-description {
  max-width: 72ch;
  margin: 0;
  color: #42564f;
  font-size: clamp(1rem, 1.8vw, 1.18rem);
  line-height: 1.75;
}

.h5b-category-shell .h5b-result-count {
  width: fit-content;
  margin: 1.5rem 0 0;
  padding: 0.45rem 0.85rem;
  border: 1px solid rgba(11, 107, 79, 0.18);
  border-radius: var(--h1-radius-pill);
  color: var(--h1-primary-dark);
  background: rgba(255, 255, 255, 0.76);
  font-size: var(--h1-text-sm);
  font-weight: 800;
}

.h5b-category-shell .h5b-category-content {
  padding: clamp(2.5rem, 6vw, 5rem) 0;
  background: var(--h1-surface-soft);
}

.h5b-category-shell .h5b-category-relations {
  margin-bottom: 1.5rem;
  padding: 1.25rem;
  border: 1px solid var(--h1-border);
  border-radius: var(--h1-radius-md);
  background: var(--h1-surface);
}

.h5b-category-shell .h5b-category-relations h2 {
  margin: 0 0 0.75rem;
  font-size: var(--h1-text-lg);
}

.h5b-category-shell .h5b-category-relations ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.h5b-category-shell .h5b-category-relations li {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.45rem 0.7rem;
  border-radius: var(--h1-radius-sm);
  background: var(--h1-primary-soft);
}

.h5b-category-shell .h5b-category-relations li span {
  color: var(--h1-text-muted);
  font-size: var(--h1-text-xs);
  font-weight: 700;
  text-transform: uppercase;
}

.h5b-category-shell .h5b-category-relations a {
  color: var(--h1-primary-dark);
  font-weight: 800;
}

.h5b-category-shell .h5b-category-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(17rem, 21rem);
  align-items: start;
  gap: clamp(1.5rem, 4vw, 3rem);
}

.h5b-category-shell .h5b-category-primary {
  min-width: 0;
}

.h5b-category-shell .h5b-resource-list {
  display: grid;
  gap: 1.25rem;
}

.h5b-category-shell .h5b-resource-card {
  display: grid;
  grid-template-columns: minmax(14rem, 0.72fr) minmax(0, 1.28fr);
  overflow: hidden;
  border: 1px solid var(--h1-border);
  border-radius: var(--h1-radius-lg);
  background: var(--h1-surface);
  box-shadow: var(--h1-shadow-sm);
}

.h5b-category-shell .h5b-card-media {
  min-height: 15rem;
  display: block;
  overflow: hidden;
  background: #dfece7;
}

.h5b-category-shell .h5b-card-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform var(--h1-transition);
}

.h5b-category-shell .h5b-resource-card:hover .h5b-card-media img {
  transform: scale(1.025);
}

.h5b-category-shell .h5b-image-fallback {
  min-height: 15rem;
  display: grid;
  place-items: center;
  color: var(--h1-primary);
  background:
    linear-gradient(135deg, rgba(11, 107, 79, 0.08), rgba(214, 165, 69, 0.18)),
    var(--h1-primary-soft);
  font-size: 3rem;
}

.h5b-category-shell .h5b-card-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(1.25rem, 3vw, 2rem);
}

.h5b-category-shell .h5b-card-kicker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 0.8rem;
  color: var(--h1-text-muted);
  font-size: var(--h1-text-xs);
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.h5b-category-shell .h5b-family-badge {
  padding: 0.3rem 0.6rem;
  border-radius: var(--h1-radius-pill);
  color: var(--h1-primary-dark);
  background: var(--h1-primary-soft);
}

.h5b-category-shell .h5b-card-body h2 {
  margin: 0 0 0.75rem;
  color: var(--h1-text);
  font-size: clamp(1.25rem, 2.4vw, 1.65rem);
  font-weight: 825;
  letter-spacing: -0.025em;
  line-height: 1.25;
}

.h5b-category-shell .h5b-card-body h2 a {
  color: inherit;
  text-decoration: none;
}

.h5b-category-shell .h5b-card-body h2 a:hover {
  color: var(--h1-primary);
}

.h5b-category-shell .h5b-card-body > p {
  display: -webkit-box;
  margin: 0 0 1rem;
  overflow: hidden;
  color: var(--h1-text-muted);
  line-height: 1.7;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.h5b-category-shell .h5b-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin: auto 0 1rem;
  padding: 0;
  color: var(--h1-text-muted);
  font-size: var(--h1-text-sm);
  list-style: none;
}

.h5b-category-shell .h5b-card-meta li {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.h5b-category-shell .h5b-card-meta i {
  color: var(--h1-primary);
}

.h5b-category-shell .h5b-card-action,
.h5b-category-shell .h5b-button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: 0.65rem 1rem;
  border: 1px solid var(--h1-primary);
  border-radius: var(--h1-radius-pill);
  color: var(--h1-primary-dark);
  background: transparent;
  font-weight: 800;
  text-decoration: none;
}

.h5b-category-shell .h5b-card-action:hover,
.h5b-category-shell .h5b-button:hover {
  color: #fff;
  background: var(--h1-primary);
}

.h5b-category-shell .h5b-pagination {
  margin-top: 2rem;
  padding: 1.25rem;
  border: 1px solid var(--h1-border);
  border-radius: var(--h1-radius-md);
  background: var(--h1-surface);
}

.h5b-category-shell .h5b-pagination p {
  margin: 0 0 0.75rem;
  color: var(--h1-text-muted);
  font-size: var(--h1-text-sm);
  text-align: center;
}

.h5b-category-shell .h5b-pagination ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.h5b-category-shell .h5b-pagination a,
.h5b-category-shell .h5b-pagination span {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 0.8rem;
  border: 1px solid var(--h1-border);
  border-radius: var(--h1-radius-sm);
  color: var(--h1-primary-dark);
  background: var(--h1-surface);
  font-weight: 800;
  text-decoration: none;
}

.h5b-category-shell .h5b-pagination a:hover,
.h5b-category-shell .h5b-pagination .is-current {
  border-color: var(--h1-primary);
  color: #fff;
  background: var(--h1-primary);
}

.h5b-category-shell .h5b-state {
  padding: clamp(2rem, 5vw, 4rem);
  border: 1px solid var(--h1-border);
  border-radius: var(--h1-radius-lg);
  background: var(--h1-surface);
  box-shadow: var(--h1-shadow-sm);
  text-align: center;
}

.h5b-category-shell .h5b-state h2 {
  margin: 0 0 0.75rem;
  color: var(--h1-text);
  font-size: var(--h1-text-2xl);
}

.h5b-category-shell .h5b-state p {
  margin: 0 0 1.25rem;
  color: var(--h1-text-muted);
}

.h5b-category-shell .h5b-category-sidebar {
  width: auto;
  max-width: none;
  padding: 0;
}

.h5b-category-shell .h5b-category-sidebar .widget {
  overflow: hidden;
  border: 1px solid var(--h1-border);
  border-radius: var(--h1-radius-md);
  background: var(--h1-surface);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.h5b-category-shell .h5b-category-sidebar .widget-title {
  color: var(--h1-text);
}

@media (max-width: 1099.98px) {
  .h5b-category-shell .h5b-category-layout {
    grid-template-columns: minmax(0, 1fr) minmax(16rem, 18rem);
    gap: 1.5rem;
  }

  .h5b-category-shell .h5b-resource-card {
    grid-template-columns: minmax(12rem, 0.7fr) minmax(0, 1.3fr);
  }
}

@media (max-width: 899.98px) {
  .h5b-category-shell .h5b-category-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .h5b-category-shell .h5b-category-sidebar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }

  .h5b-category-shell .h5b-category-sidebar .widget {
    margin: 0;
  }
}

@media (max-width: 639.98px) {
  .h5b-category-shell .h5b-category-hero {
    padding-top: 1.75rem;
  }

  .h5b-category-shell .h5b-resource-card {
    grid-template-columns: minmax(0, 1fr);
    border-radius: var(--h1-radius-md);
  }

  .h5b-category-shell .h5b-card-media,
  .h5b-category-shell .h5b-image-fallback {
    min-height: 12rem;
    aspect-ratio: 16 / 9;
  }

  .h5b-category-shell .h5b-category-sidebar {
    display: block;
  }

  .h5b-category-shell .h5b-category-sidebar .widget {
    margin-bottom: 1rem;
  }

  .h5b-category-shell .h5b-pagination {
    padding-inline: 0.75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .h5b-category-shell .h5b-card-media img {
    transition: none;
  }
}

.h5b-article-category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}.h5b-article-category-card{background:#fff;border:1px solid var(--h1-border);border-radius:18px;overflow:hidden;box-shadow:0 12px 30px rgba(15,23,42,.06)}.h5b-article-category-card__media{display:block;aspect-ratio:16/9;background:#e9f5ef;overflow:hidden}.h5b-article-category-card__media img{width:100%;height:100%;object-fit:cover}.h5b-article-category-card>div{padding:1.5rem}.h5b-article-category-card h2{font-size:1.35rem;margin:.75rem 0}.h5b-article-category-card h2 a{color:var(--h1-text);text-decoration:none}.h5b-article-category-card p{color:var(--h1-muted);line-height:1.7}.h5b-article-category-card .h5b-image-fallback{min-height:100%;display:grid;place-items:center;font-size:2.5rem;color:#08765b}@media(max-width:639.98px){.h5b-article-category-grid{grid-template-columns:1fr}}

.h5b-article-category-card__media{aspect-ratio:auto;height:clamp(180px,24vw,280px);max-height:280px}
.h5b-article-category-card__media img{width:100%;height:100%;object-fit:cover;object-position:center}
.h5b-article-category-card h2,.h5b-article-category-card p{overflow-wrap:anywhere}

.h5b-article-category-hero {
  align-items: center;
  display: grid;
  gap: clamp(1.5rem, 4vw, 3.5rem);
  grid-template-columns: minmax(0, 1fr) minmax(280px, 42%);
  padding-block: clamp(1.5rem, 3vw, 3rem);
}
.h5b-article-category-hero .h5b-category-heading h1 {
  border: 0;
  text-decoration: none;
}
.h5b-article-category-hero__visual {
  background: #fff;
  border: 1px solid var(--h1-border);
  border-radius: 22px;
  box-shadow: 0 18px 48px rgba(15, 43, 34, .12);
  margin: 0;
  overflow: hidden;
}
.h5b-article-category-hero__visual img {
  aspect-ratio: 16 / 10;
  display: block;
  height: auto;
  object-fit: cover;
  width: 100%;
}
.h5b-category-shell .h5b-card-media {
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(11, 107, 79, .16);
  border-right: 1px solid var(--h1-border);
}
.h5b-category-shell .h5b-card-media img {
  display: block;
}
@media (max-width: 767.98px) {
  .h5b-article-category-hero { grid-template-columns: 1fr; }
}
