/**
 * صفحهٔ آرشیو دسته (حالت اصلی / مستقل)
 */

.category-page {
  padding-block: var(--space-6) var(--space-8);
}

.category-page__breadcrumb {
  margin-bottom: var(--space-4);
  padding: var(--space-2) 0;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.category-page__breadcrumb::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.category-page__breadcrumb .category-page__breadcrumb-inner,
.category-page__breadcrumb .netron-breadcrumb-wrap.category-page__breadcrumb-inner {
  margin: 0;
  width: max-content;
  max-width: none;
}

.category-page__breadcrumb .netron-breadcrumb {
  width: max-content;
}

.category-page__breadcrumb .netron-breadcrumb__list {
  flex-wrap: nowrap;
  width: max-content;
  max-width: none;
  white-space: nowrap;
}

.category-page__breadcrumb .netron-breadcrumb__item {
  flex-shrink: 0;
}

.category-page__breadcrumb .netron-breadcrumb__link,
.category-page__breadcrumb .netron-breadcrumb__current {
  white-space: nowrap;
}

.category-page__breadcrumb .netron-breadcrumb__sep {
  margin-inline: 0.2rem;
}

.category-page .hero-section--category {
  margin-bottom: var(--space-7);
}

/* گام‌های اصلی یادگیری — peek گام بعدی؛ کشیدن؛ بدون دکمه و بدون نوار اسکرول؛ گلس §۶ */
.category-page__learning-steps {
  margin-bottom: var(--space-7);
  padding: 0;
  border-radius: 0;
  background: transparent;
}

.category-page__learning-steps-title {
  margin: 0 0 var(--space-4);
  font-size: clamp(1.1rem, 2.4vw, 1.35rem);
  font-weight: 700;
  color: var(--color-text-heading);
  text-align: right;
}

.category-page__learning-strip-viewport {
  container-type: inline-size;
  container-name: learning-strip;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  /* proximity به‌جای mandatory: نه پرش بعد از رهاکردن، نه از دست رفتن تراز کارت‌ها */
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
  outline: none;
  user-select: none;
  -webkit-user-select: none;
  /* فقط محور افقی برای موبایل/تاچ‌پد: اسکرول بومی نرم بدون تداخل با اسکرول عمودی صفحه */
  touch-action: pan-x;
  will-change: scroll-position;
}

.category-page__learning-strip-viewport::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.category-page__learning-strip-viewport.is-drag-scrolling {
  cursor: grabbing;
  scroll-behavior: auto;
}

.category-page__learning-steps-track {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-auto-flow: column;
  /* کمی کمتر از ۵ ستون کامل تا لبهٔ گام بعدی «peek» دیده شود (بدون الزام به ۴ ستون) */
  grid-auto-columns: calc((100cqi - 4 * var(--space-3)) / 5.25);
  column-gap: var(--space-3);
  width: max-content;
}

@container learning-strip (max-width: 480px) {
  .category-page__learning-strip-viewport .category-page__learning-steps-track {
    grid-auto-columns: calc((100cqi - 2 * var(--space-3)) / 3.2);
  }
}

@supports not (width: 1cqi) {
  .category-page__learning-steps-track {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--space-3);
    width: max-content;
    grid-auto-flow: unset;
    grid-auto-columns: unset;
  }

  .category-page__learning-steps-item {
    flex: 0 0 min(11rem, 42vw);
    scroll-snap-align: start;
  }
}

.category-page__learning-steps-item {
  margin: 0;
  scroll-snap-align: start;
}

.category-page__learning-steps-card {
  position: relative;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 5.25rem;
  padding: var(--space-7) var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-glass-stroke);
  background-color: var(--color-glass-bg);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.category-page__learning-steps-num {
  position: absolute;
  top: var(--space-3);
  inset-inline-end: var(--space-3);
  margin: 0;
  padding: 0;
  color: var(--color-primary);
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.02em;
  background: none;
  border-radius: 0;
  width: auto;
  height: auto;
  display: block;
}

