/* Scoped to the capabilities section; reuse the current landing palette. */
.capabilities-section { width: min(100% - 40px, var(--landing-max)); margin: auto; padding: 72px 0; color: var(--landing-text); scroll-margin-top: 100px; }
.capabilities-heading { max-width: 760px; margin-bottom: 36px; }
.capabilities-heading h2 { margin: 0; font-size: clamp(1.9rem, 3.5vw, 2.8rem); line-height: 1.15; letter-spacing: -.035em; text-wrap: balance; }
.capabilities-heading > p:last-child { max-width: 640px; margin: 18px 0 0; color: var(--landing-muted); font-size: 1rem; }
.capabilities-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.capabilities-group { min-width: 0; display: grid; grid-template-rows: auto repeat(3, 1fr); gap: 12px; }
.capabilities-group > h3 { margin: 0 0 8px; font-size: 1rem; line-height: 1.5; }
.capabilities-card { min-width: 0; padding: 22px; border: 1px solid var(--landing-line); border-radius: 12px; background: var(--landing-surface); transition: border-color .18s ease; }
.capabilities-card:first-of-type { border-color: rgba(198, 161, 90, .4); background: linear-gradient(135deg, rgba(198, 161, 90, .09), var(--landing-surface) 75%); }
.capabilities-card svg { display: block; width: 26px; height: 26px; margin-bottom: 18px; color: var(--landing-gold); }
.capabilities-card h4 { margin: 0 0 8px; font-size: 1.05rem; line-height: 1.4; }
.capabilities-card p { margin: 0; color: var(--landing-muted); font-size: .95rem; line-height: 1.65; }
.capabilities-action { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 28px; padding-top: 28px; border-top: 1px solid var(--landing-line); }
.capabilities-action p { margin: 0; color: var(--landing-muted); font-size: .95rem; }
.capabilities-action .landing-button { min-height: 48px; flex-shrink: 0; }
.capabilities-action a:focus-visible { outline: 3px solid var(--landing-text); outline-offset: 5px; }
@media (hover: hover) { .capabilities-card:hover { border-color: var(--landing-gold); } }
@media (max-width: 1024px) { .capabilities-section { width: 100%; padding: 48px 20px; } .capabilities-grid { gap: 16px; } .capabilities-card { padding: 18px; } }
@media (max-width: 760px) { .capabilities-grid { grid-template-columns: 1fr; gap: 28px; } .capabilities-group { grid-template-rows: auto; } .capabilities-action { flex-direction: column; align-items: flex-start; gap: 16px; } .capabilities-action .landing-button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .capabilities-card, .capabilities-action .landing-button { transition: none; animation: none; } }
