/* Idea Maker AI widgets: hero flow diagram + integration cards. All classes prefixed im-aiw- */
.im-aiw-flow,.im-aiw-cards-section{--im-navy:#0A0446;--im-teal:#1D97BE;--im-yellow:#FECD1C;--im-ink:#14122B;--im-ink-2:#52525A;--im-ink-3:#7A7A86;--im-line:#E3E5EE;--im-soft:#F4F6FA;--im-on-dark-2:#C9CBE6;--im-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;box-sizing:border-box}
.im-aiw-flow *,.im-aiw-cards-section *{box-sizing:border-box}
.im-aiw-flow ul,.im-aiw-cards-section ul{list-style:none;margin:0;padding:0}
.im-aiw-flow p,.im-aiw-cards-section p{margin:0}
.im-aiw-flow img,.im-aiw-cards-section img{display:block;max-width:100%;height:auto}

/* ---------- 1. Flow diagram (place on a dark background, e.g. the hero) ---------- */
.im-aiw-dark{background:linear-gradient(60deg,#0A0446 38%,#1D97BE 115%);padding:56px 20px}
.im-aiw-flow{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 96px auto 96px minmax(0,1fr);align-items:center;max-width:1120px;margin:0 auto;color:#fff}
.im-aiw-wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.im-aiw-track{fill:none;stroke:#fff;stroke-opacity:.28;stroke-width:2;stroke-linecap:round;stroke-dasharray:0 8}
.im-aiw-train{fill:none;stroke:var(--im-yellow);stroke-width:2.6;stroke-linecap:round;filter:drop-shadow(0 0 3px rgba(254,205,28,.95));animation:im-aiw-train var(--d,2s) cubic-bezier(.55,.05,.35,1) infinite;animation-delay:var(--dl,0s)}
@keyframes im-aiw-train{0%{stroke-dashoffset:var(--from)}62%,100%{stroke-dashoffset:var(--to)}}
.im-aiw-box,.im-aiw-hubwrap{position:relative;z-index:1}
.im-aiw-box{background:rgba(14,10,80,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:20px;align-self:stretch}
.im-aiw-bt{color:#fff;font-size:16px;font-weight:700;line-height:1.3}
.im-aiw-bs{color:var(--im-on-dark-2);font-size:12.5px;margin-top:2px!important}
.im-aiw-items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 8px;margin-top:16px!important}
.im-aiw-items li{display:grid;justify-items:center;gap:7px;text-align:center;font-size:11.5px;line-height:1.25;color:var(--im-on-dark-2)}
.im-aiw-ic{width:52px;height:52px;display:grid;place-items:center}
.im-aiw-ic img{width:40px;height:48px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.35))}
.im-aiw-ic--tile img{width:46px;height:46px;padding:10px;background:#fff;border-radius:12px}
.im-aiw-outs{display:grid;gap:10px;margin-top:16px!important}
.im-aiw-outs li{display:grid;grid-template-columns:20px 1fr;gap:10px;color:#fff;font-size:14px;line-height:1.4;font-weight:500}
.im-aiw-outs li::before{content:"";width:18px;height:18px;margin-top:1px;border-radius:50%;background:var(--im-yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='%230A0446' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.im-aiw-hubwrap{display:grid;justify-items:center;padding:8px}
.im-aiw-hub{width:236px;background:rgba(10,4,70,.94);border:1px solid rgba(254,205,28,.6);border-radius:18px;padding:22px 18px 20px;display:grid;justify-items:center;gap:9px;box-shadow:0 0 60px -12px rgba(29,151,190,.6);animation:im-aiw-glow 4s ease-in-out infinite}
@keyframes im-aiw-glow{50%{box-shadow:0 0 70px -6px rgba(254,205,28,.35)}}
.im-aiw-logo{width:132px}
.im-aiw-ey{font:500 10.5px/1 var(--im-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--im-yellow)}
.im-aiw-hr{width:100%;border-top:1px solid rgba(255,255,255,.14);margin:6px 0 2px}
.im-aiw-pw{font-size:11.5px;color:var(--im-on-dark-2)}
.im-aiw-models{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 8px;width:100%}
.im-aiw-models li{display:grid;justify-items:center;gap:6px;font-size:11px;color:#fff}
.im-aiw-aic{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16)}
.im-aiw-aic img{width:22px;height:22px}
@media (max-width:980px){
  .im-aiw-flow{grid-template-columns:1fr}
  .im-aiw-wires{display:none}
  .im-aiw-gap{height:36px;width:1px;justify-self:center;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(254,205,28,.8),rgba(255,255,255,0))}
}
@media (max-width:420px){.im-aiw-items{gap:12px 4px}.im-aiw-ic{width:44px;height:44px}.im-aiw-ic img{width:34px;height:41px}.im-aiw-ic--tile img{width:40px;height:40px;padding:8px}}

/* ---------- 2. Integration cards ---------- */
.im-aiw-cards-section{background:var(--im-soft);padding:72px 20px}
.im-aiw-head{max-width:1120px;margin:0 auto 36px;display:grid;gap:14px}
.im-aiw-eyebrow{font:500 12px/1 var(--im-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--im-teal)}
.im-aiw-head h2{margin:0;color:var(--im-ink);font-size:clamp(26px,3.4vw,36px);font-weight:700;line-height:1.2;letter-spacing:-.01em}
.im-aiw-head p{color:var(--im-ink-2);font-size:17px;max-width:640px}
.im-aiw-cards{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.im-aiw-card{background:#fff;border:1px solid var(--im-line);border-radius:14px;padding:20px;display:grid;grid-template-rows:auto auto 1fr auto auto;gap:12px;grid-row:span 5;min-width:0;transition:border-color .2s,transform .2s}
@supports (grid-template-rows:subgrid){.im-aiw-card{grid-template-rows:subgrid;row-gap:12px}.im-aiw-cards{row-gap:16px}}
.im-aiw-card:hover{border-color:var(--im-teal);transform:translateY(-2px)}
.im-aiw-pair{display:flex;align-items:center;gap:8px}
.im-aiw-pc{width:44px;height:44px;border-radius:12px;background:#fff;border:1px solid var(--im-line);display:grid;place-items:center;flex:none}
.im-aiw-pc img{width:24px;height:24px}
.im-aiw-plus{font:500 16px/1 var(--im-mono);color:var(--im-ink-3)}
.im-aiw-card h3{margin:0;color:var(--im-ink);font-size:17px;font-weight:700;line-height:1.25}
.im-aiw-card p{color:var(--im-ink-2);font-size:14px;line-height:1.55}
.im-aiw-built{display:grid;gap:7px;align-content:start;border-top:1px solid var(--im-line);padding-top:12px}
.im-aiw-bl{font:500 10.5px/1 var(--im-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--im-ink-3)}
.im-aiw-tags{display:flex;flex-wrap:wrap;gap:5px;align-content:flex-start;align-items:flex-start}
.im-aiw-tags li{font-size:11.5px;line-height:1;color:var(--im-ink-2);background:var(--im-soft);border:1px solid var(--im-line);border-radius:100px;padding:5px 8px}
.im-aiw-more{font-size:13px;font-weight:600;color:var(--im-teal);text-decoration:none;min-height:1em}
.im-aiw-more:hover{text-decoration:underline;color:var(--im-teal)}
@media (max-width:1100px){.im-aiw-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.im-aiw-cards{grid-template-columns:1fr}.im-aiw-card{grid-row:auto;grid-template-rows:none}}
.im-aiw-flow a:focus-visible,.im-aiw-cards-section a:focus-visible{outline:3px solid var(--im-yellow);outline-offset:2px;border-radius:4px}

@media (prefers-reduced-motion:reduce){.im-aiw-train{display:none}.im-aiw-hub{animation:none}.im-aiw-card{transition:none}}