.category-page__learning-steps-label {
  margin: 0;
  max-width: 100%;
  text-align: center;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.45;
  color: var(--color-text-heading);
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* مسیر یادگیری (هر گام + کارت‌ها): بدون پس‌زمینهٔ سکشن/کارت؛ ۴ ستون؛ تعداد دروس و دکمه‌ها در یک ردیف */
.category-page__path-step {
  margin-bottom: var(--space-8);
}

.category-page__path-step-shell {
  box-sizing: border-box;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.category-page__path-step-head {
  margin-bottom: var(--space-4);
}

.category-page__path-step-head-row {
  display: block;
  margin-bottom: var(--space-3);
}

.category-page__path-step-head-main {
  min-width: 0;
  text-align: right;
}

.category-page__path-step-meta-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin: 0 0 var(--space-4);
  min-height: 2.75rem;
}

.category-page__path-step-count {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.875rem;
  color: var(--color-text-secondary);
  text-align: right;
}

.category-page__path-step-nav {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  align-self: center;
}

.category-page__path-step-num {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--color-primary);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.02em;
}

.category-page__path-step-title {
  margin: 0;
  font-size: clamp(1.125rem, 2.5vw, 1.5rem);
  font-weight: 700;
  line-height: 1.45;
  color: var(--color-text-heading);
  text-align: right;
}

.category-page__path-step-nav-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  border-radius: 50%;
  border: 1px solid var(--color-divider);
  background: transparent;
  color: var(--color-text-heading);
  cursor: pointer;
  font-size: 1.25rem;
  line-height: 1;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.category-page__path-step-nav-btn:hover,
.category-page__path-step-nav-btn:focus-visible {
  border-color: var(--color-primary);
  color: var(--color-primary);
  outline: none;
}

.category-page__path-step-desc {
  margin: 0 0 var(--space-3);
  color: var(--color-text-body);
  font-size: 0.9375rem;
  line-height: 1.8;
  text-align: right;
}

.category-page__path-step-desc > p {
  margin: 0 0 var(--space-2);
}

.category-page__path-step-desc > p:last-child {
  margin-bottom: 0;
}

.category-page__path-step-empty {
  margin: 0;
  padding: var(--space-4);
  text-align: center;
  color: var(--color-text-secondary);
  font-size: 0.9375rem;
}

.category-page__path-step-carousel {
  margin: 0;
  padding: 0;
}

.category-page__path-step-viewport {
  container-type: inline-size;
  container-name: path-step;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
  padding: var(--space-2) 0 var(--space-1);
  outline: none;
  user-select: none;
  -webkit-user-select: none;
  touch-action: pan-x;
  will-change: scroll-position;
}

.category-page__path-step-viewport::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.category-page__path-step-viewport.is-drag-scrolling {
  cursor: grabbing;
  scroll-behavior: auto;
}

.category-page__path-step-track {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100cqi - 3 * var(--space-5)) / 4);
  column-gap: var(--space-5);
  width: max-content;
}

/* تبلت: ۲ ستون خوانا */
@container path-step (max-width: 900px) {
  .category-page__path-step-viewport .category-page__path-step-track {
    grid-auto-columns: calc((100cqi - var(--space-5)) / 2);
  }
}

/* موبایل: یک کارت عریض + کمی peek از بعدی (نه ۴ ستون باریک) */
@container path-step (max-width: 560px) {
  .category-page__path-step-viewport .category-page__path-step-track {
    grid-auto-columns: min(18.5rem, calc(100cqi * 0.88));
  }
}

@supports not (width: 1cqi) {
  .category-page__path-step-track {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--space-5);
    width: max-content;
    grid-auto-flow: unset;
    grid-auto-columns: unset;
  }

  .category-page__path-step-card {
    flex: 0 0 min(15rem, 72vw);
    max-width: min(15rem, 72vw);
    scroll-snap-align: start;
  }
}

