/* ═══════════════════════════════════════════════════════════════════════
   ATEND REGRAS — Motor de Regras Landing Page
   Prefix: ar-
   Accent: Amber (#f59e0b) + Indigo (#6366f1)
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  --ar-amber: #f59e0b;
  --ar-amber-light: #fbbf24;
  --ar-indigo: #6366f1;
  --ar-indigo-light: #818cf8;
  --ar-cyan: #06b6d4;
}

/* ═══ HERO ═══ */
.ar-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 7rem 0 4rem;
  overflow: hidden;
}
.ar-hero__bg {
  position: absolute; inset: 0; z-index: 0; overflow: hidden;
}
.ar-hero__canvas {
  position: absolute; inset: 0; width: 100%; height: 100%; opacity: .35; pointer-events: none;
}
.ar-hero__orb {
  position: absolute; border-radius: 50%; filter: blur(100px); pointer-events: none;
}
.ar-hero__orb--1 {
  width: 600px; height: 600px; top: -15%; right: -8%;
  background: radial-gradient(circle, rgba(245,158,11,0.14), transparent 70%);
  animation: ar-drift-1 22s ease-in-out infinite;
}
.ar-hero__orb--2 {
  width: 500px; height: 500px; bottom: -10%; left: -5%;
  background: radial-gradient(circle, rgba(99,102,241,0.12), transparent 70%);
  animation: ar-drift-2 26s ease-in-out infinite;
}
.ar-hero__orb--3 {
  width: 400px; height: 400px; top: 35%; left: 30%;
  background: radial-gradient(circle, rgba(6,182,212,0.08), transparent 70%);
  animation: ar-drift-3 20s ease-in-out infinite;
}
@keyframes ar-drift-1 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-50px,40px)} }
@keyframes ar-drift-2 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(40px,-30px)} }
@keyframes ar-drift-3 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-30px,-40px)} }

.ar-hero__inner {
  text-align: center;
}
.ar-hero__content {
  position: relative; z-index: 2; max-width: 800px; margin: 0 auto;
}
.ar-hero__title {
  font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 800;
  letter-spacing: -0.03em; line-height: 1.1; margin-bottom: 1.5rem;
}
.ar-hero__desc {
  font-size: 1.15rem; line-height: 1.75; color: var(--wf-text-2); max-width: 640px; margin: 0 auto 2.5rem;
}
.ar-hero__ctas {
  display: flex; align-items: center; justify-content: center; gap: 1rem; flex-wrap: wrap;
}

/* Hero stats */
.ar-hero__stats {
  display: flex; justify-content: center; gap: 3rem; margin-top: 4rem; flex-wrap: wrap;
}
.ar-hero__stat {
  text-align: center;
}
.ar-hero__stat-num {
  font-size: clamp(2rem, 4vw, 2.8rem); font-weight: 800; color: var(--ar-amber-light);
  letter-spacing: -0.03em; line-height: 1;
}
.ar-hero__stat-label {
  font-size: .85rem; color: var(--wf-text-3); margin-top: .4rem;
}

/* ═══ HERO SCREENSHOT ═══ */
.ar-hero-screenshot {
  margin-top: 3rem;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 8px 40px rgba(0,0,0,.35), 0 0 60px rgba(245,158,11,.06);
}

/* ═══ BROWSER FRAME ═══ */
.ar-browser-frame {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.06);
  background: #0c0c0e;
}
.ar-browser-frame__bar {
  display: flex; align-items: center; gap: .8rem;
  padding: .55rem 1rem;
  background: rgba(255,255,255,.04);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.ar-browser-frame__dots {
  display: flex; gap: 5px;
}
.ar-browser-frame__dot {
  width: 10px; height: 10px; border-radius: 50%;
}
.ar-browser-frame__dot--r { background: #ef4444; }
.ar-browser-frame__dot--y { background: #eab308; }
.ar-browser-frame__dot--g { background: #22c55e; }
.ar-browser-frame__url {
  flex: 1; display: flex; align-items: center; gap: .4rem;
  padding: .25rem .8rem; border-radius: 6px;
  background: rgba(255,255,255,.04);
  font-size: .72rem; color: var(--wf-text-3); font-family: monospace;
}
.ar-browser-frame__actions {
  display: flex; align-items: center; color: var(--wf-text-3);
}
.ar-browser-frame__viewport {
  position: relative; overflow: hidden; background: #0c0c0f;
}
.ar-browser-frame img {
  display: block; width: 100%; height: auto;
}

/* ═══ ILLUSTRATION SYSTEM ═══ */
.ar-illust {
  width: 100%; display: flex;
  background: #0c0c0f; color: rgba(255,255,255,.7);
  font-size: .65rem; line-height: 1.4; overflow: hidden;
}
.ar-illust__sidebar {
  width: 44px; min-width: 44px;
  background: rgba(255,255,255,.03);
  border-right: 1px solid rgba(255,255,255,.06);
  display: flex; flex-direction: column; align-items: center;
  padding: .6rem 0; gap: .55rem;
}
.ar-illust__logo {
  font-size: 1rem; color: var(--ar-amber-light);
  margin-bottom: .3rem; opacity: .8;
}
.ar-illust__nav-item {
  width: 30px; height: 30px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; color: rgba(255,255,255,.3);
  transition: all 150ms ease;
}
.ar-illust__nav-item--active {
  background: rgba(245,158,11,.12); color: var(--ar-amber);
}
.ar-illust__main {
  flex: 1; display: flex; flex-direction: column; min-width: 0;
}
.ar-illust__topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: .4rem .7rem; border-bottom: 1px solid rgba(255,255,255,.06);
  gap: .5rem; flex-wrap: wrap;
}
.ar-illust__breadcrumb {
  font-size: .55rem; color: rgba(255,255,255,.35); white-space: nowrap;
}
.ar-illust__topbar-actions {
  display: flex; align-items: center; gap: .4rem;
}
.ar-illust__filter-pill {
  display: flex; align-items: center; gap: .25rem;
  padding: .15rem .5rem; border-radius: 5px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08);
  font-size: .5rem; color: rgba(255,255,255,.45); white-space: nowrap;
}
.ar-illust__filter-pill--active {
  background: rgba(245,158,11,.12); border-color: rgba(245,158,11,.2); color: var(--ar-amber-light);
}
.ar-illust__live-dot {
  width: 6px; height: 6px; background: #10b981; border-radius: 50%;
  animation: ar-illust-pulse 2s ease-in-out infinite;
}
@keyframes ar-illust-pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(16,185,129,.5); }
  50% { opacity: .7; box-shadow: 0 0 0 4px rgba(16,185,129,0); }
}

