/* Left copy, right mascot; compact service labels provide context. */
.home-page,.member-page,.relay-page{--entry-surface:var(--paper);--entry-asset-surface:transparent}
[data-theme="dark"] .home-page,[data-theme="dark"] .member-page,[data-theme="dark"] .relay-page{--entry-asset-surface:#fff}
.entry-hero-band{background:var(--entry-surface)}
.connected-hero{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:48px;min-height:420px;padding:44px 0;min-width:0}
.connected-copy{text-align:left;max-width:520px;min-width:0;margin:0}
.connected-copy>.eyebrow{justify-content:flex-start;font-size:9px;letter-spacing:1.6px;color:var(--body-text)}
.connected-copy .small-line{width:24px;background:var(--yellow)}
.connected-hero h1{font-size:clamp(36px,4.2vw,52px);font-weight:650;line-height:1.25;letter-spacing:-1.8px;white-space:normal;margin:21px 0 20px}
.connected-hero h1 span{color:var(--accent)}
.connected-hero h1 b,.connected-hero h1 .title-dot{color:var(--yellow);font-weight:650}
.connected-copy>h2{font-size:22px;font-weight:500;margin:0 0 16px;letter-spacing:-.4px;line-height:1.5}
.connected-copy>p{font-size:14px;line-height:1.95;color:var(--body-text);margin:0;max-width:490px}
.hero-entry-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-entry-actions>a{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:46px;padding:12px 18px;border:1px solid var(--ink);border-radius:3px;background:transparent;color:var(--ink);font-size:12px}
.hero-entry-actions>.entry-primary{background:var(--action-bg);border-color:var(--action-bg);color:#fff}
.hero-entry-actions>a:hover{border-color:var(--accent);color:var(--accent)}
.hero-entry-actions>.entry-primary:hover{background:#1c61c2;border-color:#1c61c2;color:#fff}
.hero-network{position:relative;isolation:isolate;min-width:0;width:100%;max-width:600px;height:360px;margin:0;justify-self:end}
.network-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;overflow:visible;visibility:hidden}
.hero-network[data-network-ready="true"] .network-lines{visibility:visible}
.network-connection{color:var(--accent-line);--flow-colour:var(--accent)}.connection-membership{color:#dba374;--flow-colour:var(--yellow)}
.network-connection path{fill:none;stroke:currentColor;stroke-width:1;vector-effect:non-scaling-stroke;transition:stroke .15s,stroke-width .15s}
.network-connection circle{fill:var(--entry-surface);stroke:currentColor;stroke-width:1;vector-effect:non-scaling-stroke}.network-connection .network-end{fill:currentColor}
.network-connection .network-flow-halo,.network-connection .network-flow{stroke:var(--flow-colour);stroke-linecap:round;stroke-dashoffset:14;animation:hero-line-flow .54s linear infinite;animation-delay:var(--flow-delay,0s);animation-play-state:paused;opacity:0}
.network-connection .network-flow-halo{stroke-width:5;stroke-dasharray:14 106}
.network-connection .network-flow{stroke-width:1.8;stroke-dasharray:7 113}
.hero-network[data-network-ready="true"][data-network-motion="playing"] .network-flow-halo{opacity:.24;animation-play-state:running}
.hero-network[data-network-ready="true"][data-network-motion="playing"] .network-flow{opacity:1;animation-play-state:running}
.hero-network[data-network-visible="false"] .network-flow-halo,.hero-network[data-network-visible="false"] .network-flow{animation-play-state:paused}
@keyframes hero-line-flow{from{stroke-dashoffset:14}to{stroke-dashoffset:-106}}
.hero-mascot{position:relative;isolation:isolate;min-width:0;width:52%;max-width:290px;aspect-ratio:1 / 1;height:auto;margin:0;padding:12px;display:flex;align-items:center;justify-content:center;overflow:visible;background:var(--entry-asset-surface);border-radius:8px}
.connected-mascot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.hero-mascot>img,.hero-mascot>picture[data-responsive]>img{display:block;position:static;width:100%;height:auto;max-width:100%;max-height:none;aspect-ratio:1 / 1;object-fit:contain;object-position:center;transform:none;clip-path:none}
.network-node{position:absolute;display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0;width:22.6667%;max-width:136px;height:50px;padding:7px 10px;background:var(--entry-surface);border:0;border-bottom:1px solid var(--line);border-radius:0;color:var(--ink);text-align:left;--node-accent:var(--accent)}
.node-membership{left:0;top:calc(15.5556% - 25px);--node-accent:var(--yellow)}
.node-relay{right:0;top:calc(15.5556% - 25px)}
.node-models{left:0;bottom:calc(15.5556% - 25px)}
.node-workspace{right:0;bottom:calc(15.5556% - 25px)}
.network-node strong{font-size:13px;font-weight:550;letter-spacing:0;line-height:1.4;margin:0;padding-right:10px}
.network-node small{font-size:9px;line-height:1.5;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.network-mini-arrow{position:absolute;right:9px;top:9px;font-size:11px;color:var(--node-accent)}
.network-node:hover,.network-node:focus-visible{border-color:var(--node-accent);color:var(--node-accent)}
.network-node:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.hero-network:has(.node-membership:is(:hover,:focus-visible)) .connection-membership,.hero-network:has(.node-relay:is(:hover,:focus-visible)) .connection-relay,.hero-network:has(.node-models:is(:hover,:focus-visible)) .connection-models,.hero-network:has(.node-workspace:is(:hover,:focus-visible)) .connection-workspace{color:var(--accent)}
.hero-network:has(.node-membership:is(:hover,:focus-visible)) .connection-membership .network-track,.hero-network:has(.node-relay:is(:hover,:focus-visible)) .connection-relay .network-track,.hero-network:has(.node-models:is(:hover,:focus-visible)) .connection-models .network-track,.hero-network:has(.node-workspace:is(:hover,:focus-visible)) .connection-workspace .network-track{stroke-width:1.5}
.hero-network:has(.node-membership:is(:hover,:focus-visible)) .connection-membership{color:var(--yellow)}






.member-page #plans{padding-top:20px}.relay-page .model-section{padding-top:24px}
@media(min-width:1600px){.connected-hero{gap:64px;padding:52px 0}}
@media(max-width:1100px){.connected-hero{gap:28px}.connected-copy>.eyebrow{font-size:8px;letter-spacing:1px}.connected-copy>p{font-size:13px}.hero-entry-actions{gap:10px}.hero-entry-actions>a{padding:12px 14px;gap:16px}.network-node{padding:7px}.network-node strong{font-size:12px}.network-node small{font-size:8px}.network-mini-arrow{right:5px;top:10px}}
@media(max-width:900px){.connected-hero{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:20px;padding:36px 0}.connected-hero h1{font-size:39px;letter-spacing:-1.4px}.connected-copy>h2{font-size:19px}.connected-copy>p{font-size:12px}.hero-entry-actions>a{font-size:11px;gap:12px;padding:11px 12px}.hero-network{height:330px}.network-node strong{font-size:11px}.network-node small{font-size:7.5px}.network-mini-arrow{font-size:10px}}
@media(max-width:760px){.connected-hero{grid-template-columns:minmax(0,1fr);gap:22px;min-height:0;padding:34px 0 24px}.connected-copy{max-width:560px}.connected-hero h1{font-size:42px;margin:18px 0}.connected-copy>p{font-size:13px}.hero-entry-actions{margin-top:23px}.hero-network{height:330px;max-width:500px;justify-self:center}.hero-mascot{width:56%;max-width:260px}.network-node{width:26%;max-width:130px}.network-node strong{font-size:12px}.network-node small{font-size:8px}}
@media(max-width:580px){.connected-hero h1{font-size:36px;letter-spacing:-1.3px}.connected-copy>.eyebrow{font-size:8px}.connected-copy>h2{font-size:19px}.connected-copy>p{font-size:12px}.hero-entry-actions>a{font-size:11px;padding:12px 14px;gap:18px}.hero-network{height:310px;max-width:440px}.hero-mascot{width:60%;max-width:250px}.network-node{width:29%;max-width:120px;height:46px;padding:6px 8px}.network-node strong{font-size:11px}.network-node small{font-size:8px}.network-mini-arrow{right:5px;top:8px}.member-page #plans{padding-top:16px}.relay-page .model-section{padding-top:16px}}
@media(max-width:360px){.connected-hero h1{font-size:33px}.hero-entry-actions{gap:8px}.hero-entry-actions>a{padding:11px 12px;gap:14px}.hero-network{height:290px}.network-node{width:30%;padding:6px}.network-node strong{font-size:10px}.network-node small{font-size:7px}.network-mini-arrow{right:3px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.network-connection path{transition:none}}

/* Actual connection ports are the single source of truth for path endpoints. */
.network-port,.mascot-port{position:absolute;display:block;width:6px;height:6px;opacity:0;pointer-events:none}
.network-port{top:calc(50% - 3px);color:var(--node-accent)}
.node-membership>.network-port,.node-models>.network-port{right:-3px}
.node-relay>.network-port,.node-workspace>.network-port{left:-3px}
.mascot-port{color:var(--accent)}.port-membership{color:var(--yellow)}
.port-membership,.port-models{left:-3px}.port-relay,.port-workspace{right:-3px}
.port-membership,.port-relay{top:calc(30% - 3px)}.port-models,.port-workspace{top:calc(70% - 3px)}
.network-motion-toggle{position:absolute;left:50%;bottom:0;transform:translateX(-50%);display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:0;border-radius:0;background:transparent;color:var(--muted);opacity:0}
.network-motion-toggle[hidden]{display:none}.hero-network:hover .network-motion-toggle,.network-motion-toggle:focus-visible{opacity:1}.network-motion-toggle:hover{color:var(--accent)}.network-motion-toggle:disabled{cursor:default}.network-motion-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.network-motion-icon{width:10px;font-size:9px;text-align:center}.network-motion-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:760px){.port-membership,.port-models{left:calc(25% - 3px);right:auto}.port-relay,.port-workspace{right:calc(25% - 3px);left:auto}.port-membership,.port-relay{top:-3px}.port-models,.port-workspace{top:auto;bottom:-3px}}
@media(prefers-reduced-motion:reduce){.network-connection .network-flow-halo,.network-connection .network-flow{animation:none!important;opacity:0!important}.network-motion-toggle{transition:none}}

/* Keep secondary entry pages close to their catalogue without stacked wrapper padding. */
.member-page .entry-hero-band>.page-shell,.relay-page .entry-hero-band>.page-shell{padding-bottom:0}
.member-page .connected-hero,.relay-page .connected-hero{min-height:0;padding-bottom:20px}
