/* A readable specification for the public feature guide. */
body[data-pf-catalog] .features-header {
  padding: 124px 24px 42px !important;
  background: #0b0d10 !important;
  text-align: left;
}
body[data-pf-catalog] .features-header::before { display: none; }
body[data-pf-catalog] .features-header .container {
  max-width: 1120px;
  padding: 0;
}
body[data-pf-catalog] .pf-catalog-title {
  color: #f6f5f1;
  font-size: clamp(2.2rem, 5vw, 3.4rem);
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 18px;
  letter-spacing: -.035em;
}
body[data-pf-catalog] .pf-catalog-intro {
  max-width: 780px;
  margin: 0;
  color: #c5c7cc;
  font-size: 1.075rem;
  line-height: 1.85;
}
.pf-catalog-contents { background: #0b0d10; padding: 0 24px 40px; border-bottom: 1px solid #33363d; }
.pf-catalog-contents .container { max-width: 1120px; padding: 0; }
.pf-catalog-contents h2 { font-size: .9rem; color: #d8bc68; margin: 0 0 18px; }
.pf-catalog-contents ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 28px;
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
  counter-reset: catalog-contents;
}
.pf-catalog-contents li { counter-increment: catalog-contents; display: flex; align-items: center; gap: 12px; }
.pf-catalog-contents li::before { content: counter(catalog-contents, decimal-leading-zero); color: #8d9099; font-size: .8rem; }
.pf-catalog-contents a { display: flex; align-items: center; min-height: 44px; box-sizing: border-box; color: #e4e4e8; font-size: .92rem; line-height: 1.5; text-decoration: none; padding: 5px 0; overflow-wrap: anywhere; }
.pf-catalog-contents a:hover { color: #f0d98f; text-decoration: underline; }
.pf-catalog-contents .pf-catalog-screen-link { color: #d8bc68; }
body[data-pf-catalog] .features-layout { max-width: 1168px; padding: 0 24px !important; margin: 0 auto; gap: 0; counter-reset: catalog-section; }
body[data-pf-catalog] .features-layout > .container { width: 100%; max-width: 1120px; padding: 0; box-sizing: border-box; }
body[data-pf-catalog] :is(.feat-role-section, .pf-catalog-topic) {
  padding: 48px 0;
  margin: 0;
  border: 0;
  border-bottom: 1px solid #33363d;
  border-radius: 0;
  background: transparent;
  overflow: visible;
  scroll-margin-top: 94px;
  counter-increment: catalog-section;
}
body[data-pf-catalog] .feat-role-section::before { display: none; }
body[data-pf-catalog] :is(.feat-role-section, .pf-catalog-topic) > h2 {
  display: flex;
  align-items: baseline;
  gap: 18px;
  margin: 0 0 18px;
  color: #f6f5f1;
  font-size: clamp(1.35rem, 2.7vw, 1.75rem);
  line-height: 1.45;
  font-weight: 600;
  letter-spacing: -.02em;
}
body[data-pf-catalog] :is(.feat-role-section, .pf-catalog-topic) > h2::before { content: counter(catalog-section, decimal-leading-zero); flex-shrink: 0; color: #d8bc68; font-size: .95rem; font-weight: 500; }
body[data-pf-catalog] .feat-grid { display: block; margin-top: 24px; }
body[data-pf-catalog] :is(.feat-item, .pf-catalog-rows > article) {
  display: grid;
  grid-template-columns: minmax(160px, .7fr) minmax(0, 2fr);
  gap: 24px;
  margin: 0;
  padding: 24px 0;
  border: 0;
  border-top: 1px solid #242730;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
  transition: none;
}
body[data-pf-catalog] :is(.feat-item, .pf-catalog-rows > article) > h3 { color: #eeeeef; font-size: 1rem; font-weight: 600; line-height: 1.65; margin: 0; overflow-wrap: anywhere; }
body[data-pf-catalog] .detailed-list { margin: 0; padding: 0; }
body[data-pf-catalog] .detailed-list li { color: #c5c7ce; font-size: .94rem; line-height: 1.9; margin: 0 0 12px; overflow-wrap: anywhere; }
body[data-pf-catalog] .detailed-list li:last-child { margin-bottom: 0; }
body[data-pf-catalog] .detailed-list li::before { display: none; }
body[data-pf-catalog] .detailed-list li strong { color: #e6e7eb; font-weight: 600; }
body[data-pf-catalog] .pf-catalog-rows > article > p { color: #c5c7ce; font-size: .94rem; line-height: 1.9; margin: 0; overflow-wrap: anywhere; }
body[data-pf-catalog] .pf-feature-details > p { color: #bfc2ca !important; font-size: 1rem !important; line-height: 1.8; margin-bottom: 24px; }
body[data-pf-catalog] .pf-feature-details .pf-detail-demo-link { margin: 18px 0 0; }
body[data-pf-catalog] .pf-feature-details .pf-detail-demo-link a { display: inline-flex; align-items: center; min-height: 48px; box-sizing: border-box; color: #d8bc68; font-size: .92rem; text-decoration: underline; text-underline-offset: 4px; }
body[data-pf-catalog] #feature-gallery.pf-feature-overview { max-width: 1120px; margin: 0 auto; padding: 44px 24px; box-sizing: content-box; background: transparent !important; }
body[data-pf-catalog] :is(a, summary):focus-visible { outline: 2px solid #d8bc68; outline-offset: 5px; }
@media (max-width: 760px) {
  body[data-pf-catalog] .features-header { padding: 108px 24px 30px !important; }
  .pf-catalog-contents ol { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 18px; }
  body[data-pf-catalog] :is(.feat-role-section, .pf-catalog-topic) { padding: 34px 0; }
  body[data-pf-catalog] :is(.feat-item, .pf-catalog-rows > article) { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 22px 0; }
  body[data-pf-catalog] #feature-gallery.pf-feature-overview { padding: 36px 24px; box-sizing: border-box; }
}
@media (max-width: 420px) { .pf-catalog-contents ol { grid-template-columns: minmax(0, 1fr); gap: 5px; } }
