/* Column-specific composition; control tokens live in business.css. */
.cat-main { --cat-border: #e5e7eb; }
/* Development banner follows the homepage composition and keeps business content below it. */
.dev-main { background: #fff; }
.dev-page { --dev-paper: #f5f6f8; padding-top: 48px; }
.dev-page svg { display: block; width: 32px; height: 32px; }
.dev-hero { position: relative; min-height: 500px; overflow: hidden; isolation: isolate; background: radial-gradient(ellipse at 78% 52%,#522712 0%,#17100c 28%,#030404 64%); color: #fff; }
.dev-hero::before { content: ''; position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg,#030404 0%,#030404e8 38%,transparent 68%),radial-gradient(ellipse at -8% 68%,#00283a66,transparent 30%); }
.dev-hero-inner { width: calc(100% - 2 * var(--page-gutter)); max-width: var(--content-width); min-height: 500px; margin-inline: auto; display: grid; grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr); gap: 32px; align-items: center; }
.dev-hero-grain { position: absolute; inset: 0; z-index: -1; opacity: .07; background-image: radial-gradient(#d3c0ae .6px,transparent .6px); background-size: 9px 9px; -webkit-mask-image: linear-gradient(90deg,transparent 28%,#000 62%,transparent 88%); mask-image: linear-gradient(90deg,transparent 28%,#000 62%,transparent 88%); }
.dev-hero-spark { position: absolute; color: #FF7500; font-size: 32px; font-weight: 300; line-height: 1; }
.dev-hero-spark-one { top: 18%; left: 52%; }
.dev-hero-spark-two { bottom: 18%; left: 47%; font-size: 22px; }
.dev-kicker { color: #FF7500; font-size: var(--font-size-small); letter-spacing: 1px; font-weight: 600; }
.dev-hero-copy { position: relative; z-index: 2; padding-block: 56px; }
.dev-hero-copy .page-title { margin-block: 12px 8px; color: #fff; font-size: clamp(58px,5.3vw,78px); font-weight: 900; line-height: 1.05; letter-spacing: -2px; -webkit-text-stroke: .8px currentColor; }
.dev-hero-lead { font-size: clamp(30px,2.7vw,42px); line-height: 1.28; font-weight: 700; letter-spacing: -.8px; }
.dev-hero-lead em { color: #FF7500; }
.dev-description { margin-block: 20px 28px; color: #b8bbbf; font-size: 17px; line-height: 1.8; }
.dev-hero .cat-actions { gap: 16px; }
.dev-hero .btn-secondary { border-color: #ffffff52; background: #ffffff0d; color: #fff; }
.dev-hero .btn-secondary:hover { border-color: #fff; background: #ffffff18; }
.dev-hero-stage { position: relative; min-width: 0; height: 430px; isolation: isolate; }
.dev-hero-stage::before { content: ''; position: absolute; inset: 4% -8% -10%; background: radial-gradient(ellipse at 48% 64%,#FF750075 0%,#FF750018 42%,#FF750000 70%); border-radius: 50%; z-index: -2; }
.dev-orbit { position: absolute; width: 380px; height: 380px; left: 19%; top: 18px; border: 1px solid #FF75005C; border-radius: 50%; z-index: -1; box-shadow: 0 0 90px #FF75001C; }
.dev-orbit::before { content: ''; position: absolute; width: 292px; height: 292px; border: 1px solid #FF75002E; border-radius: 50%; inset: 43px; }
.dev-orbit::after { content: ''; position: absolute; width: 8px; height: 8px; background: var(--orange); border-radius: 50%; right: 16px; top: 64px; }
.dev-stage-plinth { position: absolute; width: 94%; height: 82px; bottom: 12px; left: 3%; border-radius: 50%; background: radial-gradient(ellipse,#FF750052 0%,#3a1d0e5c 42%,transparent 72%); z-index: -1; }
.dev-stage-robot { position: absolute; height: 420px; width: 72%; object-fit: contain; object-position: bottom; bottom: 0; left: 0; filter: drop-shadow(0 18px 26px #000b); }
.dev-stage-hand { position: absolute; height: 226px; width: 39%; object-fit: contain; bottom: 36px; right: -2%; transform: rotate(-10deg); filter: drop-shadow(0 16px 24px #000a); }
.dev-stage-label { position: absolute; z-index: 1; display: block; padding: 9px 13px; border: 1px solid #ffffff24; border-radius: 8px; background: #111214d9; box-shadow: 0 8px 26px #0007; color: #fff; font-weight: 600; font-size: var(--font-size-small); backdrop-filter: blur(8px); }
.dev-stage-label small { display: block; font-size: var(--font-size-small); color: #aeb1b5; font-weight: 400; margin-top: 2px; }
.dev-stage-label-robot { left: 0; top: 46px; }
.dev-stage-label-hand { right: 0; top: 96px; }
.dev-entry-strip { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); min-height: 92px; padding-inline: max(var(--page-gutter),calc((100vw - var(--content-width))/2)); border-top: 1px solid #252626; background: #0e1011; color: #f8f8f8; }
.dev-entry-strip a { position: relative; display: flex; align-items: center; gap: 16px; min-height: 92px; padding-inline: 24px; }
.dev-entry-strip a + a::before { content: ''; position: absolute; left: 0; width: 1px; height: 48px; background: #2b2d2f; }
.dev-entry-icon { flex: none; color: #FF7500; }
.dev-entry-strip a > span:last-child { display: grid; gap: 5px; }
.dev-entry-strip strong { font-size: var(--font-size-small); font-weight: 600; }
.dev-entry-strip small { color: #aeb1b5; font-size: 12px; }
.dev-entry-strip a:hover { background: #211810; color: #fff; }
.dev-entry-strip a:hover .dev-entry-icon { color: var(--orange); }
.dev-link-arrow { margin-left: auto; font-size: 20px; font-weight: 400; color: #81868c; }
.dev-section { margin-top: 48px; scroll-margin-top: 104px; }
.dev-section-heading { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 16px; margin-bottom: 24px; }
.dev-section-heading h2 { font-size: var(--font-size-section); line-height: 1.4; }
.dev-section-heading p { color: var(--muted); margin-top: 8px; }
.dev-feature { position: relative; display: grid; grid-template-columns: 1.04fr 1fr; align-items: center; min-height: 336px; border-radius: 16px; overflow: hidden; background: #0e0f11; color: #fff; }
.dev-feature-art { align-self: stretch; position: relative; overflow: hidden; }
.dev-feature-art img { position: absolute; width: 100%; height: 100%; object-fit: contain; object-position: left center; }
.dev-feature-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,transparent 75%,#0e0f11); }
.dev-feature-copy { position: relative; padding: 32px 40px 32px 24px; }
.dev-feature-copy .dev-kicker { color: #FF7500; font-weight: 400; }
.dev-feature-copy h3 { margin-block: 8px 16px; font-size: var(--font-size-section); }
.dev-feature-copy > p:not(.dev-kicker) { color: #c9cacc; font-size: var(--font-size-small); line-height: 1.85; }
.dev-feature-copy ul { display: flex; flex-wrap: wrap; gap: 8px 24px; list-style: none; padding: 0; margin-block: 24px; font-size: var(--font-size-small); color: #eeeeef; }
.dev-feature-copy li::before { content: ''; display: inline-block; width: 4px; height: 4px; background: var(--orange); margin-right: 8px; vertical-align: middle; }
.dev-feature .btn { min-width: 144px; }
.dev-product-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-top: 16px; }
.dev-product { position: relative; min-width: 0; min-height: 264px; padding: 24px; background: linear-gradient(125deg,#f6f7f9,#eef0f3); border: 1px solid transparent; border-radius: 12px; overflow: hidden; transition: border-color .2s,transform .2s; }
.dev-product:hover { border-color: #e6c8b3; transform: translateY(-3px); }
.dev-product-copy { position: relative; z-index: 1; width: 57%; min-height: 216px; display: flex; flex-direction: column; align-items: flex-start; }
.dev-product-label { font-size: var(--font-size-small); color: #626a74; }
.dev-product h3 { font-size: var(--font-size-card); margin-block: 8px 16px; white-space: nowrap; }
.dev-product-copy > p:not(.dev-product-label) { color: #626a74; font-size: var(--font-size-small); line-height: 1.75; }
.dev-product .cp-link { margin-top: auto; }
.dev-product img { position: absolute; right: 0; bottom: 8px; width: 48%; height: 208px; object-fit: contain; object-position: bottom right; }
.dev-scene-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.dev-scene { min-width: 0; padding: 24px; border: 1px solid #e7e9ec; border-radius: 12px; background: #fff; }
.dev-scene-heading { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.dev-scene-icon { display: grid; place-items: center; flex: none; width: 48px; height: 48px; color: #FF7500; background: #FF750018; border-radius: 12px; }
.dev-scene h3 { font-size: var(--font-size-card); }
.dev-scene > p { color: var(--muted); font-size: var(--font-size-small); line-height: 1.85; }
.dev-scene-flow { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 16px; background: #f6f7f9; border-radius: 8px; margin-block: 24px 8px; font-size: var(--font-size-small); }
.dev-scene-flow span[aria-hidden] { color: #FF7500; }
.dev-support-layout { display: grid; grid-template-columns: 1fr 1.5fr; gap: 24px; }
.dev-community-panel { position: relative; padding: 32px; border-radius: 12px; background: radial-gradient(ellipse at right bottom,#512b13,#1c1d20 65%); color: #fff; overflow: hidden; }
.dev-community-panel .dev-kicker { color: #FF7500; margin-bottom: 16px; }
.dev-community-panel h3 { position: relative; font-size: var(--font-size-section); line-height: 1.5; }
.dev-community-panel > p:not(.dev-kicker) { position: relative; color: #c1c2c6; font-size: var(--font-size-small); margin-block: 16px 24px; line-height: 1.85; }
.dev-community-symbol { position: absolute; right: -16px; bottom: -24px; color: #ffffff05; transform: rotate(-12deg); }
.dev-community-symbol svg { width: 216px; height: 216px; }
.dev-community-panel .btn { position: relative; }
.dev-support-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.dev-support-grid-simple { grid-template-columns: repeat(3,minmax(0,1fr)); }
.dev-support-item { display: flex; align-items: flex-start; gap: 16px; padding: 24px; border: 1px solid #e7e9ec; border-radius: 12px; min-width: 0; }
.dev-support-icon { color: #FF7500; flex: none; margin-top: 4px; }
.dev-support-icon svg { width: 24px; height: 24px; }
.dev-support-item h3 { font-size: var(--font-size-card); margin-bottom: 8px; }
.dev-support-item p { font-size: var(--font-size-small); color: var(--muted); line-height: 1.75; }
.dev-support-item .cp-link { margin-top: 8px; }
#development-support { margin-top: 32px; }
#development-support > p { margin-block: 16px 24px; }
@media (max-width: 1100px) {
  .dev-hero, .dev-hero-inner { min-height: 460px; }
  .dev-hero-stage { height: 390px; }
  .dev-stage-robot { height: 374px; }
  .dev-stage-hand { height: 194px; }
  .dev-orbit { width: 340px; height: 340px; left: 12%; }
  .dev-orbit::before { width: 252px; height: 252px; }
  .dev-product { padding: 16px; }
  .dev-product-copy { width: 60%; }
  .dev-product img { width: 43%; height: 168px; }
  .dev-support-item { padding: 16px; gap: 8px; }
}
@media (max-width: 1023px) {
  .dev-hero-inner { gap: 16px; }
  .dev-hero-stage { height: 360px; }
  .dev-stage-label { font-size: var(--font-size-small); }
  .dev-stage-label small { display: none; }
  .dev-stage-label-hand { top: 72px; }
  .dev-orbit { left: 9%; width: 310px; height: 310px; }
  .dev-orbit::before { width: 222px; height: 222px; }
  .dev-entry-strip a { padding-inline: 16px; gap: 8px; }
  .dev-entry-icon svg { width: 24px; height: 24px; }
  .dev-entry-strip .dev-link-arrow { display: none; }
  .dev-feature-copy { padding: 24px; }
  .dev-feature-copy ul { gap: 8px 16px; }
  .dev-product-grid { grid-template-columns: minmax(0,1fr); }
  .dev-product { min-height: 224px; padding: 24px; }
  .dev-product-copy { width: 60%; min-height: 176px; }
  .dev-product img { width: 36%; height: 200px; right: 24px; }
  .dev-scene-grid { gap: 16px; }
  .dev-scene { padding: 16px; }
  .dev-scene-heading { flex-direction: column; align-items: flex-start; gap: 8px; }
  .dev-scene-flow { flex-wrap: wrap; padding: 8px; }
  .dev-support-layout { grid-template-columns: 1fr; }
  .dev-community-panel { padding: 24px; }
  .dev-support-item { padding: 24px; gap: 16px; }
}
@media (max-width: 680px) {
  .dev-page { padding-top: 32px; }
  .dev-hero, .dev-hero-inner { min-height: 0; }
  .dev-hero-inner { grid-template-columns: minmax(0,1fr); gap: 0; padding-block: 40px 24px; }
  .dev-hero-copy { padding-block: 0; }
  .dev-hero-copy .page-title { margin-block: 8px; font-size: 52px; }
  .dev-hero-lead { font-size: var(--font-size-section); }
  .dev-hero-lead br { display: none; }
  .dev-description { margin-block: 16px 20px; font-size: 14px; }
  .dev-hero .cat-actions { gap: 8px; }
  .dev-hero .btn { padding-inline: 16px; }
  .dev-hero-stage { height: 260px; max-width: 400px; width: 100%; margin-inline: auto; }
  .dev-stage-robot { height: 260px; }
  .dev-stage-hand { height: 142px; }
  .dev-stage-label-robot { left: 0; top: 16px; }
  .dev-stage-label-hand { top: 40px; right: 0; }
  .dev-orbit { width: 220px; height: 220px; left: 19%; top: 14px; }
  .dev-orbit::before { width: 156px; height: 156px; inset: 31px; }
  .dev-entry-strip { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 0; padding-block: 8px; }
  .dev-entry-strip a { font-size: var(--font-size-small); min-height: 48px; padding-inline: 8px; gap: 16px; }
  .dev-entry-strip a:nth-child(even) { border-right: 0; padding-left: 24px; }
  .dev-entry-strip a:nth-child(odd)::before { display: none; }
  .dev-entry-strip small { display: none; }
  .dev-section { margin-top: 32px; }
  .dev-section-heading { gap: 8px; margin-bottom: 16px; }
  .dev-section-heading p { font-size: var(--font-size-small); }
  .dev-feature { display: flex; flex-direction: column; align-items: stretch; }
  .dev-feature-art { height: 208px; }
  .dev-feature-art img { object-fit: contain; object-position: left center; }
  .dev-feature-art::after { background: linear-gradient(0deg,#0e0f11,transparent 32%); }
  .dev-feature-copy { padding: 16px 24px 24px; }
  .dev-feature-copy h3 { margin-block: 8px; }
  .dev-feature-copy ul { margin-block: 16px; }
  .dev-product { padding: 24px 16px; min-height: 224px; }
  .dev-product-copy { min-height: 184px; width: 56%; }
  .dev-product h3 { margin-block: 8px; }
  .dev-product img { width: 43%; right: 0; height: 176px; }
  .dev-scene-grid { grid-template-columns: minmax(0,1fr); }
  .dev-scene { padding: 24px; }
  .dev-scene-heading { flex-direction: row; align-items: center; gap: 16px; }
  .dev-scene-flow { padding: 16px; margin-block: 16px 8px; }
  .dev-support-grid { grid-template-columns: minmax(0,1fr); }
  .dev-support-item { padding: 24px; }
}
.cat-main > .breadcrumb { margin-bottom: 24px; }
.cat-main .page-heading { align-items: flex-end; }
.cat-eyebrow { margin-bottom: 8px; font-size: 14px; font-weight: 600; letter-spacing: 1px; color: #FF7500; }
.cat-actions, .cat-meta, .cat-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cat-meta { gap: 8px 16px; color: var(--muted); font-size: 14px; }
.cat-subnav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 32px; padding-bottom: 16px; border-bottom: 1px solid var(--cat-border); }
.cat-subnav a { display: inline-flex; min-height: 44px; align-items: center; padding: 8px 20px; border-radius: 24px; font-size: 16px; }
.cat-subnav a[aria-current="page"] { background: #151719; color: white; }
.cat-subnav a:hover:not([aria-current]) { background: #FF750019; color: #FF7500; }
.cat-toolbar { display: grid; gap: 24px; margin-bottom: 24px; }
.product-directory { min-width: 0; }
.product-directory-toolbar { padding: 24px; border: 1px solid var(--cat-border); border-radius: 12px; background: #f8f9fa; }
.product-directory .cat-filter { min-height: 40px; border: 1px solid #dfe2e6; border-radius: 22px; background: #fff; color: #42464d; padding: 7px 18px; cursor: pointer; }
.product-directory .cat-filter:hover { border-color: #FF7500; color: #FF7500; }
.product-directory .cat-filter[aria-pressed="true"] { border-color: #151719; background: #151719; color: #fff; }
.product-directory .pagination button { min-width: 40px; min-height: 40px; border: 1px solid var(--cat-border); border-radius: 6px; background: #fff; cursor: pointer; }
.product-directory .pagination button[aria-current="page"] { border-color: #FF7500; background: #FF7500; color: #fff; }
.cat-search { display: flex; gap: 8px; max-width: 680px; }
.cat-filter-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cat-filter-label { margin-right: 8px; font-size: 14px; color: var(--muted); }
.cat-result-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.cat-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.cat-grid > * { min-width: 0; }
.cat-grid > .panel + .panel, .cat-news-list > .panel + .panel { margin-top: 0; }
.cat-card { position: relative; display: flex; flex-direction: column; overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-card); transition: border-color .18s, transform .18s, box-shadow .18s; }
.cat-card:hover { border-color: #eac3ab; transform: translateY(-3px); box-shadow: 0 8px 24px #27272708; }
.cat-card-body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 16px; padding: 24px; }
.cat-card h2, .cat-card h3 { font-size: var(--font-size-card,20px); line-height: 1.5; font-weight: 650; }
.cat-card h2 a::after, .cat-card h3 a::after { content: ''; position: absolute; inset: 0; }
.cat-card p { color: var(--muted); font-size: 16px; line-height: 1.75; }
.cat-card-summary-six-lines { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 6; }
.cat-card-unavailable:hover { border-color: var(--line); transform: none; box-shadow: none; }
.cat-card-soon { color: #FF7500; font-weight: 650; }
.cat-card-foot { width: 100%; display: flex; gap: 8px; justify-content: space-between; align-items: center; margin-top: auto; padding-top: 8px; color: var(--muted); font-size: 14px; }
.cat-arrow { color: #FF7500; font-size: 20px; }
.cat-cover { position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 16/9; overflow: hidden; background: #f0f2f5; }
.cat-cover img { width: 100%; height: 100%; object-fit: cover; }
.cat-product-cover { padding: 16px; background: #f3f4f5; }
.cat-product-cover img { object-fit: contain; }
.cat-cover-type { justify-content: flex-start; padding: 32px; color: #242729; background: #eeeae5; }
.cat-cover-type::before, .cat-cover-type::after { content: ''; position: absolute; right: -20px; width: 144px; height: 144px; border: 1px solid #c8b7a3; border-radius: 50%; }
.cat-cover-type::after { right: 12px; width: 80px; height: 80px; background: #ffffff66; }
.cat-cover-type > div { position: relative; z-index: 1; display: grid; gap: 8px; }
.cat-cover-type span { font-size: 14px; letter-spacing: 1px; }
.cat-cover-type strong { font-size: 24px; font-weight: 600; }
.cat-cover-type small { font-size: 14px; color: #646362; }
.cat-tone-course { background: #FF750021; }
.cat-tone-blog { background: #e9eef0; }
.cat-tone-news { background: #eeece6; }
.cat-tone-event { background: #171a1d; color: #fff; }
.cat-tone-event small { color: #c7c9cd; }
.cat-tone-event::before { border-color: #FF7500; }
.cat-tone-event::after { background: #FF750025; border-color: #FF750055; }
.cat-cover-label { position: absolute; left: 16px; top: 16px; z-index: 2; background: #fff; color: #43474c; font-size: 14px; border-radius: 24px; padding: 4px 12px; }
.cat-note { margin-top: 32px; }
.cat-reading-grid { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 32px; align-items: start; }
.cat-reading-grid > * { min-width: 0; }
.cat-article { padding: 40px; }
.cat-prose { max-width: 760px; margin-inline: auto; overflow-wrap: anywhere; }
.cat-prose h2 { font-size: var(--font-size-section,24px); line-height: 1.45; margin-bottom: 16px; }
.cat-prose h3 { font-size: 20px; margin: 24px 0 16px; }
.cat-prose p { margin: 0 0 16px; font-size: 16px; line-height: 1.9; color: #40464e; }
.cat-prose ul { padding-left: 24px; margin: 16px 0; }
.cat-prose li { margin-block: 8px; color: #40464e; line-height: 1.9; }
.cat-prose section + section { margin-top: 40px; }
.cat-prose section { scroll-margin-top: 104px; }
.cat-prose figure { margin: 24px 0; }
.cat-prose figcaption { margin-top: 8px; font-size: 14px; color: var(--muted); }
.cat-prose pre { padding: 24px; margin: 24px 0; background: #f5f6f8; border: 1px solid #e7e9ed; border-radius: 8px; font-size: 14px; line-height: 1.9; white-space: pre; }
.cat-prose pre code { overflow-wrap: normal; }
.cat-table-wrap { max-width: 100%; margin-block: 24px; overflow-x: auto; border: 1px solid #e3e6e9; border-radius: 8px; }
.cat-prose table { width: 100%; min-width: 420px; border-collapse: collapse; text-align: left; font-size: 14px; }
.cat-prose th, .cat-prose td { padding: 16px; border-bottom: 1px solid #e8eaee; vertical-align: top; }
.cat-prose th { background: #f6f7f8; font-weight: 600; white-space: nowrap; }
.cat-prose tr:last-child td { border-bottom: 0; }
.cat-diagram { display: flex; align-items: stretch; gap: 16px; margin-block: 24px; }
.cat-diagram div { display: flex; flex: 1; align-items: center; gap: 12px; border: 1px solid #ecd3c1; background: #FF75000D; border-radius: 8px; padding: 16px; font-size: 14px; }
.cat-diagram span { flex: none; color: #FF7500; font-weight: 600; }
.cat-aside .panel { padding: 24px; }
.cat-aside h2 { font-size: 20px; margin-bottom: 16px; }
.cat-aside p { font-size: 14px; color: var(--muted); }
.cat-aside-nav { display: grid; gap: 8px; }
.cat-aside-nav a { display: flex; align-items: center; min-height: 44px; padding-block: 8px; font-size: 14px; color: #505861; }
.cat-aside-nav a:hover { color: #FF7500; }
.cat-aside-nav a[aria-current="page"] { color: #FF7500; font-weight: 600; }
.cat-facts { margin: 0; display: grid; gap: 16px; }
.cat-facts > div { display: grid; gap: 8px; }
.cat-facts dt { color: var(--muted); font-size: 14px; }
.cat-facts dd { margin: 0; font-size: 16px; }
.cat-related { margin-top: 48px; }
.cat-related .cat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.cat-related .cat-card h3 { font-size: 20px; }
.cat-related-title { font-size: 20px; line-height: 1.5; }
.cat-detail-heading .page-title { max-width: 900px; }
.cat-detail-heading .cat-meta { margin-top: 16px; }
.cat-detail-heading .cat-actions { margin-top: 24px; }
.product-detail-page { max-width: 1360px; }
.cat-product-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-bottom: 32px; }
.cat-product-gallery figure { margin: 0; min-width: 0; border: 1px solid #e5e7eb; border-radius: 12px; overflow: hidden; background: #f7f7f7; }
.cat-product-gallery img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: white; }
.cat-product-gallery figcaption { padding: 10px 12px; color: var(--muted); font-size: 13px; }
.cat-version { min-height: 44px; padding: 8px 16px; border: 1px solid #d9dde3; border-radius: 8px; background: white; font-size: 14px; max-width: 100%; }
.cat-mobile-toc { display: none; margin-bottom: 24px; padding: 16px; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; }
.cat-mobile-toc summary { min-height: 44px; padding-block: 8px; cursor: pointer; }
.cat-mobile-toc nav { display: grid; gap: 8px; margin-top: 16px; }
.cat-mobile-toc a { display: inline-flex; min-height: 44px; align-items: center; font-size: 14px; }
.cat-chapters { list-style: none; margin: 0; padding: 0; }
.cat-chapters li + li { border-top: 1px solid #e8eaed; }
.cat-chapters a { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 24px 0; }
.cat-chapters a:hover { color: #FF7500; }
.cat-chapters a span { min-width: 0; }
.cat-chapters small { font-size: 14px; color: var(--muted); }
.cat-chapter-status { white-space: nowrap; font-size: 14px; color: #287346; }
.cat-progress { display: grid; gap: 8px; margin-block: 24px; }
.cat-progress-label { display: flex; justify-content: space-between; gap: 8px; font-size: 14px; color: var(--muted); }
.cat-progress progress { width: 100%; height: 8px; accent-color: var(--orange); border: 0; border-radius: 8px; overflow: hidden; background: #eee; }
.cat-progress progress::-webkit-progress-bar { background: #eee; }
.cat-progress progress::-webkit-progress-value { background: var(--orange); border-radius: 8px; }
.cat-lesson-finish { margin-top: 40px; border-top: 1px solid #e5e7eb; padding-top: 24px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
.cat-lesson-finish p { color: var(--muted); font-size: 14px; margin: 0; }
.cat-event-heading { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 32px; align-items: center; margin-bottom: 32px; }
.cat-event-heading .cat-cover { border-radius: 12px; }
.cat-event-heading .page-description { margin-block: 16px; }
.cat-event-heading .cat-meta { margin-block: 16px; }
.cat-event-heading .page-title { margin-block: 16px; }
.cat-event-poster { width: 100%; display: block; border-radius: 8px; margin-bottom: 32px; }
.cat-status-open { color: #236b45; background: #eaf6ee; }
.cat-status-full { color: #FF7500; background: #FF75001C; }
.cat-status-ended { color: #656c75; background: #edf0f3; }
.cat-agenda { list-style: none; margin: 24px 0; padding: 0; }
.cat-agenda li { display: grid; grid-template-columns: 72px minmax(0,1fr); gap: 24px; padding: 24px 0; border-top: 1px solid #e8eaed; }
.cat-agenda time { color: #FF7500; font-size: 16px; font-weight: 600; }
.cat-agenda h3 { font-size: 20px; margin: 0 0 8px; }
.cat-agenda p { font-size: 14px; color: var(--muted); margin: 0; }
.cat-enroll-panel { margin-top: 32px; scroll-margin-top: 100px; }
.cat-enroll-panel h2 { margin-bottom: 16px; }
.cat-enroll-panel form { margin-top: 24px; }
.cat-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.cat-form-row .field { margin-bottom: 0; }
.cat-enroll-panel .field { margin-top: 24px; }
.cat-enroll-panel .field textarea { min-height: 112px; }
.cat-check { display: flex; align-items: flex-start; gap: 12px; margin-block: 24px; font-size: 14px; }
.cat-check input { margin-top: 4px; }
.cat-success { display: flex; gap: 24px; padding: 24px; border: 1px solid #b8dbc6; background: #f0f8f3; border-radius: 8px; }
.cat-success-mark { flex: none; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: #d9f0e1; color: #237644; font-size: 20px; }
.cat-success h3 { margin: 0 0 8px; font-size: 20px; }
.cat-success p { font-size: 14px; color: #45594c; margin-bottom: 16px; }
.cat-inline-confirm { padding: 16px; margin-top: 16px; border: 1px solid #FF750049; border-radius: 8px; background: #FF75000D; }
.cat-inline-confirm p { margin-bottom: 16px; }
.cat-news-list { display: grid; gap: 24px; }
.cat-news-row { display: grid; grid-template-columns: minmax(0,1fr) 240px; gap: 32px; align-items: center; padding: 32px; }
.cat-news-row h2 { font-size: var(--font-size-card); margin-block: 16px; }
.cat-news-row h2 a:hover { color: #FF7500; }
.cat-news-row p { color: var(--muted); margin-bottom: 16px; }
.cat-news-row .cat-cover { border-radius: 8px; }
.cat-news-row .cat-cover-type { padding: 24px; }
.cat-news-row .cat-cover-type strong { font-size: 20px; }
.cat-info-layout { display: grid; grid-template-columns: 240px minmax(0,1fr); gap: 32px; }
.cat-info-nav a { display: flex; padding: 12px 16px; min-height: 44px; font-size: 14px; border-radius: 8px; }
.cat-info-nav a[aria-current="page"] { background: #FF750019; color: #FF7500; }
.cat-info-nav a:hover { background: #f7f8fa; }
.cat-map { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.cat-map h3 { margin: 0 0 8px; font-size: 20px; }
.cat-map ul { list-style: none; margin: 0; padding: 0; }
.cat-map a { display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; color: #FF7500; }
.cat-feedback { margin-top: 16px; }
.cat-feedback:empty { display: none; }
.cat-card progress { accent-color: var(--orange); width: 100%; height: 6px; }
@media (max-width: 1023px) {
  .cat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .cat-reading-grid { grid-template-columns: minmax(0,1fr); }
  .cat-aside { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
  .cat-aside .panel + .panel { margin-top: 0; }
  .cat-aside .cat-page-toc { display: none; }
  .cat-mobile-toc { display: block; }
  .cat-document-grid .cat-doc-tree, .cat-document-grid .cat-doc-toc { display: none; }
  .cat-event-heading { grid-template-columns: minmax(0,1fr) 240px; }
  .cat-info-layout { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .cat-info-nav { display: flex; flex-wrap: wrap; gap: 8px; padding: 16px; }
}
@media (max-width: 767px) {
  .cat-grid { grid-template-columns: minmax(0,1fr); }
  .cat-product-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .cat-news-row { grid-template-columns: minmax(0,1fr); gap: 24px; padding: 24px; }
  .cat-news-row .cat-cover { display: none; }
  .cat-event-heading { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .cat-event-heading .cat-cover { display: none; }
  .cat-aside { grid-template-columns: minmax(0,1fr); }
  .cat-related .cat-grid, .cat-form-row { grid-template-columns: minmax(0,1fr); }
  .cat-diagram { flex-direction: column; }
  .cat-success { gap: 16px; padding: 16px; }
  .cat-success-mark { width: 32px; height: 32px; }
}
@media (max-width: 680px) {
  .cat-product-gallery { grid-template-columns: minmax(0,1fr); }
  .cat-main { padding-bottom: 40px; }
  .cat-subnav { gap: 0; margin-bottom: 24px; }
  .cat-subnav a { padding-inline: 16px; font-size: 14px; }
  .cat-article, .cat-document-grid .cat-article { padding: 24px 16px; }
  .cat-card-body, .cat-resource-card .cat-card-body { padding: 24px; }
  .cat-cover-type { padding: 24px; }
  .cat-prose section + section { margin-top: 32px; }
  .cat-prose pre { padding: 16px; }
  .cat-detail-heading .cat-actions { gap: 8px; }
  .cat-agenda li { grid-template-columns: 56px minmax(0,1fr); gap: 16px; }
  .cat-news-row h2 { font-size: var(--font-size-card); }
  .cat-map { grid-template-columns: minmax(0,1fr); }
  .cat-search { gap: 8px; }
  .cat-search .btn { padding-inline: 16px; }
  .cat-related { margin-top: 32px; }
}