.capability-strip > li { display: block; padding: 0; min-width: 0; }
.capability-item > summary { display: flex; align-items: center; gap: 16px; min-height: 58px; padding: 17px 2px; cursor: pointer; list-style: none; touch-action: manipulation; }
.capability-item > summary::-webkit-details-marker { display: none; }
.capability-item > summary:hover, .capability-item[open] > summary { color: var(--accent); }
.capability-item > summary:focus-visible { outline-offset: -2px; border-radius: 6px; }
.capability-item > summary .cap-arrow { margin-left: auto; font-size: 1.1rem; font-weight: 300; flex-shrink: 0; transition: transform 160ms ease; }
.capability-item[open] > summary .cap-arrow { transform: rotate(45deg); }
.capability-info { position: relative; color: var(--text); background: #141c16; border: 1px solid rgba(211, 232, 201, .19); border-radius: 20px; overflow: hidden; margin: 4px 0 20px; }
.capability-item[open] .capability-info { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
.capability-image { display: block; width: 100%; height: 100%; min-height: 220px; object-fit: cover; background: #101812; }
.capability-copy { padding: 32px 28px; align-self: center; min-width: 0; }
.capability-kicker { display: block; color: var(--accent); font: .62rem/1.5 var(--font-mono); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 12px; }
.capability-copy h3 { margin: 0 0 14px; font-size: 1.4rem; line-height: 1.2; }
.capability-copy p { margin: 0 0 20px; font-size: .9rem; line-height: 1.7; }
.capability-link { display: inline-flex; align-items: center; gap: 16px; color: var(--accent); font-size: .78rem; min-height: 36px; }
.capability-link:hover { color: var(--text); }
.capability-close { display: none; }
.capability-hover .capability-info[popover] { position: fixed; inset: auto; margin: 0; width: min(680px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; box-shadow: 0 22px 64px rgba(0, 0, 0, .48); z-index: 70; }
.capability-hover .capability-info[popover]:not(:popover-open) { display: none; }
.capability-hover .capability-info::backdrop { background: transparent; pointer-events: none; }
.capability-hover .capability-close { display: grid; place-items: center; position: absolute; right: 8px; top: 8px; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; color: var(--muted); background: transparent; font-size: 1.4rem; line-height: 1; }
.capability-hover .capability-close:hover { background: rgba(230, 245, 221, .06); color: var(--text); }
.capability-hover .capability-copy { padding-top: 42px; }
.capability-hover .capability-info :focus-visible { outline-offset: -2px; }
@media (max-width: 800px), (hover: none), (pointer: coarse) {
  .capability-strip { grid-template-columns: 1fr; }
  .capability-item[open] .capability-info { grid-template-columns: 1fr; }
  .capability-image { height: 160px; min-height: 0; object-fit: contain; }
  .capability-copy { padding: 22px; }
  .capability-copy h3 { font-size: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) { .capability-item > summary .cap-arrow { transition: none; } }