/* ── Editor Canvas ── */
.ar-illust__canvas {
  position: relative; flex: 1;
  background:
    radial-gradient(circle at 1px 1px, rgba(255,255,255,.03) 1px, transparent 0);
  background-size: 24px 24px;
  padding: .6rem .8rem;
}

/* ── Flow Layout (replaces SVG connections) ── */
.ar-illust__flow {
  display: flex; flex-direction: column; align-items: center;
  gap: 0;
}
.ar-illust__row {
  display: flex; align-items: center; gap: 0;
}
.ar-illust__arrow {
  display: flex; align-items: center; justify-content: center;
  width: 36px; min-width: 28px; position: relative;
  padding: 0 2px;
}
.ar-illust__arrow span {
  display: block; width: 100%; height: 1.5px;
  background: linear-gradient(90deg, rgba(245,158,11,.45), rgba(245,158,11,.15));
  position: relative;
}
.ar-illust__arrow span::after {
  content: ''; position: absolute; right: -1px; top: 50%;
  transform: translateY(-50%);
  border: 3.5px solid transparent;
  border-left: 5px solid rgba(245,158,11,.45);
}
.ar-illust__arrow span::before {
  content: ''; position: absolute; top: 50%;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--ar-amber); transform: translateY(-50%);
  opacity: 0; animation: ar-flow-dot 2.5s ease-in-out infinite;
}
@keyframes ar-flow-dot {
  0%   { left: 0; opacity: 0; }
  15%  { opacity: .9; }
  85%  { opacity: .9; }
  100% { left: calc(100% - 5px); opacity: 0; }
}
.ar-illust__branch {
  display: flex; flex-direction: column; gap: .3rem;
}
.ar-illust__vconn {
  width: 1.5px; height: 20px;
  background: linear-gradient(180deg, rgba(245,158,11,.3), rgba(99,102,241,.2));
  position: relative;
}
.ar-illust__vconn::before {
  content: ''; position: absolute; left: 50%; bottom: -1px;
  transform: translateX(-50%);
  border: 3px solid transparent;
  border-top: 4px solid rgba(99,102,241,.3);
}