@media (max-width: 560px) {
  @supports not (width: 1cqi) {
    .category-page__path-step-card {
      flex: 0 0 min(18.5rem, 88vw);
      max-width: min(18.5rem, 88vw);
    }
  }
}

.category-page__path-step-card {
  margin: 0;
  min-width: 0;
  scroll-snap-align: start;
}

.category-page__path-step .category-page__path-step-card-link.category-page__card-link {
  background: transparent;
  border: 1px solid var(--color-divider);
  box-shadow: none;
  height: auto;
}

.category-page__path-step .category-page__card-media {
  background: transparent;
}

.category-page__path-step .category-page__path-step-card-link.category-page__card-link:hover,
.category-page__path-step .category-page__path-step-card-link.category-page__card-link:focus-visible {
  border-color: color-mix(in srgb, var(--color-text-heading) 32%, var(--color-divider));
  box-shadow: none;
}

.category-page__path-step .category-page__card-img--path-contain,
.category-page__path-step .category-page__card-img.category-page__card-img--path-contain {
  object-fit: contain;
  object-position: center;
}

.category-page__path-step-card-title.category-page__card-title {
  text-align: center;
  padding-inline: var(--space-2);
}

/* فراخوان واژه‌نامه — بعد از گام اول (دستهٔ مستقل)، مشابه بنر تیره + آیکن در مربع آبی گوشه */
.category-page__glossary-cta {
  margin-bottom: var(--space-7);
  border-radius: 1rem;
  overflow: hidden;
  background: #0a1528;
  color: #f1f5f9;
  box-shadow: 0 10px 36px rgb(0 0 0 / 28%);
}

.category-page__glossary-cta-inner {
  position: relative;
  padding: var(--space-6) var(--space-5);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  text-align: right;
}

.category-page__glossary-cta-icon-wrap {
  position: absolute;
  top: var(--space-5);
  left: var(--space-5);
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 0.65rem;
  background: #2b63eb;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  box-shadow: 0 4px 16px rgb(43 99 235 / 42%);
  pointer-events: none;
}

.category-page__glossary-cta-icon-svg {
  width: 1.65rem;
  height: 1.65rem;
  display: block;
  flex-shrink: 0;
}

.category-page__glossary-cta-title {
  margin: 0;
  font-size: clamp(1.2rem, 2.6vw, 1.55rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.45;
  letter-spacing: -0.02em;
}

.category-page__glossary-cta-desc {
  margin-top: 20px;
  font-size: 0.9375rem;
  line-height: 1.9;
  font-weight: 400;
  color: rgb(226 232 240 / 92%);
}

.category-page__glossary-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  margin-top: var(--space-2);
  padding: 0.65rem 1.35rem;
  border-radius: 0.5rem;
  background: #2b63eb;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.9375rem;
  white-space: nowrap;
  transition: filter 0.15s ease, background-color 0.15s ease;
}

.category-page__glossary-cta-btn:hover,
.category-page__glossary-cta-btn:focus-visible {
  filter: brightness(1.07);
  outline: none;
}

/* پایان مسیر — بعد از آخرین گام (استاتیک، بدون دکمه) */
.category-page__path-outro {
  margin-bottom: var(--space-7);
  border-radius: 1rem;
  overflow: hidden;
  background: #0a1528;
  color: #f1f5f9;
}

.category-page__path-outro-inner {
  position: relative;
  padding: var(--space-6) var(--space-5);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  text-align: right;
}

.category-page__path-outro-icon-wrap {
  position: absolute;
  top: var(--space-5);
  left: var(--space-5);
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 0.65rem;
  background: #2b63eb;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  box-shadow: 0 4px 16px rgb(43 99 235 / 42%);
  pointer-events: none;
}

.category-page__path-outro-icon-svg {
  width: 1.65rem;
  height: 1.65rem;
  display: block;
  flex-shrink: 0;
}

