/* homepage demos: AI agent lead flow + Site Health (2026-10-26). Scripts in /demos.js */
.aid{max-width:1180px;margin:0 auto;padding:90px 24px 100px}
.aid-head{text-align:center;max-width:760px;margin:0 auto}
.aid-head p{color:var(--fg-soft);font-size:18px;line-height:1.55;margin:16px auto 0}
/* step rail */
.aid-rail{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:40px auto 18px;max-width:980px;list-style:none;padding:0}
.aid-rail li{position:relative;padding:12px 10px 10px;border-radius:12px;background:var(--s1);border:1px solid var(--s1-line);cursor:pointer;transition:border-color .3s,background .3s}
.aid-rail li b{display:block;font:600 11px/1 'JetBrains Mono',monospace;letter-spacing:.12em;color:var(--fg-faint);margin-bottom:6px}
.aid-rail li span{font-size:14px;font-weight:600;color:var(--fg-soft)}
.aid-rail li i{position:absolute;left:10px;right:10px;bottom:6px;height:2px;border-radius:2px;background:#222;overflow:hidden}
.aid-rail li i:after{content:"";position:absolute;inset:0;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,#4ADE80,#E8A07A,#E86655)}
.aid-rail li.on{border-color:rgba(74,222,128,.45);background:#0f1a13}
.aid-rail li.on b{color:#4ADE80}.aid-rail li.on span{color:#fff}
.aid-rail li.done b{color:#8BE9B0}
/* frame */
.aid-frame{position:relative;border-radius:18px;padding:1px;background:linear-gradient(90deg,#4ADE80,#8BE9B0,#E8A07A,#E86655,#E8A07A,#8BE9B0,#4ADE80);background-size:200% 100%;animation:tkflow 9s linear infinite;box-shadow:0 40px 120px -30px rgba(74,222,128,.25),0 30px 90px -40px rgba(232,102,85,.3)}
.aid-in{position:relative;border-radius:17px;background:#0a0a0a;overflow:hidden;display:grid;grid-template-columns:360px 1fr;grid-template-rows:40px 1fr;height:700px}
.aid-bar{grid-column:1/-1;display:flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-bottom:1px solid #1d1d1d;background:#0d0d0d;font:500 12px 'JetBrains Mono',monospace;color:#6b6b6b}
.aid-bar i{width:10px;height:10px;border-radius:50%;background:#2a2a2a}
.aid-bar span{margin-left:10px}.aid-proj{font-style:normal}
/* console */
.aid-con{border-right:1px solid #1d1d1d;padding:16px;display:flex;flex-direction:column;gap:10px;font-size:14px;overflow:hidden}
.aid-msg{padding:10px 12px;border-radius:12px;line-height:1.45;max-width:100%}
.aid-msg.you{background:#16211a;border:1px solid #23412d;color:#e6f7ec;align-self:flex-end}
.aid-msg.you small,.aid-msg.bot small{display:block;font:600 10px 'JetBrains Mono',monospace;letter-spacing:.12em;margin-bottom:4px}
.aid-msg.you small{color:#4ADE80}
.aid-msg.bot{background:#1a1412;border:1px solid #3a2620;color:#f4e6e1}
.aid-msg.bot small{color:#E8A07A}
.aid-log{font:500 12.5px/1.75 'JetBrains Mono',monospace;color:#9aa3ad;padding:10px 12px;border-radius:12px;background:#0f0f0f;border:1px solid #1d1d1d}
.aid-log div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aid-log .k{color:#8BE9B0}.aid-log .ok{color:#4ADE80}
.caret{display:inline-block;width:7px;height:15px;background:#4ADE80;vertical-align:-2px;margin-left:2px;animation:aidblink 1s steps(1) infinite}
@keyframes aidblink{50%{opacity:0}}
/* board */
.aid-board{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:16px;align-content:start}
.aid-lane{background:#111;border:1px solid #1c1c1c;border-radius:12px;padding:10px;min-height:600px;display:flex;flex-direction:column;gap:8px}
.aid-lane h4{margin:0 0 4px;display:flex;align-items:center;gap:8px;font:600 12px Inter,sans-serif;color:#9aa3ad;text-transform:uppercase;letter-spacing:.08em}
.aid-lane h4 em{font-style:normal;width:8px;height:8px;border-radius:50%}
.aid-lane h4 u{text-decoration:none;margin-left:auto;color:#555;font-weight:500}
.aid-card{position:relative;background:#1a1a1a;border:1px solid #2a2a2a;border-radius:10px;padding:10px 10px 9px;font-size:13px;color:#e6e9ef;will-change:transform}
.aid-card .key{font:500 10.5px 'JetBrains Mono',monospace;color:#6b6b6b}
.aid-card .t{font-weight:600;margin:3px 0 7px;line-height:1.3}
.aid-card .row{display:flex;align-items:center;gap:6px;font-size:11.5px;color:#8a8a8a}
.aid-card .tag{font-size:10.5px;font-weight:600;padding:2px 6px;border-radius:5px}
.aid-card .av{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:9px;font-weight:700;color:#06140b;margin-left:auto}
.aid-card .av.ai{background:conic-gradient(from 0deg,#4ADE80,#E8A07A,#E86655,#4ADE80);color:#fff;font-size:10px}
.aid-card .sub{font:500 11px 'JetBrains Mono',monospace;color:#8a8a8a}
.aid-card.hot{border-color:rgba(74,222,128,.6);box-shadow:0 0 0 3px rgba(74,222,128,.12),0 10px 30px -10px rgba(74,222,128,.5)}
.aid-card.rev{border-color:rgba(232,160,122,.6);box-shadow:0 0 0 3px rgba(232,160,122,.12)}
.aid-card.fin{border-color:rgba(74,222,128,.35)}
.aid-note{margin-top:8px;padding:7px 8px;border-radius:8px;background:#121a15;border:1px solid #23412d;font-size:11.5px;line-height:1.4;color:#cfeedd}
.aid-note b{color:#E8A07A;font-weight:600}
.aid-appr{display:inline-flex;margin-top:8px;padding:4px 10px;border-radius:999px;background:#4ADE80;color:#06140b;font-size:11.5px;font-weight:700}
/* client portal pop */
.aid-cursor{position:absolute;width:22px;height:22px;pointer-events:none;z-index:5;opacity:0;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.aid-cta{text-align:center;margin-top:34px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.aid-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:980px;margin:28px auto 0}
.aid-facts div{padding:16px 18px;border-radius:14px;background:var(--s1);border:1px solid var(--s1-line);font-size:14.5px;color:var(--fg-soft);line-height:1.5}
.aid-facts b{display:block;color:#fff;font-size:15.5px;margin-bottom:4px}

.aid-msg.sys{background:#111823;border:1px solid #23324a;color:#dbe7f7}
.aid-msg.sys small{display:block;font:600 10px 'JetBrains Mono',monospace;letter-spacing:.12em;margin-bottom:4px;color:#93c5fd}
.aid-card .src{font-family:Inter,sans-serif;font-size:10px;font-weight:600;color:#93c5fd;background:#15202e;padding:1px 6px;border-radius:999px;margin-left:4px}
.aid-card.new{border-color:rgba(147,197,253,.5);box-shadow:0 0 0 3px rgba(147,197,253,.1)}
.aid-punch{position:absolute;left:50%;bottom:22px;transform:translate(-50%,0);padding:12px 20px;border-radius:999px;background:rgba(12,12,12,.94);border:1px solid #2a2a2a;font-size:16px;font-weight:600;color:#e6e9ef;white-space:nowrap;box-shadow:0 20px 60px -10px rgba(0,0,0,.9),0 0 40px -12px rgba(74,222,128,.45);opacity:0;pointer-events:none}
.aid-punch.on{opacity:1}

.sh-in{grid-template-columns:440px 1fr;height:590px}#site-health .aid-rail{grid-template-columns:repeat(5,1fr);max-width:860px}.sh-board .aid-lane{min-height:500px}
.sh-list{border-right:1px solid #1d1d1d;padding:16px;display:flex;flex-direction:column;gap:8px}
.sh-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:4px}.sh-h b{font-size:15px;color:#fff}.sh-h span{font-size:12px;color:#6b6b6b}
.sh-site{display:grid;grid-template-columns:12px 1fr 110px 54px;align-items:center;gap:12px;padding:12px;border-radius:12px;background:#111;border:1px solid #1d1d1d;transition:border-color .3s,background .3s}
.sh-site .dot,.sh-portal .dot{width:10px;height:10px;border-radius:50%;background:#4ADE80;box-shadow:0 0 0 4px rgba(74,222,128,.15)}
.sh-site .nm b{display:block;font-size:14px;color:#e6e9ef}.sh-site .nm small{font-size:12px;color:#8a8a8a}
.sh-site .spark{width:110px;height:30px}.sh-site polyline{fill:none;stroke:#4ADE80;stroke-width:1.6;stroke-linejoin:round;opacity:.8}
.sh-site .up{font:600 12px 'JetBrains Mono',monospace;color:#9aa3ad;text-align:right}
.sh-site.warn .dot{background:#E8A07A;box-shadow:0 0 0 4px rgba(232,160,122,.15)}.sh-site.warn .nm small{color:#E8A07A}
.sh-site.fail{border-color:rgba(232,160,122,.5)}.sh-site.fail .dot{background:#E8A07A}.sh-site.fail .nm small{color:#E8A07A}.sh-site.fail polyline{stroke:#E8A07A}
.sh-site.down{border-color:rgba(232,102,85,.7);background:#1a0f0e}.sh-site.down .dot{background:#E86655;box-shadow:0 0 0 4px rgba(232,102,85,.25)}.sh-site.down .nm small{color:#fca5a5}.sh-site.down polyline{stroke:#E86655}
.sh-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}.sh-chips span{font-size:11.5px;color:#9aa3ad;padding:4px 9px;border-radius:999px;background:#121212;border:1px solid #222}
.sh-board{grid-template-columns:repeat(2,1fr)}
.aid-card .src.sh{color:#fca5a5;background:#2a1412}
.aid-card.hot-red{border-color:rgba(232,102,85,.7);box-shadow:0 0 0 3px rgba(232,102,85,.14),0 10px 30px -10px rgba(232,102,85,.5)}
.sh-portal{position:absolute;right:22px;bottom:86px;width:320px;border-radius:14px;background:#f7f8f6;color:#111;padding:14px;box-shadow:0 30px 80px -20px rgba(0,0,0,.9);opacity:0;pointer-events:none}
.sh-portal.on{opacity:1}.sh-portal small{font:600 10px 'JetBrains Mono',monospace;letter-spacing:.12em;color:#6b7280}
.sh-portal .ps{display:flex;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;border-radius:10px;background:#fff;border:1px solid #e5e7eb;font-size:14px}
.sh-portal .dot{background:#E86655;box-shadow:0 0 0 4px rgba(232,102,85,.2)}.sh-portal.ok .dot{background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.2)}
.sh-portal p{margin:8px 2px 0;font-size:12px;color:#6b7280}
@media (max-width:860px){.sh-in{grid-template-columns:1fr}.sh-list{border-right:0;border-bottom:1px solid #1d1d1d}.sh-site{grid-template-columns:12px 1fr 70px 46px;gap:8px;padding:10px}.sh-site .spark{width:70px}
 .sh-board{grid-template-columns:1fr;min-height:0}.sh-board .aid-lane{min-height:0}#site-health .aid-rail{grid-template-columns:repeat(5,1fr)}.sh-in{height:auto}.sh-portal{left:12px;right:12px;width:auto;bottom:70px}.sh-chips span{font-size:11px}}
@media (max-width:860px){.aid-punch{white-space:normal;width:calc(100% - 24px);text-align:center;border-radius:16px;font-size:14px;bottom:12px}}
@media (max-width:860px){
 .aid{padding:60px 16px 70px}
 .aid-rail{grid-template-columns:repeat(6,1fr);gap:4px}
 .aid-rail{position:relative}
 .aid-rail li{position:static;padding:8px 4px 8px;text-align:center}
 .aid-rail li i{position:relative;display:block;left:auto;right:auto;bottom:auto;margin:6px 4px 0}
 .aid-card .row{flex-wrap:wrap;row-gap:4px}
 .aid-card .src{display:none}
 .aid-rail li span{display:none}
 .aid-rail li.on span{display:block;position:absolute;left:50%;top:calc(100% + 6px);transform:translateX(-50%);white-space:nowrap;font-size:13px}
 .aid-rail{margin-bottom:34px}
 .aid-in{grid-template-columns:1fr;grid-template-rows:auto;height:auto}
 .aid-con{border-right:0;border-bottom:1px solid #1d1d1d;height:236px;justify-content:flex-end}
 .aid-board{grid-template-columns:1fr;gap:8px;padding:12px;min-height:600px;align-content:start}
 .aid-proj{display:none}
 .aid-lane{min-height:0;flex-direction:row;flex-wrap:wrap;align-items:flex-start;padding:8px}
 .aid-lane h4{flex:0 0 100%;margin:0}
 .aid-lane .aid-card{flex:1 1 30%;min-width:0}
 .aid-card.extra{display:none}
 .aid-card .t{font-size:12.5px}
  .aid-facts{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.aid-frame{animation:none}}
@media (prefers-reduced-motion:reduce){.aid-card,.aid-msg,.aid-note{animation:none!important}}
@media (max-width:860px){#site-health .aid-board{min-height:300px}#site-health .sh-portal{bottom:16px}}
