.coder-module__SjcNOq__howItWorks{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;display:grid}.coder-module__SjcNOq__howList{flex-direction:column;gap:.6rem;list-style:none;display:flex}.coder-module__SjcNOq__howList li{color:var(--muted);gap:.6rem;font-size:.875rem;display:flex}.coder-module__SjcNOq__demoWindow{background:var(--bg2);border:1px solid var(--border);border-radius:12px;overflow:hidden}.coder-module__SjcNOq__capGrid{grid-template-columns:repeat(3,1fr);gap:1.25rem;display:grid}@media (max-width:900px){.coder-module__SjcNOq__howItWorks{grid-template-columns:1fr}.coder-module__SjcNOq__capGrid{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.coder-module__SjcNOq__capGrid{grid-template-columns:1fr}}.coder-module__SjcNOq__flowDiagram{box-sizing:border-box;justify-content:space-between;align-items:stretch;gap:.5rem;width:100%;min-height:280px;padding:2rem 1.25rem;display:flex}.coder-module__SjcNOq__flowNode{border:1px solid var(--border);background:var(--bg3);opacity:.45;text-align:center;border-radius:8px;flex-direction:column;flex:1;justify-content:flex-start;align-items:center;gap:.75rem;min-width:0;padding:1rem .5rem;transition:opacity .4s,border-color .4s,box-shadow .4s;display:flex}.coder-module__SjcNOq__flowIcon{width:48px;height:48px;color:var(--muted);justify-content:center;align-items:center;transition:color .4s;display:flex}.coder-module__SjcNOq__flowIcon svg{width:100%;height:100%}.coder-module__SjcNOq__flowLabel{font-family:var(--font-display,system-ui), sans-serif;color:var(--text);letter-spacing:.01em;word-break:keep-all;padding:0 .25rem;font-size:.85rem;font-weight:500;line-height:1.25}.coder-module__SjcNOq__flowBadge{font-family:var(--font-mono,ui-monospace), monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border:1px solid var(--border);border-radius:4px;margin-top:.15rem;padding:.2rem .5rem;font-size:.6rem;display:inline-block}.coder-module__SjcNOq__toolCircles{flex-direction:row;justify-content:center;align-items:center;gap:.4rem;display:flex}.coder-module__SjcNOq__toolCircle{width:28px;height:28px;font-family:var(--font-display,system-ui), sans-serif;border:1px solid var(--border);background:var(--bg2);color:var(--text);border-radius:50%;justify-content:center;align-items:center;font-size:.85rem;font-weight:600;line-height:1;display:inline-flex}.coder-module__SjcNOq__flowNodeTools .coder-module__SjcNOq__flowIcon{width:auto;height:48px}.coder-module__SjcNOq__flowNodeWorkspace{opacity:.32}.coder-module__SjcNOq__flowArrow{width:32px;color:var(--muted);opacity:.35;flex-shrink:0;justify-content:center;align-items:center;transition:opacity .4s,color .4s;display:flex}.coder-module__SjcNOq__flowArrow svg{width:100%;height:auto}@media (prefers-reduced-motion:no-preference){.coder-module__SjcNOq__flowNodeIdea{animation:3s ease-in-out infinite coder-module__SjcNOq__nodeGlowBlue}.coder-module__SjcNOq__flowArrow1{animation:3s ease-in-out .5s infinite coder-module__SjcNOq__arrowGlowBlue}.coder-module__SjcNOq__flowNodeStudio{animation:3s ease-in-out .75s infinite coder-module__SjcNOq__nodeGlowGreen}.coder-module__SjcNOq__flowArrow2{animation:3s ease-in-out 1.25s infinite coder-module__SjcNOq__arrowGlowBlue}.coder-module__SjcNOq__flowNodeTools{animation:3s ease-in-out 1.5s infinite coder-module__SjcNOq__nodeGlowBlue}.coder-module__SjcNOq__flowArrow3{animation:3s ease-in-out 2s infinite coder-module__SjcNOq__arrowGlowSubtle}}@keyframes coder-module__SjcNOq__nodeGlowBlue{0%,to{opacity:.45;border-color:var(--border);box-shadow:none}20%,30%{opacity:1;border-color:var(--accent2);box-shadow:0 0 12px #0088ff38}60%{opacity:.55;border-color:var(--border);box-shadow:none}}@keyframes coder-module__SjcNOq__nodeGlowGreen{0%,to{opacity:.55;border-color:var(--border);box-shadow:none}20%,30%{opacity:1;border-color:var(--accent);box-shadow:0 0 14px #00ff8847}60%{opacity:.7;border-color:var(--border);box-shadow:none}}@keyframes coder-module__SjcNOq__arrowGlowBlue{0%,to{opacity:.3;color:var(--muted)}30%,40%{opacity:1;color:var(--accent2)}70%{opacity:.3;color:var(--muted)}}@keyframes coder-module__SjcNOq__arrowGlowSubtle{0%,to{opacity:.2;color:var(--muted)}30%,40%{opacity:.5;color:var(--muted)}70%{opacity:.2;color:var(--muted)}}@media (max-width:640px){.coder-module__SjcNOq__flowDiagram{flex-direction:column;gap:.5rem;min-height:0;padding:1.5rem 1rem}.coder-module__SjcNOq__flowArrow{align-self:center;width:28px;height:28px}.coder-module__SjcNOq__flowArrow svg{width:100%;height:100%;transform:rotate(90deg)}.coder-module__SjcNOq__flowNode{width:100%}}
