/* Expanded homepage introduction, using the shared palette and reading scale. */
.p-capabilities { border-top: 1px solid var(--line); }
.p-capabilities, .p-feature-detail, .p-home-faq { scroll-margin-top: 24px; }
.p-feature-shortcuts { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 24px; }
.p-feature-shortcuts a { display: inline-flex; align-items: center; gap: 22px; padding: 10px 15px; border: 1px solid var(--accent-line); border-radius: 6px; background: var(--panel); color: var(--p1); font-size: 14px; }
.p-feature-shortcuts a:hover { background: var(--accent-soft); border-color: var(--p1); }
.p-feature-shortcuts span { color: var(--text-dim); }
.p-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.p-feature-detail { display: flex; flex-direction: column; min-width: 0; padding: 27px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.p-feature-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.p-feature-icon { display: grid; place-items: center; width: 42px; height: 42px; background: var(--accent-soft); color: var(--p1); border-radius: 8px; }
.p-feature-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.p-feature-scope { font-size: 12px; color: var(--text-dim); }
.p-feature-detail h3 { margin: 23px 0 12px; font-size: 21px; line-height: 1.55; font-weight: 550; letter-spacing: 0; }
.p-feature-detail p, .p-feature-detail li { font-size: 14px; line-height: 1.95; }
.p-feature-detail p { color: var(--text-dim); margin: 0 0 20px; }
.p-feature-detail ul { display: grid; gap: 12px; padding: 0; margin: 0 0 24px; list-style: none; }
.p-feature-detail li { position: relative; padding-left: 15px; overflow-wrap: anywhere; }
.p-feature-detail li::before { content: ''; position: absolute; left: 0; top: .8em; width: 4px; height: 4px; border-radius: 50%; background: var(--p1); }
.p-feature-use { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--line); font-size: 12px; line-height: 1.9; color: var(--text-dim); }
.p-home-faq { padding-top: 0; }
.p-faq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; align-items: start; }
.p-faq-grid details { border-top: 1px solid var(--line); padding: 19px 0; }
.p-faq-grid summary { position: relative; padding-right: 28px; list-style: none; font-size: 16px; font-weight: 500; line-height: 1.75; cursor: pointer; }
.p-faq-grid summary::-webkit-details-marker { display: none; }
.p-faq-grid summary::after { content: '+'; position: absolute; right: 3px; top: 0; color: var(--p1); font: 22px/1.3 Consolas, monospace; }
.p-faq-grid details[open] summary::after { content: '−'; }
.p-faq-grid p { margin: 13px 0 0; font-size: 14px; line-height: 1.95; color: var(--text-dim); }
@media (max-width: 1100px) { .p-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) {
  .p-feature-grid, .p-faq-grid { grid-template-columns: minmax(0, 1fr); }
  .p-feature-detail { padding: 25px; }
  .p-feature-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-feature-shortcuts a { justify-content: space-between; gap: 8px; padding: 11px 13px; }
  .p-capabilities .p-section-head h2, .p-home-faq .p-section-head h2 { font-size: 27px; line-height: 1.45; }
}