/* ── Nodes ── */
.ar-illust__node {
  display: flex; align-items: center; gap: .4rem;
  padding: .35rem .5rem;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  transition: all 300ms ease;
  white-space: nowrap;
}
.ar-illust__node:hover {
  border-color: rgba(245,158,11,.25);
  background: rgba(255,255,255,.06);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,0,0,.3);
}
.ar-illust__node-icon {
  width: 26px; height: 26px; border-radius: 7px;
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; flex-shrink: 0;
}
.ar-illust__node-icon--amber { background: rgba(245,158,11,.12); color: #f59e0b; }
.ar-illust__node-icon--indigo { background: rgba(99,102,241,.12); color: #818cf8; }
.ar-illust__node-icon--cyan { background: rgba(6,182,212,.12); color: #06b6d4; }
.ar-illust__node-icon--violet { background: rgba(167,139,250,.12); color: #a78bfa; }
.ar-illust__node-icon--green { background: rgba(16,185,129,.12); color: #10b981; }
.ar-illust__node-icon--red { background: rgba(239,68,68,.12); color: #ef4444; }

.ar-illust__node-body {
  display: flex; flex-direction: column;
}
.ar-illust__node-label {
  font-size: .58rem; font-weight: 700; color: rgba(255,255,255,.85);
}
.ar-illust__node-sub {
  font-size: .46rem; color: rgba(255,255,255,.35);
}
.ar-illust__node-status {
  width: 16px; height: 16px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .5rem;
}
.ar-illust__node-status--ok {
  background: rgba(16,185,129,.15); color: #10b981;
}
.ar-illust__node-badge {
  font-size: .4rem; padding: .1rem .3rem; border-radius: 4px;
  background: rgba(6,182,212,.12); color: #06b6d4;
  font-weight: 700; letter-spacing: .02em; white-space: nowrap;
}
.ar-illust__node-badge--ai {
  background: rgba(99,102,241,.12); color: #818cf8;
}

/* ── Minimap ── */
.ar-illust__minimap {
  position: absolute; bottom: 8px; right: 8px;
  width: 80px; height: 50px;
  background: rgba(0,0,0,.5); border: 1px solid rgba(255,255,255,.08);
  border-radius: 6px; z-index: 2; overflow: hidden;
}
.ar-illust__minimap-dot {
  position: absolute; width: 4px; height: 4px; border-radius: 50%;
  background: rgba(245,158,11,.5);
}
.ar-illust__minimap-dot--cyan { background: rgba(6,182,212,.5); }
.ar-illust__minimap-dot--violet { background: rgba(167,139,250,.5); }
.ar-illust__minimap-dot--green { background: rgba(16,185,129,.5); }
.ar-illust__minimap-viewport {
  position: absolute; top: 4px; left: 4px; width: 55%; height: 60%;
  border: 1px solid rgba(245,158,11,.25); border-radius: 2px;
}

/* ── Status bar ── */
.ar-illust__statusbar {
  display: flex; align-items: center; gap: 1rem;
  padding: .3rem .7rem;
  background: rgba(255,255,255,.02);
  border-top: 1px solid rgba(255,255,255,.06);
  font-size: .5rem; color: rgba(255,255,255,.35);
}
.ar-illust__statusbar span {
  display: flex; align-items: center; gap: .25rem;
}
.ar-illust__statusbar-right {
  margin-left: auto;
}

/* ── Monitor illustration (KPIs) ── */
.ar-illust__kpis {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: .4rem;
  padding: .5rem .7rem;
}
.ar-illust__kpi {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px; padding: .35rem .45rem;
}
.ar-illust__kpi-label {
  font-size: .42rem; color: rgba(255,255,255,.35);
  text-transform: uppercase; letter-spacing: .04em;
}
.ar-illust__kpi-value {
  font-size: .85rem; font-weight: 700; color: #fff;
  line-height: 1.2;
}
.ar-illust__kpi-trend {
  font-size: .42rem; color: rgba(255,255,255,.3);
  display: flex; align-items: center; gap: .15rem;
}
.ar-illust__kpi-trend--up { color: #10b981; }

/* ── Monitor grid ── */
.ar-illust__monitor-grid {
  display: flex; gap: .5rem; padding: .5rem .7rem; flex: 1;
}
.ar-illust__exec-list {
  flex: 1.5;
  background: rgba(255,255,255,.02); border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px; padding: .4rem; display: flex; flex-direction: column;
}
.ar-illust__chart-header {
  font-size: .5rem; font-weight: 600; color: rgba(255,255,255,.5);
  padding: .2rem .3rem .4rem; display: flex; align-items: center; gap: .25rem;
}
.ar-illust__exec-row {
  display: flex; align-items: center; gap: .35rem;
  padding: .25rem .3rem; border-radius: 5px;
  font-size: .48rem; color: rgba(255,255,255,.5);
  transition: background 150ms ease;
}
.ar-illust__exec-row:hover { background: rgba(255,255,255,.03); }
.ar-illust__exec-dot {
  width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
}
.ar-illust__exec-dot--ok { background: #10b981; box-shadow: 0 0 4px rgba(16,185,129,.3); }
.ar-illust__exec-dot--warn { background: #f59e0b; box-shadow: 0 0 4px rgba(245,158,11,.3); }
.ar-illust__exec-dot--err { background: #ef4444; box-shadow: 0 0 4px rgba(239,68,68,.3); }
.ar-illust__exec-name { font-weight: 600; color: rgba(255,255,255,.7); flex: 1; }
.ar-illust__exec-nodes { color: rgba(255,255,255,.3); }
.ar-illust__exec-time { color: rgba(255,255,255,.3); }
.ar-illust__exec-ago { color: rgba(255,255,255,.2); font-size: .42rem; }

.ar-illust__events-panel {
  flex: 1;
  background: rgba(255,255,255,.02); border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px; padding: .4rem; display: flex; flex-direction: column;
}
.ar-illust__alert {
  display: flex; align-items: center; gap: .3rem;
  font-size: .48rem; padding: .2rem .3rem; border-radius: 4px;
  color: rgba(255,255,255,.45);
}
.ar-illust__alert--ok > i { color: #10b981; font-size: .7rem; }
.ar-illust__alert--warn > i { color: #f59e0b; font-size: .7rem; }
.ar-illust__alert--err > i { color: #ef4444; font-size: .7rem; }


/* ═══════════════════════════════════════════════════════════════════════
   MULTI-AGENT ILLUSTRATION (ar-ma) — Scaled-up, centered vertical flow
   ═══════════════════════════════════════════════════════════════════════ */
.ar-ma {
  width: 100%; display: flex;
  background: #08080b; color: rgba(255,255,255,.7);
  font-size: .78rem; line-height: 1.45; overflow: hidden;
}

/* ── Sidebar ── */
.ar-ma__sidebar {
  width: 50px; min-width: 50px;
  background: rgba(255,255,255,.02);
  border-right: 1px solid rgba(255,255,255,.05);
  display: flex; flex-direction: column; align-items: center;
  padding: .65rem 0; gap: .5rem;
}
.ar-ma__logo {
  font-size: 1.2rem; color: var(--ar-indigo-light);
  margin-bottom: .3rem; opacity: .8;
}
.ar-ma__nav {
  width: 34px; height: 34px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: .9rem; color: rgba(255,255,255,.25);
  transition: all 150ms ease;
}
.ar-ma__nav--active {
  background: rgba(99,102,241,.12); color: var(--ar-indigo);
}

/* ── Main ── */
.ar-ma__main {
  flex: 1; display: flex; flex-direction: column; min-width: 0;
}

/* ── Topbar ── */
.ar-ma__topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: .45rem .8rem; border-bottom: 1px solid rgba(255,255,255,.05);
  flex-wrap: wrap; gap: .35rem;
}
.ar-ma__breadcrumb {
  font-size: .56rem; color: rgba(255,255,255,.3); white-space: nowrap;
}
.ar-ma__breadcrumb strong { color: rgba(255,255,255,.6); }
.ar-ma__topbar-right {
  display: flex; align-items: center; gap: .4rem;
}
.ar-ma__pill {
  display: flex; align-items: center; gap: .22rem;
  padding: .15rem .5rem; border-radius: 5px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07);
  font-size: .5rem; color: rgba(255,255,255,.4);
}
.ar-ma__pill--live {
  background: rgba(16,185,129,.08); border-color: rgba(16,185,129,.15);
  color: #10b981;
}

/* ── Canvas ── */
.ar-ma__canvas {
  flex: 1; display: flex; flex-direction: column; align-items: stretch;
  padding: .9rem 1.2rem; gap: 0;
  background:
    radial-gradient(circle at 1px 1px, rgba(255,255,255,.02) 1px, transparent 0);
  background-size: 22px 22px;
}

/* ── Layers ── */
.ar-ma__layer {
  display: flex; align-items: center; gap: .7rem;
}
.ar-ma__layer-label {
  writing-mode: vertical-rl; text-orientation: mixed;
  transform: rotate(180deg);
  font-size: .46rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: rgba(255,255,255,.18);
  min-width: 18px; text-align: center;
  user-select: none;
}
.ar-ma__layer-content {
  flex: 1; display: flex; align-items: center; gap: .55rem;
  min-width: 0; justify-content: center;
}
.ar-ma__layer-content--wrap {
  flex-wrap: wrap; gap: .4rem; justify-content: center;
}
.ar-ma__layer-content--grid {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: .4rem;
}

/* ── Maestro highlight ── */
.ar-ma__layer--maestro .ar-ma__layer-content {
  justify-content: center;
}
.ar-ma__layer--maestro .ar-ma__node {
  border-color: rgba(167,139,250,.2);
  background: rgba(167,139,250,.04);
  box-shadow: 0 0 20px rgba(167,139,250,.06), inset 0 0 20px rgba(167,139,250,.02);
}

/* ── Arrows between layers ── */
.ar-ma__harrow {
  display: flex; align-items: center; justify-content: center;
  width: 38px; min-width: 30px; flex-shrink: 0;
}
.ar-ma__harrow span {
  display: block; width: 100%; height: 1.5px;
  background: linear-gradient(90deg, rgba(99,102,241,.4), rgba(99,102,241,.12));
  position: relative;
}
.ar-ma__harrow span::after {
  content: ''; position: absolute; right: -1px; top: 50%;
  transform: translateY(-50%);
  border: 3.5px solid transparent;
  border-left: 5px solid rgba(99,102,241,.4);
}
.ar-ma__harrow span::before {
  content: ''; position: absolute; top: 50%;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--ar-indigo); transform: translateY(-50%);
  opacity: 0; animation: ar-flow-dot 2.5s ease-in-out infinite;
}

.ar-ma__varrow {
  display: flex; justify-content: center;
  height: 30px; position: relative;
  margin-left: 18px;
}
.ar-ma__varrow span {
  display: block; width: 1.5px; height: 100%;
  background: linear-gradient(180deg, rgba(99,102,241,.35), rgba(167,139,250,.15));
  position: relative;
}
.ar-ma__varrow span::after {
  content: ''; position: absolute; left: 50%; bottom: -1px;
  transform: translateX(-50%);
  border: 3.5px solid transparent;
  border-top: 5px solid rgba(167,139,250,.35);
}
.ar-ma__varrow--up span {
  background: linear-gradient(180deg, rgba(167,139,250,.15), rgba(99,102,241,.35));
}
.ar-ma__varrow--up span::after {
  bottom: auto; top: -1px;
  border-top: none;
  border-bottom: 5px solid rgba(99,102,241,.35);
}
.ar-ma__varrow--bi {
  height: 36px;
}
.ar-ma__varrow--bi span {
  background: linear-gradient(180deg, rgba(99,102,241,.35), rgba(6,182,212,.3), rgba(99,102,241,.35));
}
.ar-ma__varrow--bi span::before {
  content: ''; position: absolute; left: 50%; top: -1px;
  transform: translateX(-50%);
  border: 3.5px solid transparent;
  border-bottom: 5px solid rgba(6,182,212,.35);
}
.ar-ma__varrow--bi span::after {
  border-top: 5px solid rgba(99,102,241,.35);
}

/* ── Nodes ── */
.ar-ma__node {
  display: flex; align-items: center; gap: .5rem;
  padding: .45rem .65rem;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  transition: all 250ms ease;
  white-space: nowrap; flex-shrink: 0;
}
.ar-ma__node:hover {
  border-color: rgba(99,102,241,.25);
  background: rgba(255,255,255,.05);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.ar-ma__node--sm {
  padding: .38rem .55rem;
}
.ar-ma__node--active {
  border-color: rgba(16,185,129,.2);
  background: rgba(16,185,129,.03);
}
.ar-ma__node-icon {
  width: 32px; height: 32px; border-radius: 7px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; flex-shrink: 0;
}
.ar-ma__node-icon--amber  { background: rgba(245,158,11,.1);  color: #f59e0b; }
.ar-ma__node-icon--indigo { background: rgba(99,102,241,.1);  color: #818cf8; }
.ar-ma__node-icon--cyan   { background: rgba(6,182,212,.1);   color: #06b6d4; }
.ar-ma__node-icon--violet { background: rgba(167,139,250,.1); color: #a78bfa; }
.ar-ma__node-icon--green  { background: rgba(16,185,129,.1);  color: #10b981; }
.ar-ma__node-icon--red    { background: rgba(239,68,68,.1);   color: #ef4444; }

.ar-ma__node-info {
  display: flex; flex-direction: column;
}
.ar-ma__node-name {
  font-size: .62rem; font-weight: 700; color: rgba(255,255,255,.8);
  display: flex; align-items: center; gap: .25rem;
}
.ar-ma__node-desc {
  font-size: .5rem; color: rgba(255,255,255,.3);
}
.ar-ma__node-ok {
  width: 18px; height: 18px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .52rem; background: rgba(16,185,129,.12); color: #10b981;
  flex-shrink: 0;
}
.ar-ma__node-pulse {
  width: 8px; height: 8px; border-radius: 50%;
  background: #10b981; flex-shrink: 0;
  animation: ar-illust-pulse 2s ease-in-out infinite;
}

/* ── Tags ── */
.ar-ma__tag {
  font-size: .44rem; padding: .1rem .3rem; border-radius: 3px;
  font-weight: 700; letter-spacing: .02em;
}
.ar-ma__tag--ai {
  background: rgba(167,139,250,.12); color: #a78bfa;
}
.ar-ma__tag--bus {
  background: rgba(6,182,212,.1); color: #06b6d4;
}
.ar-ma__tag--rules {
  background: rgba(245,158,11,.1); color: #f59e0b;
}

/* ── Agent cards (specialist grid) ── */
.ar-ma__agent {
  display: flex; flex-direction: column; align-items: center;
  gap: .15rem; padding: .5rem .35rem;
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 9px;
  text-align: center;
  transition: all 250ms ease;
  position: relative;
  min-width: 80px;
}
.ar-ma__agent:hover {
  border-color: rgba(99,102,241,.2);
  background: rgba(255,255,255,.04);
  transform: translateY(-1px);
}
.ar-ma__agent--active {
  border-color: rgba(16,185,129,.18);
  background: rgba(16,185,129,.03);
}
.ar-ma__agent i {
  font-size: 1.05rem; color: rgba(255,255,255,.45);
}
.ar-ma__agent--active i { color: var(--ar-indigo-light); }
.ar-ma__agent span {
  font-size: .54rem; font-weight: 700; color: rgba(255,255,255,.65);
}
.ar-ma__agent small {
  font-size: .44rem; color: rgba(255,255,255,.25);
}
.ar-ma__agent-status {
  width: 6px; height: 6px; border-radius: 50%;
  position: absolute; top: 5px; right: 5px;
}
.ar-ma__agent-status--ok {
  background: #10b981;
  box-shadow: 0 0 5px rgba(16,185,129,.4);
}

/* ── Rules engine layer ── */
.ar-ma__layer--rules {
  padding: .15rem 0;
}
.ar-ma__layer--rules .ar-ma__layer-content {
  flex-wrap: wrap; gap: .3rem; justify-content: center;
}
.ar-ma__rule {
  display: inline-flex; align-items: center; gap: .2rem;
  padding: .2rem .45rem; border-radius: 6px;
  background: rgba(245,158,11,.04);
  border: 1px solid rgba(245,158,11,.12);
  font-size: .48rem; font-weight: 600;
  color: rgba(255,255,255,.5);
  white-space: nowrap;
  transition: all 200ms ease;
}
.ar-ma__rule:hover {
  background: rgba(245,158,11,.08);
  border-color: rgba(245,158,11,.2);
  color: rgba(255,255,255,.7);
}
.ar-ma__rule i {
  font-size: .65rem; color: rgba(245,158,11,.7);
}
.ar-ma__rules-label {
  display: flex; align-items: center; gap: .3rem;
  font-size: .5rem; font-weight: 700; color: rgba(245,158,11,.6);
  margin-right: .2rem; white-space: nowrap;
}
.ar-ma__rules-label i { font-size: .75rem; }

/* ── Fork / bifurcation ── */
.ar-ma__layer-content--split {
  flex-wrap: nowrap;
}
.ar-ma__fork {
  display: flex; flex-direction: column; gap: .35rem;
  position: relative;
  padding-left: .15rem;
}
.ar-ma__fork::before {
  content: ''; position: absolute;
  left: 0; top: 50%; transform: translateY(-50%);
  width: 1.5px; height: calc(100% - 16px);
  background: linear-gradient(180deg, rgba(99,102,241,.3), rgba(99,102,241,.15));
}
.ar-ma__fork-branch {
  display: flex; align-items: center; gap: .55rem;
}

/* ── MCP Bus ── */
.ar-ma__bus {
  flex: 1;
  background: rgba(6,182,212,.03);
  border: 1px solid rgba(6,182,212,.12);
  border-radius: 11px;
  padding: .55rem .7rem;
  position: relative; overflow: hidden;
}
.ar-ma__bus-header {
  display: flex; align-items: center; justify-content: center; gap: .35rem;
  font-size: .58rem; color: rgba(255,255,255,.5);
  margin-bottom: .4rem;
}
.ar-ma__bus-header i { color: #06b6d4; font-size: .95rem; }
.ar-ma__bus-header strong { color: #06b6d4; }
.ar-ma__bus-services {
  display: flex; flex-wrap: wrap; gap: .28rem; justify-content: center;
}
.ar-ma__svc {
  display: flex; align-items: center; gap: .2rem;
  padding: .18rem .4rem; border-radius: 5px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.05);
  font-size: .48rem; color: rgba(255,255,255,.4);
  white-space: nowrap;
}
.ar-ma__svc i { font-size: .65rem; color: rgba(6,182,212,.6); }
.ar-ma__bus-bar {
  height: 2px; margin-top: .4rem;
  background: rgba(6,182,212,.1);
  border-radius: 2px;
  position: relative; overflow: hidden;
}
.ar-ma__bus-pulse {
  position: absolute; top: 0; left: 0;
  width: 40%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(6,182,212,.5), transparent);
  animation: ar-bus-flow 2.5s ease-in-out infinite;
}
@keyframes ar-bus-flow {
  0%   { left: -40%; }
  100% { left: 100%; }
}

/* ── Specialist layer highlight ── */
.ar-ma__layer--specialists {
  padding: .4rem 0;
}

/* ── MCP layer ── */
.ar-ma__layer--mcp .ar-ma__layer-content {
  padding: 0;
}

/* ── Status bar ── */
.ar-ma__statusbar {
  display: flex; align-items: center; gap: .9rem;
  padding: .4rem .8rem;
  background: rgba(255,255,255,.015);
  border-top: 1px solid rgba(255,255,255,.04);
  font-size: .52rem; color: rgba(255,255,255,.3);
}
.ar-ma__statusbar span {
  display: flex; align-items: center; gap: .25rem;
}
.ar-ma__statusbar-right {
  margin-left: auto;
}

/* ── Footnote ── */
.ar-ma__footnote {
  text-align: center; margin-top: 1.5rem;
  font-size: .85rem; color: rgba(255,255,255,.35);
  display: flex; align-items: center; justify-content: center; gap: .4rem;
}
.ar-ma__footnote i { color: var(--ar-indigo-light); font-size: .95rem; }
.ar-ma__footnote strong { color: rgba(255,255,255,.55); }


/* ═══ SHARED SECTION SPACING ═══ */
.ar-oquee,
.ar-pipeline,
.ar-editor,
.ar-features,
.ar-beneficios,
.ar-seguranca,
.ar-conexao,
.ar-usecases,
.ar-compare,
.ar-cta {
  padding: 6rem 0;
}
.ar-section-head {
  text-align: center; max-width: 700px; margin: 0 auto 3.5rem;
}

/* ═══ O QUE É — 3 CARDS ═══ */
.ar-oquee__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem;
}
.ar-oquee__card {
  background: var(--wf-bg-card); border: 1px solid var(--wf-border);
  border-radius: var(--wf-r-xl, 20px); padding: 2rem 1.5rem; text-align: center;
  transition: all 350ms var(--wf-ease, ease);
}
.ar-oquee__card:hover {
  border-color: rgba(245,158,11,0.3); transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(245,158,11,0.08);
}
.ar-oquee__card-icon {
  width: 56px; height: 56px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 1.2rem; font-size: 1.4rem;
}
.ar-oquee__card-icon--amber { background: rgba(245,158,11,0.12); color: var(--ar-amber-light); }
.ar-oquee__card-icon--indigo { background: rgba(99,102,241,0.12); color: var(--ar-indigo-light); }
.ar-oquee__card-icon--cyan { background: rgba(6,182,212,0.12); color: var(--ar-cyan); }
.ar-oquee__card h3 {
  font-size: 1.1rem; font-weight: 700; color: var(--wf-text-1); margin-bottom: .6rem;
}
.ar-oquee__card p {
  font-size: .9rem; line-height: 1.65; color: var(--wf-text-2);
}

/* ═══ PIPELINE — STEPS ═══ */
.ar-pipeline {
  background: linear-gradient(180deg, transparent, rgba(245,158,11,.02), transparent);
}
.ar-pipeline__steps {
  display: flex; align-items: flex-start; justify-content: center; gap: 0;
  flex-wrap: wrap;
}
.ar-pipeline__step {
  flex: 0 0 160px; text-align: center;
  padding: 1rem .5rem; position: relative;
}
.ar-pipeline__num {
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(245,158,11,.15); color: var(--ar-amber-light);
  font-size: .75rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto .6rem;
}
.ar-pipeline__icon {
  width: 52px; height: 52px; border-radius: 14px;
  background: var(--wf-bg-card); border: 1px solid var(--wf-border);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto .8rem; font-size: 1.3rem; color: var(--ar-amber-light);
  transition: all 300ms ease;
}
.ar-pipeline__step:hover .ar-pipeline__icon {
  border-color: rgba(245,158,11,.35);
  box-shadow: 0 4px 20px rgba(245,158,11,.1);
  transform: translateY(-2px);
}
.ar-pipeline__step h4 {
  font-size: .9rem; font-weight: 700; color: var(--wf-text-1); margin-bottom: .3rem;
}
.ar-pipeline__step p {
  font-size: .78rem; line-height: 1.5; color: var(--wf-text-3);
}
.ar-pipeline__connector {
  display: flex; align-items: center; justify-content: center;
  padding-top: 3.2rem; color: rgba(245,158,11,.3); font-size: 1rem;
}

/* ═══ EDITOR SPLIT — SCREENSHOT + CONTENT ═══ */
.ar-editor {
  background: linear-gradient(135deg, rgba(245,158,11,.02), rgba(99,102,241,.02));
}
.ar-editor__split {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 2.5rem; align-items: center;
  padding: 2.5rem;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(245,158,11,.03), rgba(99,102,241,.03));
  border: 1px solid rgba(245,158,11,.12);
  position: relative; overflow: hidden;
}
.ar-editor__split::before {
  content: '';
  position: absolute; top: -50%; right: -20%;
  width: 400px; height: 400px; border-radius: 50%;
  background: rgba(245,158,11,.04);
  filter: blur(80px); pointer-events: none;
}
.ar-editor__visual {
  position: relative; z-index: 1;
  border-radius: 14px; overflow: hidden;
  box-shadow: 0 6px 30px rgba(0,0,0,.3);
}
.ar-editor__content {
  position: relative; z-index: 1;
}
.ar-editor__content h3 {
  font-family: var(--wf-font-heading);
  font-size: clamp(1.3rem, 2.5vw, 1.7rem);
  font-weight: 800; color: var(--wf-text-1);
  margin: .8rem 0; line-height: 1.3;
}
.ar-editor__content > p {
  font-size: .95rem; line-height: 1.65; color: var(--wf-text-2);
  margin-bottom: 1.2rem;
}
.ar-editor__list {
  list-style: none; padding: 0; margin: 0 0 1.2rem;
  display: flex; flex-direction: column; gap: .65rem;
}
.ar-editor__list li {
  display: flex; gap: .6rem; align-items: flex-start;
  font-size: .88rem; line-height: 1.5; color: var(--wf-text-2);
}
.ar-editor__list li > i {
  color: var(--ar-amber-light); font-size: 1.1rem; margin-top: .1rem; flex-shrink: 0;
}
.ar-editor__list li strong {
  color: var(--wf-text-1);
}
.ar-editor__note {
  display: flex; align-items: center; gap: .5rem;
  font-size: .82rem; color: var(--wf-text-3); line-height: 1.5;
  padding: .8rem 1rem; border-radius: 8px;
  background: rgba(245,158,11,.06);
  border: 1px solid rgba(245,158,11,.1);
  margin-top: .4rem;
}
.ar-editor__note > i {
  color: var(--ar-amber-light); font-size: 1.1rem; flex-shrink: 0;
}

/* ═══ FEATURES — 8 CARDS ═══ */
.ar-features__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem;
}
.ar-features__card {
  background: var(--wf-bg-card); border: 1px solid var(--wf-border);
  border-radius: var(--wf-r-xl, 20px); padding: 1.5rem; text-align: center;
  transition: all 350ms var(--wf-ease, ease);
}
.ar-features__card:hover {
  border-color: rgba(245,158,11,.3); transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(245,158,11,.08);
}
.ar-features__card > i {
  font-size: 1.5rem; color: var(--ar-amber-light); display: block; margin-bottom: .8rem;
}
.ar-features__card h3 {
  font-size: .95rem; font-weight: 700; color: var(--wf-text-1); margin-bottom: .4rem;
}
.ar-features__card p {
  font-size: .82rem; line-height: 1.6; color: var(--wf-text-2);
}

/* ═══ MORE BANNER ═══ */
.ar-more-banner {
  margin-top: 2rem; padding: 1.2rem 1.5rem;
  border-radius: var(--wf-r-xl, 20px);
  background: rgba(245,158,11,.04);
  border: 1px solid rgba(245,158,11,.1);
  display: flex; align-items: center; gap: 1rem;
  color: var(--wf-text-3); font-size: .88rem; line-height: 1.6;
}
.ar-more-banner > i {
  font-size: 1.3rem; color: var(--ar-amber-light); flex-shrink: 0;
}

/* ═══ BENEFÍCIOS — 4 CARDS ═══ */
.ar-beneficios__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem;
}
.ar-beneficio {
  background: var(--wf-bg-card); border: 1px solid var(--wf-border);
  border-radius: var(--wf-r-xl, 20px); padding: 2rem 1.5rem; text-align: center;
  transition: all 350ms var(--wf-ease, ease); position: relative; overflow: hidden;
}
.ar-beneficio:hover {
  border-color: rgba(245,158,11,0.3); transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(245,158,11,0.08);
}
.ar-beneficio__icon {
  width: 56px; height: 56px; border-radius: 50%; display: flex;
  align-items: center; justify-content: center; margin: 0 auto 1.2rem;
  font-size: 1.4rem; background: rgba(245,158,11,0.12); color: var(--ar-amber-light);
}
.ar-beneficio h3 {
  font-size: 1.1rem; font-weight: 700; color: var(--wf-text-1); margin-bottom: .6rem;
}
.ar-beneficio p {
  font-size: .9rem; line-height: 1.65; color: var(--wf-text-2);
}

/* ═══ SEGURANÇA — 3 CARDS ═══ */
.ar-seguranca__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem;
}
.ar-seguranca__card {
  background: var(--wf-bg-card); border: 1px solid var(--wf-border);
  border-radius: var(--wf-r-xl, 20px); padding: 2rem; position: relative; overflow: hidden;
  transition: all 350ms var(--wf-ease, ease);
}
.ar-seguranca__card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--ar-indigo), var(--ar-amber));
}
.ar-seguranca__card:hover {
  transform: translateY(-3px); box-shadow: 0 8px 30px rgba(0,0,0,0.3);
}
.ar-seguranca__card > i {
  font-size: 1.6rem; color: var(--ar-indigo-light); margin-bottom: 1rem; display: block;
}
.ar-seguranca__card h4 {
  font-size: 1.1rem; font-weight: 700; color: var(--wf-text-1); margin-bottom: .6rem;
}
.ar-seguranca__card p {
  font-size: .9rem; line-height: 1.7; color: var(--wf-text-2);
}

/* ═══ CONEXÃO — 4 COL STRIP ═══ */
.ar-conexao__strip {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem;
}
.ar-conexao__item {
  background: var(--wf-bg-card); border: 1px solid var(--wf-border);
  border-radius: var(--wf-r-xl, 20px); padding: 1.5rem; text-align: center;
  transition: all 300ms var(--wf-ease, ease); text-decoration: none; color: inherit;
  display: flex; flex-direction: column; align-items: center; gap: .5rem;
}
.ar-conexao__item:hover {
  border-color: rgba(245,158,11,0.25); transform: translateY(-3px);
}
.ar-conexao__item > i {
  font-size: 1.6rem; color: var(--ar-amber-light);
}
.ar-conexao__item strong {
  font-size: .95rem; font-weight: 700; color: var(--wf-text-1);
}
.ar-conexao__item span {
  font-size: .82rem; line-height: 1.5; color: var(--wf-text-3);
}

/* ═══ CASOS DE USO — 2 COL ═══ */
.ar-usecases__grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem;
}
.ar-usecase {
  background: var(--wf-bg-card); border: 1px solid var(--wf-border);
  border-radius: var(--wf-r-xl, 20px); padding: 2rem; display: flex; gap: 1.2rem;
  transition: all 350ms var(--wf-ease, ease); position: relative;
}
.ar-usecase:hover {
  border-color: rgba(245,158,11,0.25); transform: translateY(-3px);
}
.ar-usecase__icon {
  width: 48px; height: 48px; border-radius: var(--wf-r-md, 12px); flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 1.2rem;
  background: rgba(245,158,11,0.12); color: var(--ar-amber-light);
}
.ar-usecase h3 {
  font-size: 1.05rem; font-weight: 700; color: var(--wf-text-1); margin-bottom: .4rem;
}
.ar-usecase p {
  font-size: .9rem; line-height: 1.65; color: var(--wf-text-2);
}
.ar-usecase__tag {
  position: absolute; top: 1rem; right: 1rem;
  font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  padding: 3px 10px; border-radius: var(--wf-r-full, 999px);
  background: rgba(245,158,11,0.1); color: var(--ar-amber-light); border: 1px solid rgba(245,158,11,0.2);
}

/* ═══ COMPARATIVO — TABLE ═══ */
.ar-compare__table-wrap {
  overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.ar-compare__table {
  width: 100%; border-collapse: collapse; font-size: .92rem;
}
.ar-compare__table th,
.ar-compare__table td {
  padding: 1rem 1.2rem; text-align: left; border-bottom: 1px solid var(--wf-border);
  color: var(--wf-text-2);
}
.ar-compare__table th {
  font-weight: 700; color: var(--wf-text-1); font-size: .85rem;
  text-transform: uppercase; letter-spacing: .04em;
}
.ar-compare__th--old {
  color: var(--wf-text-3) !important;
}
.ar-compare__th--new {
  color: var(--ar-amber-light) !important;
}
.ar-compare__table td:last-child {
  color: var(--wf-text-1);
}
.ar-compare__table tbody tr:hover {
  background: rgba(245,158,11,0.04);
}

/* ═══ CTA ═══ */
.ar-cta__card {
  background: linear-gradient(135deg, var(--ar-indigo), #1e1b4b);
  border-radius: var(--wf-r-2xl, 28px); padding: 4rem 3rem; text-align: center;
  position: relative; overflow: hidden;
}
.ar-cta__card::before {
  content: ''; position: absolute; top: -40%; right: -20%;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(245,158,11,0.15), transparent 70%);
  pointer-events: none;
}
.ar-cta__content {
  position: relative; z-index: 1;
}
.ar-cta__content h2 {
  font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 800;
  color: #fff; margin-bottom: 1rem;
}
.ar-cta__content p {
  color: rgba(255,255,255,.6); font-size: 1.05rem; max-width: 600px;
  margin: 0 auto 2rem;
}
.ar-cta__btns {
  display: flex; align-items: center; justify-content: center; gap: 1rem;
  flex-wrap: wrap;
}

/* ═══ RESPONSIVE ═══ */
@media (max-width: 1024px) {
  .ar-oquee__grid { grid-template-columns: 1fr; }
  .ar-beneficios__grid { grid-template-columns: repeat(2, 1fr); }
  .ar-seguranca__grid { grid-template-columns: 1fr; }
  .ar-conexao__strip { grid-template-columns: repeat(2, 1fr); }
  .ar-hero__stats { gap: 2rem; }
  .ar-features__grid { grid-template-columns: repeat(2, 1fr); }
  .ar-editor__split { grid-template-columns: 1fr; }
  .ar-pipeline__steps { gap: .5rem; }
  .ar-pipeline__step { flex: 0 0 130px; }
  .ar-pipeline__connector { display: none; }
  .ar-illust__kpis { grid-template-columns: repeat(2, 1fr); }
  .ar-illust__monitor-grid { flex-direction: column; }
  .ar-ma__layer-content--grid { gap: .35rem; }
  .ar-ma__layer-content { flex-wrap: wrap; }
  .ar-ma__rule { font-size: .44rem; padding: .16rem .35rem; }
  .ar-ma__rules-label { font-size: .46rem; }
}
@media (max-width: 640px) {
  .ar-beneficios__grid { grid-template-columns: 1fr; }
  .ar-usecases__grid { grid-template-columns: 1fr; }
  .ar-conexao__strip { grid-template-columns: 1fr; }
  .ar-features__grid { grid-template-columns: 1fr; }
  .ar-cta__card { padding: 2.5rem 1.5rem; }
  .ar-hero__stats { flex-direction: column; gap: 1.5rem; }
  .ar-pipeline__steps { flex-direction: column; align-items: center; }
  .ar-pipeline__step { flex: none; width: 100%; max-width: 260px; }
  .ar-editor__split { padding: 1.5rem; gap: 1.5rem; }
  .ar-illust__sidebar { display: none; }
  .ar-illust__row { flex-wrap: wrap; justify-content: center; gap: .25rem; }
  .ar-illust__arrow { width: 20px; min-width: 20px; }
  .ar-illust__kpis { grid-template-columns: 1fr 1fr; }
  .ar-illust__minimap { display: none; }
  .ar-illust__monitor-grid { flex-direction: column; }
  .ar-ma__sidebar { display: none; }
  .ar-ma__layer-label { display: none; }
  .ar-ma__layer-content { flex-wrap: wrap; gap: .25rem; }
  .ar-ma__layer-content--grid { gap: .3rem; }
  .ar-ma__harrow { width: 20px; min-width: 18px; }
  .ar-ma__bus-services { gap: .18rem; }
  .ar-ma__footnote { font-size: .72rem; flex-direction: column; }
  .ar-ma__rule { font-size: .4rem; padding: .14rem .3rem; }
  .ar-ma__rules-label { font-size: .42rem; }
  .ar-ma__varrow { height: 22px; }
  .ar-ma__varrow--bi { height: 26px; }
  .ar-ma__fork-branch { flex-wrap: wrap; gap: .3rem; }
  .ar-ma__layer-content--split { flex-wrap: wrap; }
}
