.ai-capability-banner { background: var(--navy); color: #fff; padding: clamp(28px, 4vw, 48px); min-height: 430px; align-content: center; border-top: 4px solid var(--gold); }
.ai-capability-banner .label { color: #aec7ca; }
.ai-capability-banner h2 { font: 400 clamp(35px, 3.2vw, 52px)/1.04 var(--serif); margin: 14px 0 32px; letter-spacing: -.035em; }
.ai-capability-banner ol { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.22); }
.ai-capability-banner li { padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.18); font-size: 14px; line-height: 1.45; }
.capability-note { margin: 30px 0 0; color: #aec7ca; font: 12px var(--sans); letter-spacing: .08em; text-transform: uppercase; }
.agent-system { padding: 88px 0 30px; }
.agent-system-heading { display: grid; grid-template-columns: 1.1fr .75fr; gap: clamp(30px, 8vw, 120px); align-items: end; margin-bottom: 34px; }
.agent-system-heading h2 { max-width: 690px; margin: 0; font: 400 clamp(36px, 4vw, 56px)/1.04 var(--serif); letter-spacing: -.04em; }
.agent-system-heading > p { margin: 0 0 5px; color: var(--ink-soft); font-size: 15px; line-height: 1.75; }
.agent-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--line); }
.agent-grid article { min-height: 156px; padding: 18px 18px 22px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: transparent; }
.agent-grid span { display: block; margin-bottom: 26px; color: var(--blue); font-size: 11px; letter-spacing: .1em; }
.agent-grid b { display: block; font: 400 25px var(--serif); }
.agent-grid p { margin: 5px 0 0; color: var(--ink-soft); font-size: 13px; line-height: 1.5; }
.agent-outcome { display: flex; align-items: center; gap: 13px; padding: 22px 0 0; color: var(--ink-soft); font-size: 13px; flex-wrap: wrap; }
.agent-outcome i { width: 28px; height: 1px; background: var(--gold); }
.agent-outcome strong { color: var(--ink); font-weight: 700; }
@media (max-width: 900px) { .agent-system-heading { grid-template-columns: 1fr; gap: 18px; } .agent-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .ai-capability-banner { min-height: 0; } .agent-system { padding-top: 64px; } .agent-grid article { min-height: 142px; padding: 16px 13px; } .agent-grid b { font-size: 22px; } .agent-grid span { margin-bottom: 22px; } .agent-outcome { gap: 8px; } .agent-outcome i { width: 16px; } }
