.agent-roster { display: block; }
.agent-roster-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--s5); margin-bottom: var(--s5); }
.agent-roster-head h2 { margin: 0; color: var(--text); font: 400 clamp(28px, 3vw, 43px)/1.02 var(--display); letter-spacing: -.025em; }
.agent-roster-head p { max-width: 50ch; margin: 0; color: var(--text-3); font-size: var(--t-meta); line-height: 1.6; }
.agent-feature-grid { display: grid; grid-template-columns: repeat(var(--cols-rich, 3), minmax(0, 1fr)); gap: var(--s4); margin-bottom: var(--s8); }
.agent-feature-card { --agent-accent: #8bc2ea; --agent-core: #245f87; display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: var(--hairline) solid rgba(255,255,255,.13); border-top-color: color-mix(in srgb, var(--agent-accent) 56%, transparent); border-radius: var(--radius); background: #111112; color: inherit; text-decoration: none; }
.agent-feature-card-art { position: relative; aspect-ratio: 16/10; overflow: hidden; background: #171719; }
.agent-feature-card-art img { width: 100%; height: 100%; object-fit: cover; object-position: center var(--feature-y, 35%); display: block; filter: saturate(.88) brightness(.86); transition: transform 500ms var(--ease), filter 240ms ease; }
.agent-feature-card.is-live:hover .agent-feature-card-art img { transform: scale(1.025); filter: saturate(1) brightness(.92); }
.agent-feature-index { position: absolute; left: var(--s3); bottom: var(--s3); padding: 6px 8px; border-radius: 2px; background: rgba(7,7,8,.84); color: var(--text-2); font: 8px var(--mono); letter-spacing: .13em; text-transform: uppercase; backdrop-filter: blur(8px); }
.agent-feature-copy { display: flex; flex: 1; flex-direction: column; padding: clamp(22px, 2.1vw, 32px); }
.agent-status { display: inline-flex; align-items: center; gap: 8px; color: var(--agent-accent); font: 8px var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.agent-status::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px color-mix(in srgb, var(--agent-accent) 10%, transparent); }
.agent-feature-card h3 { margin: 16px 0 4px; color: var(--text); font: 400 clamp(34px, 3vw, 48px)/.94 var(--display); letter-spacing: -.035em; }
.agent-feature-card h3 em { color: var(--agent-accent); font-weight: 400; }
/* Cormorant's italic sits optically larger than its roman at the same size.
   Every other display italic on the site already carries this correction. */
.agent-feature-copy h3 em { font-size: .88em; }
.agent-feature-role { margin: 0; color: var(--text-3); font-size: var(--t-support); line-height: 1.5; }
.agent-feature-belief { margin: 18px 0 0; color: var(--text-2); font-size: var(--t-body-2); line-height: 1.7; text-wrap: pretty; }
.agent-feature-services { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: auto; padding-top: 24px; }
.agent-feature-services b { flex-basis: 100%; color: var(--agent-accent); font: var(--t-label-s) var(--mono); font-weight: 400; letter-spacing: .13em; text-transform: uppercase; }
.agent-feature-services span { color: var(--text-2); font-size: var(--t-support); line-height: 1.4; }
.agent-feature-foot { min-height: 45px; display: flex; align-items: end; margin-top: 22px; padding-top: 18px; border-top: var(--hairline) solid var(--line); }
.agent-enter { min-height: 42px; display: inline-flex; align-items: center; gap: 12px; padding: 0 15px; border: 1px solid var(--agent-core); border-radius: 3px; background: var(--agent-core); color: var(--text); font: 500 9px var(--mono); letter-spacing: .11em; text-transform: uppercase; }
.agent-feature-card.is-live:hover .agent-enter { border-color: var(--agent-accent); filter: brightness(1.08); }
.agent-feature-card.is-live:focus-visible { outline: 2px solid var(--agent-accent); outline-offset: 4px; }
.agent-directory-label { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: var(--s5); margin-bottom: var(--s4); padding-bottom: var(--s3); border-bottom: var(--hairline) solid var(--line); }
.agent-directory-label h3 { margin: 0; color: var(--text); font: 400 25px/1.1 var(--display); }
.agent-directory-label span { color: var(--text-3); font: 8px var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.agent-directory { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s4); }
.agent-person { display: grid; grid-template-columns: 152px minmax(0, 1fr); min-height: 280px; border: var(--hairline) solid rgba(255,255,255,.075); border-radius: var(--radius); overflow: hidden; background: rgba(255,255,255,.008); }
.agent-person-art { min-height: 280px; overflow: hidden; background: #121214; }
.agent-person-art img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(.74) saturate(.38) brightness(.69) contrast(.96); }
.agent-person-copy { display: flex; flex-direction: column; min-width: 0; padding: var(--s4); }
.agent-person-top { display: flex; align-items: start; justify-content: space-between; gap: var(--s3); }
.agent-person-domain, .agent-person-state { color: #686a65; font: 8px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.agent-person-state { flex: none; color: #767972; }
.agent-person h4 { margin: 8px 0 4px; color: #b7b7b1; font: 400 25px/1 var(--display); }
.agent-person-role { margin: 0; color: #858780; font-size: 11px; line-height: 1.45; }
.agent-person-belief { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; margin: 13px 0 0; color: #73756f; font-size: 11px; line-height: 1.6; text-wrap: pretty; }
.agent-person-offers { display: flex; flex-wrap: wrap; gap: 5px 11px; margin-top: auto; padding-top: var(--s3); border-top: var(--hairline) solid rgba(255,255,255,.07); }
.agent-person-offers b { flex-basis: 100%; color: #62645f; font: var(--t-label-s) var(--mono); font-weight: 400; letter-spacing: .12em; text-transform: uppercase; }
.agent-person-offers span { color: #777973; font-size: var(--t-support); line-height: 1.35; }
.agent-truth { display: grid; grid-template-columns: auto 1fr; gap: var(--s4); align-items: start; margin-top: var(--s7); padding: var(--s5); border-top: var(--hairline) solid var(--line); border-bottom: var(--hairline) solid var(--line); }
.agent-truth strong { color: var(--violet-pale); font: 400 22px/1.15 var(--display); }
.agent-truth p { max-width: 72ch; margin: 0; color: var(--text-3); font-size: var(--t-support); line-height: 1.7; }
@media (max-width: 1120px) {
  .agent-directory { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .agent-roster-head { display: block; }
  .agent-roster-head p { margin-top: var(--s3); }
  .agent-feature-card-art { aspect-ratio: 4/3; }
  .agent-feature-copy { padding: var(--s5); }
  .agent-person { grid-template-columns: 124px minmax(0, 1fr); }
  .agent-truth { grid-template-columns: 1fr; }
}
@media (max-width: 430px) {
  .agent-person { grid-template-columns: 106px minmax(0, 1fr); min-height: 320px; }
  .agent-person-art { min-height: 320px; }
  .agent-person-copy { padding: 14px; }
  .agent-person-belief { display: block; overflow: visible; }
}
@media (prefers-reduced-motion: reduce) {
  .agent-feature-card-art img { transition: none; }
}