.automation-page {
  background:
    radial-gradient(circle at 50% 30%, rgba(91, 174, 10, .11), transparent 34rem),
    radial-gradient(circle at 8% 88%, rgba(58, 113, 8, .08), transparent 28rem),
    #030504;
}

.site-nav a.active { color: var(--green); position: relative; }
.site-nav a.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -.75rem; height: 3px; border-radius: 3px; background: var(--green); }

.automation-main { overflow: hidden; }
.automation-hero { padding: 8.4rem 0 2rem; }
.automation-heading { margin-bottom: 1.35rem; }
.automation-heading .eyebrow { margin-bottom: .4rem; }
.automation-heading h1 { max-width: 1120px; margin: 0; font-size: clamp(3rem, 5.25vw, 5.4rem); line-height: .97; letter-spacing: -.052em; }
.automation-heading h1 span { color: var(--green); }
.automation-heading > p:last-child { margin: .75rem 0 0; max-width: 980px; color: #d0d8d2; font-size: clamp(1rem, 1.65vw, 1.35rem); }

.automation-layout { display: grid; grid-template-columns: minmax(210px, 250px) minmax(0, 600px) minmax(210px, 250px); grid-template-rows: 1fr 1fr; gap: 1rem 1.25rem; align-items: start; justify-content: center; }
.workflow-visual { grid-column: 2; grid-row: 1 / 3; position: relative; align-self: center; overflow: hidden; border: 2px solid var(--green); border-radius: 14px; background: #071008; box-shadow: 0 0 28px rgba(135,242,13,.18); }
.workflow-visual img { display: block; width: 100%; height: auto; }

.automation-step { position: relative; display: grid; grid-template-columns: 48px 1fr; gap: .85rem; align-content: start; min-height: 150px; padding: 1.15rem 1.15rem 4.15rem; border: 1px solid rgba(135,242,13,.27); border-radius: 18px; background: linear-gradient(145deg, rgba(13,25,16,.92), rgba(5,9,7,.94)); box-shadow: inset 0 0 35px rgba(135,242,13,.025); }
.step-attract { grid-column: 1; grid-row: 1; }
.step-qualify { grid-column: 1; grid-row: 2; align-self: end; }
.step-capture { grid-column: 3; grid-row: 1; }
.step-respond { grid-column: 3; grid-row: 2; align-self: end; }
.step-number { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: rgba(58,122,5,.36); color: var(--green); font-size: 1.55rem; font-weight: 900; }
.automation-step h2 { margin: .25rem 0 .2rem; font-size: 1.45rem; letter-spacing: -.025em; }
.automation-step p { margin: 0; color: #c3cdc5; font-size: .9rem; line-height: 1.45; }
.step-icon { position: absolute; right: 1rem; bottom: .9rem; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.04); color: white; font-size: 1.4rem; }

.automation-detail-grid { display: grid; grid-template-columns: .85fr 1.5fr .85fr; gap: 1.25rem; margin-top: 1.25rem; }
.automation-detail-grid article { min-width: 0; border: 1px solid rgba(135,242,13,.26); border-radius: 18px; background: rgba(7,14,9,.9); padding: 1.15rem; }
.automation-detail-grid h2 { margin: 0 0 .35rem; font-size: 1.15rem; line-height: 1.2; }
.automation-detail-grid p { margin: 0; color: var(--muted); font-size: .86rem; }
.qualification-list { list-style: none; padding: 0; margin: .9rem 0 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.qualification-list li { display: flex; align-items: center; gap: .65rem; padding: .45rem .65rem; border-bottom: 1px solid var(--line); color: #ced7d0; font-size: .78rem; }
.qualification-list li:last-child { border-bottom: 0; }
.qualification-list li > span { width: 15px; height: 15px; flex: 0 0 15px; border: 1px solid #aeb8b0; border-radius: 50%; }
.qualification-list li.selected { background: rgba(135,242,13,.12); color: white; box-shadow: inset 0 0 0 1px var(--green); }
.qualification-list li.selected > span { border: 4px solid #315c09; background: var(--green); box-shadow: 0 0 8px var(--green); }
.process-columns { display: grid; grid-template-columns: repeat(3, 1fr); gap: .65rem; margin-top: .9rem; }
.process-columns > div { padding: .8rem; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.018); }
.process-icon { float: left; margin-right: .55rem; color: var(--green); font-size: 1.55rem; line-height: 1; }
.process-columns h3 { margin: 0 0 .25rem; font-size: .83rem; }
.process-columns p { clear: both; font-size: .76rem; }
.human-card { display: flex; gap: .9rem; align-items: flex-start; }
.target-icon { color: var(--green); font-size: 3rem; line-height: 1; text-shadow: 0 0 18px rgba(135,242,13,.35); }
.human-card h2 { font-size: 1.2rem; }

.automation-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 230px)); justify-content: center; gap: .8rem; margin: 1.25rem 0 .65rem; }
.automation-disclaimer { margin: 0 auto; max-width: 920px; color: var(--muted-2); text-align: center; font-size: .72rem; }
.automation-footer { padding: 1.25rem 0; border-top: 1px solid var(--line); color: var(--muted-2); font-size: .8rem; }
.automation-footer .container { display: flex; justify-content: space-between; gap: 1rem; }
.automation-footer a { color: #d6ddd7; }
.automation-footer a:hover { color: var(--green); }

@media (max-width: 980px) {
  .site-nav a.active::after { display: none; }
  .automation-hero { padding-top: 7rem; }
  .automation-layout { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .workflow-visual { grid-column: 1 / -1; grid-row: 1; }
  .step-attract, .step-capture, .step-qualify, .step-respond { grid-column: auto; grid-row: auto; min-height: 150px; padding: 1.15rem; }
  .automation-detail-grid { grid-template-columns: 1fr 1fr; }
  .process-card { grid-column: 2; grid-row: 1 / 3; }
  .human-card { grid-column: 1; }
  .process-columns { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  .automation-hero { padding-top: 6.6rem; }
  .automation-heading h1 { font-size: clamp(2.75rem, 14vw, 4rem); }
  .automation-layout { gap: .7rem; }
  .automation-step { grid-template-columns: 42px 1fr; padding: .9rem; min-height: 138px; }
  .step-number { width: 42px; height: 42px; font-size: 1.3rem; }
  .automation-step h2 { font-size: 1.1rem; }
  .automation-step p { font-size: .78rem; padding-right: 2rem; }
  .step-icon { width: 36px; height: 36px; right: .75rem; bottom: .7rem; font-size: 1.1rem; }
  .automation-detail-grid { grid-template-columns: 1fr; gap: .75rem; }
  .process-card, .human-card { grid-column: auto; grid-row: auto; }
  .process-columns { grid-template-columns: 1fr; }
  .automation-actions { grid-template-columns: 1fr 1fr; }
  .automation-actions .button { padding-inline: .65rem; font-size: .84rem; }
  .automation-footer .container { flex-direction: column; }
}

@media (max-width: 420px) {
  .automation-layout { grid-template-columns: 1fr; }
  .workflow-visual { grid-column: 1; }
  .automation-actions { grid-template-columns: 1fr; }
}