.category-page__path-outro-title {
  margin: 0;
  font-size: clamp(1.2rem, 2.6vw, 1.55rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.45;
  letter-spacing: -0.02em;
}

.category-page__path-outro-desc {
  margin-top: 20px;
  font-size: 0.9375rem;
  line-height: 1.9;
  font-weight: 400;
  color: rgb(226 232 240 / 92%);
}

@media (min-width: 720px) {
  .category-page__path-outro-inner {
    padding: var(--space-7) var(--space-6);
  }

  .category-page__path-outro-icon-wrap {
    top: var(--space-6);
    left: var(--space-6);
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 0.75rem;
  }

  .category-page__path-outro-icon-svg {
    width: 1.85rem;
    height: 1.85rem;
  }

  .category-page__glossary-cta-inner {
    padding: var(--space-7) var(--space-6);
  }

  .category-page__glossary-cta-icon-wrap {
    top: var(--space-6);
    left: var(--space-6);
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 0.75rem;
  }

  .category-page__glossary-cta-icon-svg {
    width: 1.85rem;
    height: 1.85rem;
  }
}

/* گرید نوشته‌ها */
.category-page__posts {
  margin-bottom: var(--space-8);
}

.category-page__posts-head {
  margin-bottom: var(--space-5);
  text-align: center;
}

.category-page__posts-head--with-link {
  text-align: start;
}

.category-page__posts-head--with-link .category-page__posts-head-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-3);
  width: 100%;
}

.category-page__posts-head--with-link .category-page__posts-title {
  margin: 0;
  flex: 1;
  min-width: min(100%, 12rem);
  text-align: right;
}

.category-page__posts-all-link {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: none;
  white-space: nowrap;
}

.category-page__posts-all-link:hover,
.category-page__posts-all-link:focus-visible {
  text-decoration: underline;
  outline: none;
}

.category-page__posts-title {
  margin: 0 0 var(--space-3);
  font-size: clamp(1.25rem, 3vw, 1.75rem);
  color: var(--color-text-heading);
}

.category-page__posts-lead {
  margin: 0 auto;
  max-width: 42rem;
  color: var(--color-text-body);
  line-height: 1.85;
}

.category-page__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-5);
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 560px) {
  .category-page__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .category-page__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* گرید نوشته‌ها — دستهٔ اصلی: فقط استروک، بدون پس‌زمینهٔ کارت */
.category-page__posts--main {
  margin-bottom: var(--space-8);
}

.category-page__posts--main .category-page__card-link {
  background: transparent;
  border: 1px solid var(--color-divider);
  box-shadow: none;
}

.category-page__posts--main .category-page__card-link:hover,
.category-page__posts--main .category-page__card-link:focus-visible {
  box-shadow: none;
  border-color: color-mix(in srgb, var(--color-text-heading) 32%, var(--color-divider));
}

/* گرید نوشته‌ها — دستهٔ مستقل: بدون پس‌زمینهٔ سفید کارت (هم‌تراز با دستهٔ اصلی) */
.category-page--standalone .category-page__card-link {
  background: transparent;
  box-shadow: none;
}

.category-page--standalone .category-page__card-link:hover,
.category-page--standalone .category-page__card-link:focus-visible {
  box-shadow: none;
  border-color: color-mix(in srgb, var(--color-text-heading) 32%, var(--color-divider));
}

.category-page--main .home__faq-and-forms {
  margin-bottom: var(--space-8);
}

.category-page__card-link {
  padding: 12px;
  display: block;
  height: 100%;
  text-decoration: none;
  color: inherit;
  border-radius: var(--radius-md);
  border: 1px solid var(--color-divider);
  background: #fff;
  overflow: hidden;
  transition: box-shadow 0.18s ease, border-color 0.18s ease;
}

.category-page__card-link:hover,
.category-page__card-link:focus-visible {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-divider));
  box-shadow: 0 10px 30px color-mix(in srgb, var(--color-text-heading) 8%, transparent);
  outline: none;
}

