/* Animated hero scan and rebuilt research-card visuals (Oct 2026).
   Rule: every element's base style is its finished, readable state. Animations only run while
   the hero scan has .is-live or a card has .card-in-view, and never while the page is paused
   (.sage-paused) or the visitor prefers reduced motion. */

:root{--scan-amber:#e0b36a;--scan-ice:#9ac4ff;--scan-ok:#8fd3b4;--scan-ease:cubic-bezier(.16,1,.3,1)}

/* ===================== Hero scan ===================== */
.sage-experience .hero-scan{position:relative;width:min(100%,1040px);border:1px solid #9cc2ff2e;border-radius:14px;
  background:linear-gradient(130deg,#132239e6,#070e1bf2 75%);box-shadow:0 40px 90px #000a,0 0 70px #5a96f514;
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);overflow:hidden;text-align:left}
.experience-ready .hero-scan{opacity:0;transform:translateY(22px);transition:opacity .9s,transform 1.1s var(--scan-ease)}
.experience-entered .hero-scan{opacity:1;transform:none;transition-delay:.58s}
.scan-top{display:flex;align-items:center;gap:16px;padding:14px 22px;border-bottom:1px solid #b7d1ff18;font:12px var(--mono);color:#a9c2e6}
.scan-brand{display:flex;align-items:center;gap:8px;color:#c4d8f5}
.scan-brand .sage-mark{width:12px;height:14px;color:var(--scan-ice)}
.scan-query{display:flex;align-items:center;gap:2px;margin-left:auto;padding:5px 10px;border:1px solid #9cc2ff26;border-radius:7px;background:#04081266;color:#e6efff}
.scan-typed{display:inline-block;overflow:hidden;white-space:nowrap;width:15ch}
.scan-caret{width:6px;height:13px;background:var(--scan-ice);opacity:0}
.scan-state{position:relative;min-width:96px;text-align:right}
.scan-state>span{display:inline-flex;align-items:center;gap:7px}
.scan-state>span:before{content:'';width:7px;height:7px;border-radius:50%;background:var(--scan-ok);box-shadow:0 0 10px var(--scan-ok)}
.state-run{position:absolute;right:0;opacity:0}
.state-run:before{background:var(--scan-amber)!important;box-shadow:0 0 10px var(--scan-amber)!important}

.scan-body{display:grid;grid-template-columns:210px minmax(0,1fr) minmax(0,1.05fr);grid-template-areas:'radar steps findings' 'radar verdict verdict';gap:18px 30px;padding:22px 26px 14px;align-items:start}
.scan-radar{grid-area:radar;position:relative;width:210px;aspect-ratio:1;align-self:center}
.radar-svg{width:100%;height:100%;overflow:visible}
.radar-svg .ring{fill:none;stroke:#9cc2ff1f;stroke-width:1}
.radar-svg .cross{stroke-dasharray:2 5}
.radar-dots circle{fill:#9cc2ff;opacity:.55}
.radar-dots circle.top{fill:#e6f0ff;opacity:1;filter:drop-shadow(0 0 5px #9ac4ffcc)}
.sweep{transform-origin:120px 120px;opacity:0}
.sweep-edge{stroke:#cfe2ff;stroke-width:1.2;opacity:.8}
.radar-center{position:absolute;inset:0;display:grid;place-content:center;text-align:center;pointer-events:none}
.radar-center b{font-size:34px;font-weight:600;letter-spacing:-.04em;line-height:1;color:#f1f6ff;font-variant-numeric:tabular-nums}
.radar-center small{display:block;margin-top:4px;font:12px var(--mono);color:#8fa8cc}

.scan-steps{grid-area:steps;list-style:none;margin:0;padding:0;display:grid;gap:10px}
.scan-steps li{display:flex;align-items:center;gap:10px;font-size:14px;color:#c5d4ea}
.scan-steps i{position:relative;width:16px;height:16px;flex:none;border-radius:50%;border:1.5px solid var(--scan-ok);background:var(--scan-ok)}
.scan-steps i:after{content:'';position:absolute;left:4.5px;top:1.5px;width:4px;height:8px;border:solid #06101c;border-width:0 2px 2px 0;transform:rotate(45deg)}

.scan-findings{grid-area:findings;display:grid;gap:8px}
.finding{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:9px 12px;border:1px solid #9cc2ff1f;border-radius:9px;background:#0a142580}
.finding span{font-size:13px;color:#9fb2cf}
.finding b{font-size:18px;font-weight:600;letter-spacing:-.02em;color:#f1f6ff;font-variant-numeric:tabular-nums}
.finding em{font:12px var(--mono);font-style:normal;padding:3px 8px;border-radius:999px;color:var(--scan-ice);background:#9ac4ff1a}
.finding em.ok{color:var(--scan-ok);background:#8fd3b41a}
.finding.warn em{color:var(--scan-amber);background:#e0b36a1f}

.scan-verdict{grid-area:verdict;display:flex;align-items:center;gap:14px;padding-top:12px;border-top:1px solid #b7d1ff14}
.scan-verdict .caution{font:12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--scan-amber);border:1px solid #e0b36a55;border-radius:6px;padding:4px 9px}
.scan-verdict p{margin:0;font-size:22px;letter-spacing:-.03em;color:#eef4ff}
.scan-verdict strong{font-weight:500;color:#a9c3ea}
.scan-note{margin:0;padding:0 26px 16px 262px;font-size:12px;color:#7d91b0}

/* --- the loop: classes added by sage-scan.js --- */
.hero-scan.is-live .scan-typed{width:0;animation:scan-type .9s steps(15) .15s forwards}
.hero-scan.is-live .scan-caret{animation:scan-blink .8s steps(1) 4}
.hero-scan.is-live .state-run{opacity:1}
.hero-scan.is-live .state-done{opacity:0}
.hero-scan.is-live.has-verdict .state-run{opacity:0}
.hero-scan.is-live.has-verdict .state-done{opacity:1;transition:opacity .4s}
.hero-scan.is-live .sweep{opacity:1;animation:scan-sweep 2.4s linear 1s 2}
.hero-scan.is-live.has-verdict .sweep{opacity:0;transition:opacity .6s}
.hero-scan.is-live .radar-dots circle{opacity:.12;transition:opacity .35s,fill .35s}
.hero-scan.is-live .radar-dots circle.lit{opacity:.6}
.hero-scan.is-live .radar-dots circle.top{fill:#9cc2ff;filter:none}
.hero-scan.is-live.has-verdict .radar-dots circle.top{fill:#e6f0ff;opacity:1;filter:drop-shadow(0 0 5px #9ac4ffcc)}
.hero-scan.is-live .radar-center{opacity:0;transform:scale(.9);transition:opacity .5s,transform .6s var(--scan-ease)}
.hero-scan.is-live.has-findings .radar-center{opacity:1;transform:none}
.hero-scan.is-live .scan-steps li{opacity:0;transform:translateX(-8px);transition:opacity .35s,transform .45s var(--scan-ease),color .3s;transition-delay:calc(1s + var(--i)*.55s),calc(1s + var(--i)*.55s),0s;color:#7d91b0}
.hero-scan.is-live.is-scanning .scan-steps li{opacity:1;transform:none}
.hero-scan.is-live .scan-steps i{background:transparent;border-color:#9cc2ff44;border-right-color:var(--scan-ice);animation:scan-spin .7s linear infinite}
.hero-scan.is-live .scan-steps i:after{opacity:0}
.hero-scan.is-live .scan-steps li.done{color:#c5d4ea}
.hero-scan.is-live .scan-steps li.done i{background:var(--scan-ok);border-color:var(--scan-ok);animation:none}
.hero-scan.is-live .scan-steps li.done i:after{opacity:1;transition:opacity .2s}
.hero-scan.is-live .finding{opacity:0;transform:translateY(10px);transition:opacity .45s,transform .55s var(--scan-ease);transition-delay:calc(var(--i)*.18s)}
.hero-scan.is-live.has-findings .finding{opacity:1;transform:none}
.hero-scan.is-live .scan-verdict{opacity:0;transform:translateY(8px);transition:opacity .5s,transform .6s var(--scan-ease)}
.hero-scan.is-live.has-verdict .scan-verdict{opacity:1;transform:none}
.hero-scan.is-live.is-fading .scan-body,.hero-scan.is-live.is-fading .scan-query{opacity:.0;transition:opacity .45s}
@keyframes scan-type{to{width:15ch}}
@keyframes scan-blink{0%,100%{opacity:1}50%{opacity:0}}
@keyframes scan-sweep{to{transform:rotate(360deg)}}
@keyframes scan-spin{to{transform:rotate(360deg)}}

@media(max-width:959px){
  .scan-body{grid-template-columns:170px minmax(0,1fr);grid-template-areas:'radar steps' 'findings findings' 'verdict verdict'}
  .scan-radar{width:170px}
  .scan-note{padding-left:26px}
}
@media(max-width:699px){
  .scan-top{flex-wrap:wrap;gap:10px;padding:12px 16px}
  .scan-query{margin-left:0;order:3;flex:1 1 100%;justify-content:flex-start}
  .scan-state{margin-left:auto}
  .scan-body{grid-template-columns:1fr;grid-template-areas:'radar' 'steps' 'findings' 'verdict';padding:18px 16px 12px;gap:16px}
  .scan-radar{width:min(190px,62vw);justify-self:center}
  .scan-verdict{flex-wrap:wrap;gap:10px}
  .scan-verdict p{font-size:19px}
  .finding b{font-size:16px}
  .scan-note{padding:0 16px 14px}
}

/* ===================== Research cards ===================== */
.research-card.rc{padding:0}
.rc-visual{position:relative;height:230px;display:grid;place-items:center;border-bottom:1px solid #abcfff1c;overflow:hidden;
  background:radial-gradient(ellipse at 50% 120%,#1f4a8a40,transparent 60%),radial-gradient(ellipse at 80% 0%,#5a96f51a,transparent 55%)}
.research-card.rc .card-copy{padding:20px 22px 22px}
.research-card.rc .rc-index{display:block;margin-bottom:8px;font:12px var(--mono);letter-spacing:.04em;color:#7f9cc4}
.research-card.rc h3{min-height:0;margin-top:0}

/* 1. Fundamentals: gauge + chips */
.rc-fund{grid-template-rows:auto auto}
.rc-fund .gauge{width:210px;height:auto;overflow:visible;margin-top:8px}
.rc-fund .g-track{fill:none;stroke:#9cc2ff1f;stroke-width:12;stroke-linecap:round}
.rc-fund .g-fill{fill:none;stroke:var(--scan-ice);stroke-width:12;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:29;filter:drop-shadow(0 0 8px #9ac4ff66)}
.rc-fund .g-num{position:absolute;top:96px;left:0;right:0;text-align:center}
.rc-fund .g-num b{font-size:40px;font-weight:600;letter-spacing:-.05em;color:#f1f6ff;font-variant-numeric:tabular-nums}
.rc-fund .g-num small{font-size:15px;color:#8fa8cc;margin-left:2px}
.rc-fund .g-num span{display:block;font:12px var(--mono);color:#8fa8cc;margin-top:2px}
.rc-chips{display:flex;gap:8px;margin-top:-6px}
.chip{font-size:12px;padding:5px 10px;border-radius:999px;border:1px solid #9cc2ff33;white-space:nowrap}
.chip.on{color:#e6f0ff;background:#9ac4ff1f;border-color:#9ac4ff66}
.chip.on:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--scan-ok);margin-right:7px;vertical-align:1px;box-shadow:0 0 8px var(--scan-ok)}
.chip.off{color:#7d91b0;border-style:dashed}

/* 2. Ownership: wallet bars */
.rc-own{grid-template-columns:1fr auto;gap:20px;padding:26px 24px 22px;place-items:end stretch}
.rc-own .bars{display:flex;align-items:flex-end;gap:6px;height:150px}
.rc-own .bars i{position:relative;flex:1;height:var(--h);border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#b9d6ff,#5a96f5);box-shadow:0 0 12px #5a96f533;transform-origin:bottom}
.rc-own .bars i.x{background:#9cc2ff14;border:1px dashed #9cc2ff40;box-shadow:none}
.rc-own .bars i.x em{position:absolute;bottom:calc(100% + 6px);left:50%;translate:-50% 0;font:11px var(--mono);font-style:normal;color:#7d91b0;white-space:nowrap;writing-mode:vertical-rl;rotate:180deg}
.rc-own .own-total{text-align:right;padding-bottom:2px}
.rc-own .own-total b{font-size:48px;font-weight:600;letter-spacing:-.05em;line-height:1;color:#f1f6ff;font-variant-numeric:tabular-nums}
.rc-own .own-total small{font-size:20px;color:#a9c3ea}
.rc-own .own-total span{display:block;font:12px var(--mono);color:#8fa8cc;margin-top:6px;white-space:nowrap}

/* 3. Security: shield + rows */
.rc-sec{grid-template-columns:auto 1fr;gap:20px;padding:22px 24px;place-items:center stretch}
.shield-wrap{position:relative;width:76px;height:92px;overflow:hidden}
.shield{width:100%;height:100%;overflow:visible}
.sh-fill{fill:#9ac4ff12}
.sh-line{fill:none;stroke:var(--scan-ice);stroke-width:2.2;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:0;filter:drop-shadow(0 0 6px #9ac4ff88)}
.sh-scan{position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#d8e8ff,transparent);opacity:0}
.sec-rows{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.sec-rows li{display:grid;grid-template-columns:1fr auto 18px;align-items:center;gap:10px;padding:8px 10px;border:1px solid #9cc2ff1a;border-radius:8px;background:#0a142570;font-size:13px}
.sec-rows li span{color:#9fb2cf}
.sec-rows li b{font-weight:500;color:#e6f0ff}
.sec-rows .tick{position:relative;width:16px;height:16px;border-radius:50%;background:var(--scan-ok)}
.sec-rows .tick:after{content:'';position:absolute;left:5px;top:2px;width:4px;height:8px;border:solid #06101c;border-width:0 2px 2px 0;transform:rotate(45deg)}
.sec-rows li.warn{border-color:#e0b36a40}
.sec-rows li.warn b{color:var(--scan-amber)}
.sec-rows .lock{width:16px;height:18px;fill:none;stroke:var(--scan-amber);stroke-width:2;overflow:visible}
.sec-rows .lock rect{fill:#e0b36a22}
.sec-rows .lock .shackle{transform-origin:15px 10px;transform:translateY(-3px) rotate(28deg)}

/* 4. Thesis: balance scale */
.rc-thesis{padding:18px 18px 10px}
.scale{position:relative;width:100%;max-width:300px;height:190px}
.scale .post{position:absolute;left:50%;bottom:0;width:3px;height:118px;translate:-50% 0;background:linear-gradient(#9cc2ff66,#9cc2ff1a);border-radius:2px}
.scale .pivot{position:absolute;left:50%;top:66px;width:12px;height:12px;translate:-50% -50%;border-radius:50%;background:var(--scan-ice);box-shadow:0 0 12px #9ac4ffaa;z-index:2}
.scale .beam{--tilt:4deg;position:absolute;left:4%;right:4%;top:65px;height:3px;border-radius:2px;background:#9cc2ffaa;transform:rotate(var(--tilt))}
.scale .pan{position:absolute;top:0;width:42%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;transform-origin:50% 0;transform:rotate(calc(var(--tilt)*-1));padding-top:0}
.scale .pan-for{left:-6%}
.scale .pan-against{right:-6%}
.scale .pan:before{content:'';position:absolute;top:0;left:50%;width:1px;height:38px;background:#9cc2ff55}
.scale .pan{height:118px;margin-top:0}
.scale .tray{display:block;width:100%;height:4px;border-radius:0 0 8px 8px;border:1px solid #9cc2ff77;border-top:0;order:2}
.scale .pan small{order:3;font:11px var(--mono);letter-spacing:.05em;text-transform:uppercase;color:#7d91b0}
.scale .weight{order:1;font-size:12px;line-height:1.3;text-align:center;padding:5px 8px;border-radius:7px;white-space:nowrap}
.scale .pan-for .weight{color:#e6f0ff;background:#9ac4ff26;border:1px solid #9ac4ff55}
.scale .pan-against .weight{color:#f3dcb4;background:#e0b36a1f;border:1px solid #e0b36a55}

/* --- card animations: only while the card is on screen (class from sage-experience.js) --- */
.research-card.rc.card-in-view .g-fill{animation:rc-gauge 1.6s var(--scan-ease) .25s backwards}
.research-card.rc.card-in-view .chip{animation:rc-pop .5s var(--scan-ease) backwards;animation-delay:calc(1.2s + var(--i)*.25s)}
.research-card.rc.card-in-view .bars i{animation:rc-grow .9s var(--scan-ease) backwards;animation-delay:calc(.15s + var(--i)*.07s)}
.research-card.rc.card-in-view .bars i.x{animation:rc-grow .9s var(--scan-ease) backwards,rc-exclude .6s ease 1.5s backwards;animation-delay:calc(.15s + var(--i)*.07s),1.5s}
.research-card.rc.card-in-view .sh-line{animation:rc-draw 1.4s ease .2s backwards}
.research-card.rc.card-in-view .sh-scan{animation:rc-scan 2.6s ease-in-out 1.4s infinite}
.research-card.rc.card-in-view .sec-rows li{animation:rc-slide .5s var(--scan-ease) backwards;animation-delay:calc(.5s + var(--i)*.35s)}
.research-card.rc.card-in-view .sec-rows .tick{animation:rc-pop .4s var(--scan-ease) backwards;animation-delay:calc(.8s + var(--i)*.35s)}
.research-card.rc.card-in-view .sec-rows .lock .shackle{animation:rc-unlock .7s var(--scan-ease) 1.7s backwards}
.research-card.rc.card-in-view .scale .beam{animation:rc-tilt 3.2s var(--scan-ease) .3s backwards}
.research-card.rc.card-in-view .scale .pan{animation:rc-counter 3.2s var(--scan-ease) .3s backwards}
.research-card.rc.card-in-view .scale .weight{animation:rc-drop .6s cubic-bezier(.3,1.4,.5,1) backwards;animation-delay:calc(.4s + var(--i)*.75s)}
@keyframes rc-gauge{from{stroke-dashoffset:100}}
@keyframes rc-pop{from{opacity:0;transform:scale(.6)}}
@keyframes rc-grow{from{transform:scaleY(0)}}
@keyframes rc-exclude{from{background:linear-gradient(180deg,#b9d6ff,#5a96f5);border-color:transparent}}
@keyframes rc-draw{from{stroke-dashoffset:100}}
@keyframes rc-scan{0%{top:0;opacity:0}15%{opacity:.9}85%{opacity:.9}100%{top:92px;opacity:0}}
@keyframes rc-slide{from{opacity:0;transform:translateX(12px)}}
@keyframes rc-unlock{from{transform:none}}
@keyframes rc-drop{from{opacity:0;transform:translateY(-34px)}}
/* beam: level, tips toward "for" when its weight lands, then toward "against" and settles */
@keyframes rc-tilt{0%{transform:rotate(0)}20%{transform:rotate(0)}32%{transform:rotate(-7deg)}55%{transform:rotate(-5deg)}68%{transform:rotate(3deg)}80%{transform:rotate(7deg)}100%{transform:rotate(var(--tilt))}}
@keyframes rc-counter{0%{transform:rotate(0)}20%{transform:rotate(0)}32%{transform:rotate(7deg)}55%{transform:rotate(5deg)}68%{transform:rotate(-3deg)}80%{transform:rotate(-7deg)}100%{transform:rotate(calc(var(--tilt)*-1))}}

@media(max-width:699px){
  .rc-visual{height:210px}
  .rc-own .bars{height:130px}
  .rc-own .own-total b{font-size:40px}
}

/* paused or reduced motion: everything rests in its finished state */
.sage-paused .hero-scan *,.sage-paused .rc-visual *{animation:none!important}
.sage-paused .hero-scan{opacity:1!important;transform:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){
  .hero-scan *,.rc-visual *{animation:none!important;transition:none!important}
  .experience-ready .hero-scan{opacity:1;transform:none}
}