.invest-graph { position:relative; height:640px; border:1px solid #dbe7f0; border-radius:24px; background:#edf7fc; }
.invest-graph-center { position:absolute; top:52.5%; left:50%; transform:translate(-50%,-50%); width:230px; height:230px; border:5px solid #123d62; border-radius:50%; background:white; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; box-shadow:0 12px 40px #123d6214; }
.invest-graph-center img { width:160px; }
.invest-graph-center span { font-size:10px; letter-spacing:1.5px; color:#62788e; }
.invest-node { position:absolute; left:var(--x); top:var(--y); transform:translate(-50%,-50%); z-index:2; }
.invest-node-button { position:relative; display:flex; align-items:center; justify-content:center; border:0; background:none; cursor:pointer; color:#123d62; padding:0; }
.invest-node-icon { display:flex; align-items:center; justify-content:center; width:98px; height:98px; border-radius:50%; color:white; background:#159bc1; box-shadow:0 8px 20px #12629a20; transition:transform .2s,box-shadow .2s; }
.invest-node.right .invest-node-icon { background:#0866aa; }
.invest-node-icon svg { width:40px; height:40px; }
.invest-node-summary, .invest-node-more { display:none; }
.invest-node-label { position:absolute; width:210px; font-size:16px; font-weight:600; line-height:1.6; }
.invest-node.left .invest-node-label { right:calc(100% + 24px); text-align:right; }
.invest-node.right .invest-node-label { left:calc(100% + 24px); text-align:left; }
.invest-node-button:hover .invest-node-icon,.invest-node-button[aria-expanded="true"] .invest-node-icon { transform:scale(1.08); box-shadow:0 10px 24px #12629a40; }
.invest-node-button:focus-visible { outline:3px solid #6d28d9; outline-offset:7px; border-radius:50%; }
.invest-node:has(.invest-tooltip:not([hidden])) { z-index:10; }
.invest-tooltip { position:fixed; z-index:60; max-height:calc(100vh - 24px); overflow-y:auto; width:300px; max-width:calc(100vw - 24px); padding:20px; border:1px solid #dbe7f0; border-radius:16px; background:white; color:#20354a; box-shadow:0 16px 48px #123d6230; text-align:left; font-size:14px; line-height:1.7; }
.invest-tooltip[hidden] { display:none; }
.invest-tooltip strong { display:block; color:#0866aa; font-size:16px; margin-bottom:8px; }
.invest-tooltip p { margin:0; }
a.invest-node-button { text-decoration:none; }
.invest-tooltip-more { display:inline-block; margin-top:10px; color:#D0161D; font-weight:600; text-decoration:none; }
.invest-tooltip-more:hover { text-decoration:underline; }
@media (max-width:1100px) and (min-width:761px) { .invest-node-label { width:150px; font-size:14px; } .invest-node.left .invest-node-label { right:calc(100% + 12px); } .invest-node.right .invest-node-label { left:calc(100% + 12px); } .invest-node-icon { width:80px;height:80px; } .invest-graph-center { width:190px;height:190px; } }
@media (max-width:760px) { .invest-graph { height:auto; padding:20px 14px; display:grid; grid-template-columns:minmax(0,1fr); gap:12px; } .invest-graph-center { position:static; transform:none; margin:0 auto 8px; width:150px; height:150px; border-width:3px; gap:10px; } .invest-graph-center img { width:108px; } .invest-graph-center span { font-size:7px; } .invest-node { position:relative; left:auto; top:auto; transform:none; } .invest-node-button { width:100%; flex-direction:row; align-items:flex-start; justify-content:flex-start; gap:14px; padding:14px; border:1px solid #dbe7f0; border-radius:16px; background:white; text-align:left; } .invest-node-icon { flex:0 0 auto; width:52px; height:52px; } .invest-node-icon svg { width:26px; height:26px; } .invest-node-text { display:flex; flex-direction:column; gap:4px; min-width:0; } .invest-node.left .invest-node-label, .invest-node.right .invest-node-label { position:static; width:auto; font-size:15px; line-height:1.5; text-align:left; } .invest-node-summary { display:block; font-size:13px; font-weight:400; line-height:1.6; color:#4a6075; } .invest-node-more { display:inline-block; margin-top:2px; font-size:13px; font-weight:600; color:#D0161D; } .invest-node-button:hover .invest-node-icon, .invest-node-button[aria-expanded="true"] .invest-node-icon { transform:none; } .invest-node-button:focus-visible { border-radius:16px; } body > .invest-tooltip { display:none !important; } }
@media (prefers-reduced-motion:reduce) { .invest-node-icon { transition:none; } }