.category-page__card-media {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: color-mix(in srgb, var(--color-divider) 40%, transparent);
  border-radius: 8px;
}

.category-page__card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: 0;
}

.category-page__card-img--placeholder {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 8rem;
  background: linear-gradient(
    120deg,
    color-mix(in srgb, var(--color-primary) 12%, transparent),
    color-mix(in srgb, var(--color-text-secondary) 10%, transparent)
  );
}

.category-page__card-title {
  margin: 0;
  padding: var(--space-4) 0 var(--space-3);
  font-size: 1rem;
  line-height: 1.55;
  color: var(--color-text-heading);
}

.category-page__card-foot {
  margin: 0;
  padding: 0 var(--space-4) var(--space-4);
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: 0.8125rem;
  color: var(--color-text-secondary);
}

.category-page__card-foot-icon {
  opacity: 0.7;
  font-size: 0.65rem;
}

.category-page__no-posts {
  margin: 0;
  padding: var(--space-6);
  text-align: center;
  color: var(--color-text-secondary);
  border: 1px dashed var(--color-divider);
  border-radius: var(--radius-md);
}

.category-page__pagination,
.category-page__posts .navigation.pagination {
  margin-top: var(--space-6);
  display: flex;
  justify-content: center;
  gap: var(--space-2);
  flex-wrap: wrap;
}

.category-page__posts .page-numbers {
  display: inline-flex;
  min-width: 2.25rem;
  height: 2.25rem;
  align-items: center;
  justify-content: center;
  padding: 0 var(--space-2);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-divider);
  text-decoration: none;
  color: var(--color-text-body);
  background: #fff;
}

.category-page__posts .page-numbers.current,
.category-page__posts .page-numbers:hover,
.category-page__posts .page-numbers:focus-visible {
  border-color: var(--color-primary);
  color: var(--color-primary);
  outline: none;
}

/* FAQ */
.category-page__faq {
  margin-bottom: var(--space-8);
  padding: var(--space-6) var(--space-5);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--color-divider) 30%, var(--color-background));
}

.category-page__faq-head {
  text-align: center;
  margin-bottom: var(--space-5);
}

.category-page__faq-title {
  margin: 0;
  font-size: clamp(1.2rem, 3vw, 1.65rem);
  color: var(--color-text-heading);
}

.category-page__faq-list {
  max-width: 48rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.category-page__faq-item {
  border-radius: var(--radius-md);
  border: 1px solid var(--color-divider);
  background: #fff;
  overflow: hidden;
}

.category-page__faq-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-4);
  font-weight: 600;
  color: var(--color-text-heading);
}

.category-page__faq-summary::-webkit-details-marker {
  display: none;
}

.category-page__faq-q {
  text-align: right;
}

.category-page__faq-chevron {
  flex-shrink: 0;
  width: 0.65rem;
  height: 0.65rem;
  border-left: 2px solid var(--color-text-secondary);
  border-bottom: 2px solid var(--color-text-secondary);
  transform: rotate(-45deg);
  margin-top: -0.25rem;
  transition: transform 0.18s ease;
}

.category-page__faq-item[open] .category-page__faq-chevron {
  transform: rotate(135deg);
  margin-top: 0.15rem;
}

.category-page__faq-a {
  padding: 0 var(--space-4) var(--space-4);
  color: var(--color-text-body);
  font-size: 0.975rem;
  line-height: 1.85;
}

.category-page__faq-a > *:first-child {
  margin-top: 0;
}

.category-page__faq-a > *:last-child {
  margin-bottom: 0;
}

