.architecture{padding:var(--section-pad) 0;background:var(--bg-alt)}.architecture-header{text-align:center;max-width:640px;margin-bottom:64px;margin-left:auto;margin-right:auto}.architecture-flow{background:var(--bg-card);border:1px solid var(--border);border-radius:24px;max-width:800px;margin:0 auto;padding:48px clamp(24px,5vw,56px);position:relative}.architecture-flow:before{content:"";background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.4;height:1px;position:absolute;top:0;left:0;right:0}.arch-layer{margin-bottom:8px}.arch-layer:last-of-type{margin-bottom:0}.arch-layer-label{letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);text-align:center;margin-bottom:16px;font-size:.65rem;font-weight:600}.arch-nodes{grid-template-columns:1fr 1fr;gap:16px;display:grid}.arch-node{border:1px solid var(--border);background:var(--bg);border-radius:14px;align-items:center;gap:14px;padding:18px 20px;transition:all .3s;display:flex}.arch-node:hover{border-color:var(--border-strong);transform:translateY(-2px);box-shadow:0 8px 24px #0000000a}.arch-node-icon{border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.arch-node-icon.input{color:var(--accent);background:#c4591a14}.arch-node-icon.process{color:var(--text-primary);background:#1111100d}.arch-node-icon.output{color:#227846;background:#22784614}.arch-node-title{color:var(--text-primary);margin-bottom:3px;font-size:.9rem;font-weight:500}.arch-node-desc{color:var(--text-muted);font-size:.75rem;font-weight:300}.arch-connector-down{justify-content:center;padding:8px 0;display:flex}.architecture-cta{text-align:center;margin-top:56px}.architecture-cta-text{color:var(--text-secondary);max-width:480px;margin:0 auto 28px;font-size:.95rem;font-weight:300;line-height:1.7}.architecture-cta-buttons{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.architecture-cta-buttons .btn-primary.outline{color:var(--text-primary);border:1px solid var(--border-strong);background:0 0}.architecture-cta-buttons .btn-primary.outline:hover{background:var(--text-primary);color:var(--text-on-dark)}@media(max-width:640px){.arch-nodes{grid-template-columns:1fr}.architecture-cta-buttons{flex-direction:column;align-items:center}}
