/* Preview-only refinements: typography QA should be readable and clearly differentiated by service. */

.page-ai-agents .service-hero h1 { max-width: 1100px; }
.page-ai-agents .service-hero__offer { max-width: 980px; }
.agent-hero-note { max-width: 58ch; margin: 18px 0 0; color: var(--muted); font-size: 16px; line-height: var(--body-leading); }
.agents-section-heading { max-width: 780px; }
.agent-tasks { margin: 48px 0 0; }
.agent-tasks > div { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 24px 72px; padding-block: 30px; border-top: 1px solid var(--hairline); }
.agent-tasks > div:last-child { padding-bottom: 0; }
.agent-tasks dt { max-width: 22ch; font: 600 clamp(21px, 2vw, 26px)/1.35 var(--font-body); }
.agent-tasks dd { margin: 0; max-width: 62ch; }
.agent-tasks p { margin: 0; color: var(--muted-strong); font-size: 16px; line-height: var(--body-leading); }
.agent-tasks .task-example { margin-top: 10px; color: var(--muted); font-size: 14px; }
.agent-example { --section-atmosphere: radial-gradient(ellipse 72% 60% at 82% 18%, rgba(111, 92, 255, .08), transparent 72%); }
.agent-example__layout { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(44px, 7vw, 96px); align-items: start; margin-top: 48px; }
.agent-workflow { display: grid; gap: 28px; margin: 0; padding: 0; list-style: none; }
.agent-workflow li { padding-left: 22px; border-left: 2px solid var(--hairline); }
.agent-workflow h3, .responsibility-bands h3, .agent-launch__steps h3 { margin: 0; font: 600 21px/1.35 var(--font-body); }
.agent-workflow p, .responsibility-bands p, .agent-launch__steps p { margin: 12px 0 0; color: var(--muted); font-size: 16px; line-height: var(--body-leading); }
.agent-draft { margin: 0; padding: clamp(32px, 4vw, 52px); color: #0a0910; background: #f0eee8; transform: rotate(-.35deg); box-shadow: 0 34px 90px rgba(0,0,0,.22); }
.agent-draft .document-label { color: #5f5d64; }
.agent-draft blockquote { margin: 28px 0; }
.agent-draft blockquote p { margin: 0; font: 400 clamp(22px, 2vw, 28px)/1.45 var(--font-display); letter-spacing: 0; }
.agent-draft blockquote p + p { margin-top: 20px; }
.agent-draft__source { padding-top: 20px; border-top: 1px solid #c4c2be; }
.agent-draft__source span { font-size: 12px; font-weight: 600; }
.agent-draft__source p { margin: 8px 0 0; color: #535158; font-size: 14px; line-height: 1.6; }
.agent-draft .agent-draft__approval { margin: 24px 0 0; font-size: 14px; font-weight: 600; line-height: 1.6; }
.responsibility { background-image: linear-gradient(180deg, #020106, #06040b 48%, #020106); }
.responsibility-bands { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; margin-top: 44px; }
.responsibility-bands section { padding-top: 22px; border-top: 1px solid var(--hairline); }
.agent-launch__layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(48px, 8vw, 112px); }
.agent-launch__steps { display: grid; gap: 28px; }
.agent-launch__steps section + section { border-top: 1px solid var(--hairline); padding-top: 26px; }
@media (max-width: 900px) {
  .agent-tasks { margin-top: 32px; }
  .agent-tasks > div { grid-template-columns: minmax(0, 1fr); gap: 14px; padding-block: 26px; }
  .agent-tasks dt { max-width: none; font-size: 21px; }
  .agent-example__layout { grid-template-columns: minmax(0, 1fr); gap: 36px; margin-top: 32px; }
  .agent-workflow h3, .responsibility-bands h3, .agent-launch__steps h3 { font-size: 20px; }
  .agent-draft { padding: 28px 24px; transform: none; }
  .responsibility-bands { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 32px; }
  .agent-launch__layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}