/* SEO */
.category-page__seo--flat {
  margin-bottom: var(--space-8);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.category-page__seo--flat .category-page__seo-body.is-clamped::after {
  background: linear-gradient(
    to bottom,
    transparent,
    var(--color-background)
  );
}

.category-page__seo-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-3);
  border: 0;
  background: none;
  padding: 0;
  cursor: pointer;
  font: inherit;
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.category-page__seo--flat .category-page__seo-toggle {
  align-self: flex-start;
}

.category-page__seo-toggle:hover,
.category-page__seo-toggle:focus-visible {
  outline: none;
}

.category-page__seo-toggle-chevron {
  display: inline-block;
  width: 0.45rem;
  height: 0.45rem;
  border-inline-end: 2px solid var(--color-primary);
  border-block-end: 2px solid var(--color-primary);
  transform: rotate(45deg);
  translate: 0 -0.1rem;
}

.category-page__seo:not(.category-page__seo--flat) {
  margin-bottom: var(--space-6);
  padding: var(--space-6) var(--space-5);
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-divider);
  background: #fff;
}

.category-page__seo-heading {
  margin: 0 0 var(--space-4);
  font-size: 1.25rem;
  color: var(--color-text-heading);
}

.category-page__seo-shell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.category-page__seo-body.is-clamped {
  max-height: 11rem;
  overflow: hidden;
  position: relative;
}

.category-page__seo-body.is-clamped::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 3.5rem;
  background: linear-gradient(to bottom, transparent, #fff);
  pointer-events: none;
}

.category-page__seo-body:not(.is-clamped)::after {
  display: none;
}

.category-page__seo-inner > *:first-child {
  margin-top: 0;
}

.category-page__seo-inner > *:last-child {
  margin-bottom: 0;
}

/* متن پایانی دسته (end-text) — بدون کادر، ادیتور کامل */
.category-page__end-text {
  margin-bottom: var(--space-8);
  margin-top: 48px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.category-page__end-text-heading {
  margin: 0 0 var(--space-4);
  font-size: 1.25rem;
  color: var(--color-text-heading);
}

.category-page__end-text-shell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.category-page__end-text-body.is-clamped {
  max-height: 11rem;
  overflow: hidden;
  position: relative;
}

/* محو شدن نرم متن با پس‌زمینهٔ صفحه (چند توقفه + ارتفاع بیشتر) */
.category-page__end-text-body.is-clamped::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  z-index: 1;
  height: clamp(5.25rem, 32vh, 7rem);
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    color-mix(in srgb, var(--color-background) 10%, transparent) 18%,
    color-mix(in srgb, var(--color-background) 32%, transparent) 38%,
    color-mix(in srgb, var(--color-background) 62%, transparent) 58%,
    color-mix(in srgb, var(--color-background) 88%, transparent) 78%,
    var(--color-background) 100%
  );
}

.category-page__end-text-body:not(.is-clamped)::after {
  display: none;
}

.category-page__end-text-inner {
  color: var(--color-text-body);
  font-size: 1rem;
  line-height: 1.85;
}

.category-page__end-text-inner > *:first-child {
  margin-top: 0;
}

.category-page__end-text-inner > *:last-child {
  margin-bottom: 0;
}

.category-page__end-text-inner img {
  border-radius: 12px;
  max-width: 100%;
  height: auto;
}

.category-page__end-text-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-3);
  align-self: flex-start;
  border: 0;
  background: none;
  padding: 0;
  cursor: pointer;
  font: inherit;
  font-weight: 600;
  color: var(--color-primary);
  text-underline-offset: 0.2em;
}

.category-page__end-text-toggle:hover,
.category-page__end-text-toggle:focus-visible {
  outline: none;
}

.category-page__end-text-toggle-chevron {
  display: inline-block;
  width: 0.45rem;
  height: 0.45rem;
  border-inline-end: 2px solid var(--color-primary);
  border-block-end: 2px solid var(--color-primary);
  transform: rotate(45deg);
  translate: 0 -0.1rem;
}

.category-page__empty {
  text-align: center;
  padding: var(--space-8);
}