:root {
  --bg: #020914;
  --bg-soft: #071321;
  --surface: rgba(16, 33, 50, 0.58);
  --surface-strong: rgba(20, 42, 63, 0.78);
  --line: rgba(193, 219, 241, 0.22);
  --line-bright: rgba(215, 235, 250, 0.48);
  --text: #f2f7fb;
  --muted: #8fa3b5;
  --accent: #ff871f;
  --accent-soft: #ffad63;
  --max: 1240px;
  --radius: 24px;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255,255,255,.1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body {
  margin: 0;
  color: var(--text);
  background: var(--bg);
  font-family: "SF Pro Display", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
.page-noise {
  position: fixed; inset: 0; pointer-events: none; opacity: .055; z-index: 99;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}

.site-header {
  height: 78px; padding: 0 max(28px, calc((100vw - var(--max)) / 2));
  display: grid; grid-template-columns: 220px 1fr 90px; align-items: center;
  position: absolute; top: 0; left: 0; right: 0; z-index: 20;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.brand { display: flex; align-items: center; gap: 11px; font-size: 20px; font-weight: 650; letter-spacing: -.03em; }
.brand i { width: 1px; height: 16px; background: rgba(255,255,255,.38); }
.brand strong { color: var(--accent); font-weight: 650; letter-spacing: .02em; }
.main-nav { justify-self: center; display: flex; height: 100%; align-items: center; gap: 34px; }
.main-nav a { height: 100%; display: flex; align-items: center; position: relative; font-size: 13px; color: #aab8c4; transition: color .25s; }
.main-nav a:hover, .main-nav a.active { color: #fff; }
.main-nav a.active::after { content: ""; position: absolute; height: 2px; left: 6px; right: 6px; bottom: 0; background: var(--accent); }
.login-button { justify-self: end; width: 76px; height: 36px; border-radius: 99px; border: 1px solid rgba(255,135,31,.8); background: rgba(255,135,31,.04); color: var(--accent-soft); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.menu-toggle { display: none; }

.hero { min-height: 760px; height: min(880px, 100vh); position: relative; overflow: hidden; padding: 78px max(28px, calc((100vw - var(--max)) / 2)) 56px; display: flex; align-items: center; background: radial-gradient(circle at 78% 58%, #0d2136 0, #040d18 46%, #020914 75%); }
.hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; background: linear-gradient(transparent, var(--bg)); }
.hero-visual { position: absolute; inset: 0; left: 24%; overflow: hidden; }
.hero-visual::before { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, var(--bg) 0%, rgba(2,9,20,.76) 9%, transparent 37%, transparent 84%, var(--bg) 100%); }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: .9; filter: saturate(.8) contrast(1.06); animation: reveal 1.2s cubic-bezier(.2,.75,.2,1) both; }
.hero-copy { position: relative; z-index: 4; width: 680px; margin-top: 0; }
.hero h1 { margin: 0; font-size: clamp(44px, 4.2vw, 66px); line-height: 1.18; letter-spacing: -.055em; font-weight: 600; }
.hero h1 span, h2 span { color: var(--accent); }
.hero-description { max-width: 540px; color: #a0b1c0; font-size: 17px; line-height: 1.9; margin: 30px 0 0; }
.hero-actions { display: flex; gap: 14px; margin-top: 40px; }
.button { height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 20px; padding: 0 24px; border-radius: 8px; border: 1px solid transparent; font-size: 14px; cursor: pointer; transition: transform .25s, background .25s, border-color .25s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--accent); color: #111; font-weight: 650; box-shadow: 0 12px 36px rgba(255,135,31,.2); }
.button-primary:hover { background: #ff9a42; }
.button-quiet { border-color: rgba(205,227,244,.34); background: rgba(10,25,40,.48); backdrop-filter: blur(15px); }
.play { font-size: 9px; width: 20px; height: 20px; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; display: grid; place-items: center; }
.hero-foot { position: absolute; z-index: 5; bottom: 34px; left: max(28px, calc((100vw - var(--max)) / 2)); display: flex; align-items: center; gap: 16px; color: #647b8e; font-size: 11px; letter-spacing: .12em; }
.hero-foot i { width: 26px; height: 1px; background: #2a3e51; }

section:not(.hero) { padding-left: max(28px, calc((100vw - var(--max)) / 2)); padding-right: max(28px, calc((100vw - var(--max)) / 2)); }
.agents-section { padding-top: 130px; padding-bottom: 150px; background: radial-gradient(circle at 14% 28%, rgba(28,70,103,.18), transparent 29%), var(--bg); }
.section-heading { max-width: var(--max); margin: 0 auto 54px; display: flex; justify-content: space-between; align-items: end; gap: 80px; }
.section-heading > div { display: flex; gap: 28px; align-items: flex-start; }
.section-number { color: var(--accent); font: 500 11px/1 monospace; letter-spacing: .08em; padding-top: 11px; }
.section-heading h2 { font-size: clamp(34px, 3.3vw, 50px); line-height: 1.25; font-weight: 550; letter-spacing: -.04em; margin: 0; }
.section-heading > p { max-width: 450px; color: var(--muted); font-size: 15px; line-height: 1.9; margin: 0 0 5px; }
.section-heading.centered { display: block; text-align: center; }
.section-heading.centered .section-number { display: block; padding: 0; margin-bottom: 21px; }
.section-heading.centered p { margin: 18px auto 0; }
.filter-rail { max-width: var(--max); margin: 0 auto 24px; padding-bottom: 16px; display: flex; gap: 28px; border-bottom: 1px solid rgba(255,255,255,.09); }
.filter { border: 0; padding: 0; background: transparent; color: #72889a; font-size: 13px; cursor: pointer; position: relative; }
.filter.active { color: #fff; }
.filter.active::after { content: ""; position: absolute; left: 0; right: 0; height: 2px; bottom: -17px; background: var(--accent); }
.agent-layout { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: .92fr 1.48fr; gap: 18px; }
.glass-panel, .agent-card { border: 1px solid var(--line); background: linear-gradient(140deg, rgba(27,51,72,.72), rgba(8,21,34,.5)); backdrop-filter: blur(22px); box-shadow: var(--shadow); }
.featured-agent { border-radius: var(--radius); min-height: 596px; position: relative; padding: 30px; overflow: hidden; }
.featured-agent::after { content: ""; position: absolute; width: 240px; height: 240px; border-radius: 50%; right: -80px; bottom: 20px; background: rgba(88,158,208,.12); filter: blur(50px); }
.featured-topline { display: flex; justify-content: space-between; color: #72899c; font-size: 9px; letter-spacing: .14em; margin-bottom: 42px; }
.agent-icon { color: #cde7f7; }
.agent-icon svg { width: 26px; height: 26px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.icon-large { width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid rgba(207,233,250,.35); border-radius: 14px; background: linear-gradient(145deg, rgba(220,240,255,.16), rgba(58,92,119,.08)); box-shadow: inset 0 1px rgba(255,255,255,.18), 0 10px 30px rgba(0,0,0,.2); }
.featured-agent h3 { font-size: 31px; margin: 30px 0 12px; font-weight: 540; letter-spacing: -.03em; }
.featured-agent > p { color: #a6b6c4; line-height: 1.8; max-width: 410px; font-size: 14px; }
.featured-agent ul { list-style: none; padding: 0; margin: 26px 0 0; position: relative; z-index: 2; }
.featured-agent li { color: #b8c8d4; font-size: 13px; margin: 13px 0; }
.featured-agent li::before { content: ""; display: inline-block; width: 3px; height: 3px; margin: 0 10px 3px 0; border-radius: 50%; background: var(--accent); }
.agent-action { position: absolute; left: 30px; bottom: 28px; z-index: 3; border: 1px solid rgba(255,255,255,.22); border-radius: 99px; background: rgba(3,12,22,.35); color: #e6f2fa; padding: 11px 18px; cursor: pointer; transition: .25s; }
.agent-action:hover { border-color: var(--accent); color: var(--accent-soft); }
.agent-action span { margin-left: 22px; }
.document-sculpture { position: absolute; right: 20px; bottom: 48px; width: 230px; height: 240px; transform: perspective(600px) rotateY(-9deg); }
.document-sculpture span { position: absolute; width: 116px; height: 150px; right: 20px; top: 20px; border-radius: 12px; border: 1px solid rgba(208,235,255,.42); background: linear-gradient(140deg, rgba(184,220,245,.18), rgba(20,45,66,.22)); box-shadow: -22px 26px 50px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.26); transform: translate(calc(var(--i, 0) * -26px), calc(var(--i, 0) * 20px)); backdrop-filter: blur(5px); }
.document-sculpture span:nth-child(1) { --i: 0; }.document-sculpture span:nth-child(2) { --i: 1; }.document-sculpture span:nth-child(3) { --i: 2; }
.document-sculpture i { position: absolute; left: 0; right: 0; bottom: 5px; height: 40px; background: radial-gradient(ellipse, rgba(98,168,214,.32), transparent 65%); filter: blur(9px); }
.agent-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.agent-card { min-height: 188px; border-radius: 20px; padding: 25px; position: relative; cursor: pointer; transition: transform .3s, border-color .3s, background .3s; overflow: hidden; }
.agent-card:hover { transform: translateY(-5px); border-color: rgba(255,147,62,.52); background: linear-gradient(140deg, rgba(35,63,86,.82), rgba(9,23,37,.62)); }
.agent-card.hidden { display: none; }
.agent-card .agent-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 11px; background: rgba(194,227,250,.07); }
.agent-card h3 { font-size: 19px; font-weight: 520; margin: 20px 0 9px; }
.agent-card p { color: #879dac; font-size: 12px; line-height: 1.65; margin: 0; max-width: 80%; }
.agent-card .card-arrow { position: absolute; right: 21px; bottom: 20px; color: #6d8496; transition: color .25s, transform .25s; }
.agent-card:hover .card-arrow { color: var(--accent); transform: translate(2px,-2px); }

.workflow-section { padding-top: 130px; padding-bottom: 140px; background: linear-gradient(#020914, #05111e 48%, #020914); position: relative; }
.workflow-steps { max-width: var(--max); margin: 60px auto 22px; display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.workflow-step { min-height: 176px; text-align: left; padding: 24px; border-radius: 17px; border: 1px solid var(--line); background: rgba(15,32,48,.45); cursor: pointer; transition: .3s; position: relative; }
.workflow-step::after { content: ""; position: absolute; width: 17px; height: 1px; right: -17px; top: 50%; background: rgba(255,135,31,.5); }
.workflow-step:last-child::after { display:none; }
.workflow-step.active { border-color: rgba(255,151,67,.7); background: linear-gradient(145deg, rgba(38,64,83,.72), rgba(11,27,42,.65)); transform: translateY(-4px); }
.workflow-step b { color: var(--accent); font: 500 10px monospace; display: block; }
.workflow-step span { display: block; font-size: 19px; margin: 30px 0 10px; }
.workflow-step small { color: #758b9b; font-size: 11px; line-height: 1.6; display: block; }
.workflow-demo { max-width: var(--max); margin: 0 auto; border-radius: 20px; padding: 26px; overflow: auto; }
.demo-meta { display: flex; justify-content: space-between; font-size: 11px; color: #91a6b5; padding-bottom: 22px; border-bottom: 1px solid rgba(255,255,255,.08); }
.live-dot::before { content:""; display:inline-block; width:5px; height:5px; background:#59d399; border-radius:50%; margin:0 8px 1px 0; box-shadow:0 0 10px #59d399; }
.demo-track { min-width: 850px; display: flex; align-items: center; padding: 30px 10px 10px; }
.demo-node { flex: 0 0 116px; min-height: 105px; padding: 15px; border: 1px solid var(--line); border-radius: 14px; background: rgba(164,205,233,.05); }
.demo-node.active { border-color: rgba(255,145,53,.62); box-shadow: 0 0 28px rgba(255,135,31,.08); }
.demo-node span { color: #60798c; font: 9px monospace; }.demo-node b { font-size: 13px; font-weight:500; display:block; margin:18px 0 6px; }.demo-node small { color:#6d8293;font-size:9px; }
.demo-track > i { flex: 1; height: 1px; min-width: 20px; background: linear-gradient(90deg, #42596b, var(--accent), #42596b); position:relative; }
.demo-track > i::after { content:""; position:absolute; width:4px;height:4px;border-radius:50%;background:var(--accent);right:48%;top:-2px;box-shadow:0 0 10px var(--accent);animation:flow 2s infinite; }

.scenes-section { padding-top: 130px; padding-bottom: 140px; }
.business-matrix { max-width: var(--max); min-height: 650px; margin: 70px auto 0; display: grid; grid-template-columns: 1fr 390px; align-items: center; gap: 70px; }
.matrix-orbits { height: 620px; position: relative; }
.matrix-orbits::after { content:""; position:absolute; left:50%; top:50%; width:310px; height:310px; border-radius:50%; transform:translate(-50%,-50%); background:radial-gradient(circle,rgba(54,143,196,.14),transparent 68%); filter:blur(14px); pointer-events:none; }
.matrix-ring { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); border:1px solid rgba(115,183,224,.18); border-radius:50%; box-shadow:inset 0 0 38px rgba(62,134,184,.035); }
.matrix-ring::before { content:""; position:absolute; inset:-2px; border-radius:50%; padding:2px; background:conic-gradient(from 0deg,transparent 0 69%,rgba(72,196,232,.04) 73%,rgba(91,218,245,.95) 77%,rgba(255,255,255,.92) 79%,rgba(255,135,31,.8) 82%,transparent 88%); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; filter:drop-shadow(0 0 7px rgba(88,211,242,.62)); animation:matrix-ring-flow var(--flow-duration) linear infinite; }
.matrix-ring::after { content:""; position:absolute; left:50%; top:50%; width:7px; height:7px; margin:-3.5px; border-radius:50%; background:#e9fbff; box-shadow:0 0 5px #fff,0 0 13px #66dfff,0 0 22px rgba(255,135,31,.78); animation:matrix-orbit-dot var(--dot-duration) linear infinite; }
.ring-outer { width:560px; height:560px; --orbit-radius:280px; --flow-duration:14s; --dot-duration:18s; }.ring-middle { width:400px; height:400px; --orbit-radius:200px; --flow-duration:10s; --dot-duration:13s; }.ring-inner { width:235px; height:235px; --orbit-radius:117.5px; --flow-duration:7s; --dot-duration:9s; }
.ring-middle::before,.ring-middle::after { animation-direction:reverse; }.ring-inner::before { background:conic-gradient(from 0deg,transparent 0 58%,rgba(255,135,31,.04) 64%,rgba(255,135,31,.9) 70%,rgba(255,241,223,.98) 73%,rgba(86,206,238,.72) 77%,transparent 84%); }
.matrix-core,.matrix-node { position:absolute; z-index:3; color:var(--text); cursor:pointer; }
.matrix-core { left:50%; top:50%; transform:translate(-50%,-50%); width:154px; height:154px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; background:radial-gradient(circle at 38% 30%,rgba(224,247,255,.42),rgba(35,108,147,.18) 45%,rgba(5,22,35,.88)); border:1px solid rgba(122,208,235,.52); box-shadow:0 24px 70px rgba(18,109,160,.3),inset 0 0 34px rgba(210,244,255,.18); animation:matrix-core-breathe 3.8s ease-in-out infinite; }
.matrix-core::before,.matrix-core::after { content:""; position:absolute; inset:-14px; border:1px solid rgba(97,214,240,.28); border-radius:50%; opacity:0; animation:matrix-core-wave 3.2s ease-out infinite; pointer-events:none; }.matrix-core::after { animation-delay:1.6s; }
.matrix-core span,.matrix-core b { position:relative; z-index:1; }.matrix-core span { font-size:32px; font-weight:250; color:#8edcf0; text-shadow:0 0 20px rgba(108,223,245,.48); }.matrix-core b { font-size:11px; font-weight:500; margin-top:8px; }
.matrix-node { width:96px; height:96px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; background:linear-gradient(145deg,rgba(28,53,72,.8),rgba(5,18,30,.8)); border:1px solid rgba(143,193,224,.25); box-shadow:0 15px 38px rgba(0,0,0,.26),inset 0 1px rgba(255,255,255,.07); backdrop-filter:blur(15px); transition:transform .3s,border-color .3s,box-shadow .3s,background .3s; }
.matrix-node:hover,.matrix-node.active { transform:scale(1.08); border-color:rgba(255,138,43,.72); background:linear-gradient(145deg,rgba(49,67,79,.9),rgba(9,23,35,.9)); box-shadow:0 18px 45px rgba(255,106,27,.12),inset 0 1px rgba(255,255,255,.1); }
.matrix-node i { width:9px; height:9px; border-radius:50%; background:linear-gradient(135deg,#5bd5ef,#2384da); box-shadow:0 0 13px rgba(75,196,234,.8); }.matrix-node.active i { background:var(--accent); box-shadow:0 0 14px rgba(255,135,31,.8); }.matrix-node span { font-size:14px; font-weight:600; line-height:1.2; white-space:nowrap; text-shadow:0 1px 12px rgba(0,0,0,.45); }
.matrix-orbits .node-1 { left:calc(50% - 48px); top:0; }.matrix-orbits .node-2 { right:28px; top:90px; }.matrix-orbits .node-3 { right:15px; top:280px; }.matrix-orbits .node-4 { right:58px; bottom:28px; }.matrix-orbits .node-5 { left:calc(50% - 48px); bottom:0; }.matrix-orbits .node-6 { left:42px; bottom:54px; }.matrix-orbits .node-7 { left:15px; top:164px; }
.matrix-detail { min-height:370px; border-radius:24px; padding:40px; display:flex; flex-direction:column; justify-content:center; position:relative; overflow:hidden; }
.matrix-detail::before { content:""; position:absolute; width:220px; height:220px; right:-100px; top:-100px; border-radius:50%; background:rgba(80,168,218,.12); filter:blur(30px); }
.matrix-detail>span { color:#54b8ce; font-size:10px; letter-spacing:.16em; }.matrix-detail h3 { font-size:31px; font-weight:550; margin:19px 0 17px; }.matrix-detail p { min-height:70px; color:var(--muted); font-size:14px; line-height:1.8; margin:0; }.matrix-formula { display:flex; align-items:center; margin:31px 0 17px; }.matrix-formula b { flex:0 0 40px; width:40px; height:40px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--line); background:rgba(198,229,247,.06); font-size:12px; font-weight:500; }.matrix-formula i { flex:1; height:1px; background:linear-gradient(90deg,#2aa8c1,rgba(255,135,31,.65)); }.matrix-detail small { color:#71889a; font-size:9px; }

.cta-section { max-width: var(--max); min-height: 330px; margin: 0 auto 120px; border: 1px solid rgba(255,151,72,.42); border-radius: 25px; padding: 58px 64px !important; position: relative; overflow: hidden; background: radial-gradient(circle at 78% 40%, rgba(34,81,115,.4), transparent 36%), linear-gradient(135deg, rgba(20,39,55,.72), rgba(3,13,23,.85)); box-shadow: var(--shadow); }
.cta-section::after { content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.4; }
.cta-section h2 { font-size: 40px; line-height:1.25;margin:0;font-weight:550;letter-spacing:-.04em; }.cta-section p{color:#8fa4b4;margin:17px 0 28px;}
.cta-orbit { position:absolute;right:7%;top:50%;width:330px;height:170px;transform:translateY(-50%) rotate(-8deg);border:1px solid rgba(207,230,245,.32);border-radius:50%;box-shadow:inset 0 0 30px rgba(133,197,235,.14),0 0 40px rgba(0,0,0,.4); }
.cta-orbit i {position:absolute;inset:24px;border:1px solid rgba(207,230,245,.18);border-radius:50%;}.cta-orbit b {position:absolute;inset:50px 95px;border:1px solid rgba(207,230,245,.38);border-radius:50%;box-shadow:0 0 28px rgba(118,187,230,.16);}.cta-orbit span{position:absolute;width:22px;height:22px;border-radius:50%;background:var(--accent);right:40px;top:25px;box-shadow:0 0 22px rgba(255,135,31,.75);animation:float 3.4s ease-in-out infinite;}

.site-footer { max-width: var(--max); margin:0 auto; display:grid; grid-template-columns:1.8fr repeat(3,.65fr) 1fr;gap:42px;padding:60px 0 28px;border-top:1px solid rgba(255,255,255,.09);color:#748a9a; }
.footer-brand p {font-size:12px;line-height:1.9;margin-top:20px;}.footer-links{display:flex;flex-direction:column;gap:12px;font-size:12px}.footer-links b{color:#d7e3eb;font-weight:500;margin-bottom:5px}.footer-links a:hover,.footer-contact a:hover{color:var(--accent)}.footer-contact{display:flex;flex-direction:column;gap:16px;font-size:15px;color:#c8d5de}.copyright{grid-column:1/-1;text-align:center;border-top:1px solid rgba(255,255,255,.05);padding-top:22px;font-size:10px;}

.agent-dialog { width:min(490px,calc(100% - 32px)); color:var(--text);border:1px solid var(--line-bright);border-radius:24px;background:rgba(7,20,33,.92);backdrop-filter:blur(26px);box-shadow:0 40px 120px rgba(0,0,0,.65);padding:40px; }
.agent-dialog::backdrop { background:rgba(0,5,12,.74);backdrop-filter:blur(8px); }.dialog-close{position:absolute;right:18px;top:14px;border:0;background:transparent;color:#8da1af;font-size:28px;cursor:pointer}.dialog-index{font:9px monospace;color:#668094;letter-spacing:.14em}.agent-dialog .icon-large{margin-top:28px}.agent-dialog h2{font-size:31px;margin:24px 0 12px}.agent-dialog > p{color:#91a5b4;line-height:1.8}.dialog-output{margin:26px 0;padding:18px;border:1px solid var(--line);border-radius:13px;background:rgba(167,210,240,.04)}.dialog-output span{display:block;color:#668094;font-size:10px;margin-bottom:8px}.dialog-output b{font-size:13px;font-weight:500}.dialog-start{width:100%;border:0;}

@keyframes reveal { from{opacity:0;transform:scale(1.03)}to{opacity:.9;transform:scale(1)} }
@keyframes flow { 0%{transform:translateX(-13px);opacity:0}50%{opacity:1}100%{transform:translateX(13px);opacity:0} }
@keyframes float { 50%{transform:translateY(9px)} }
@keyframes matrix-ring-flow { to { transform:rotate(360deg); } }
@keyframes matrix-orbit-dot { from { transform:rotate(0deg) translateY(calc(var(--orbit-radius) * -1)); } to { transform:rotate(360deg) translateY(calc(var(--orbit-radius) * -1)); } }
@keyframes matrix-core-breathe { 0%,100% { box-shadow:0 24px 70px rgba(18,109,160,.24),inset 0 0 34px rgba(210,244,255,.14); } 50% { box-shadow:0 24px 90px rgba(38,171,218,.42),0 0 35px rgba(93,214,239,.14),inset 0 0 44px rgba(225,249,255,.24); } }
@keyframes matrix-core-wave { 0% { transform:scale(.88); opacity:0; } 24% { opacity:.5; } 100% { transform:scale(1.38); opacity:0; } }

@media (max-width: 1050px) {
  .site-header{grid-template-columns:200px 1fr 70px}.main-nav{gap:18px}.main-nav a{font-size:11px}.hero-visual{left:12%}.agent-layout{grid-template-columns:1fr}.featured-agent{min-height:560px}.site-footer{padding-left:28px;padding-right:28px}.section-heading{gap:40px}.cta-section{margin-left:28px;margin-right:28px;width:auto}.cta-orbit{opacity:.55;right:-5%}
}
@media (max-width: 760px) {
  .site-header{height:68px;display:flex;justify-content:space-between;padding:0 20px;position:absolute}.brand{font-size:17px}.login-button{display:none}.menu-toggle{display:flex;width:42px;height:42px;border:0;background:transparent;flex-direction:column;justify-content:center;gap:7px;align-items:flex-end;z-index:3}.menu-toggle span{height:1px;background:#fff;width:24px}.menu-toggle span:last-child{width:17px}.main-nav{position:absolute;top:0;left:0;right:0;height:auto;padding:90px 24px 30px;background:rgba(2,9,20,.96);backdrop-filter:blur(20px);display:none;flex-direction:column;align-items:flex-start;gap:22px;border-bottom:1px solid var(--line)}.main-nav.open{display:flex}.main-nav a{height:auto;font-size:15px}.main-nav a.active::after{display:none}
  .hero{height:auto;min-height:780px;padding:120px 20px 60px;align-items:flex-start}.hero-visual{left:0;top:240px;height:540px;opacity:.72}.hero-visual::before{background:linear-gradient(180deg,var(--bg),transparent 28%,transparent 70%,var(--bg))}.hero-visual img{object-position:62% center}.hero-copy{width:auto}.hero h1{font-size:43px}.hero-description{font-size:14px;line-height:1.75;margin-top:22px}.hero-actions{margin-top:28px;flex-wrap:wrap}.button{height:46px;padding:0 19px}.hero-foot{display:none}
  section:not(.hero){padding-left:20px;padding-right:20px}.agents-section,.workflow-section,.scenes-section{padding-top:88px;padding-bottom:90px}.section-heading{display:block;margin-bottom:38px}.section-heading>div{gap:15px}.section-heading h2{font-size:32px}.section-heading>p{margin-top:24px;font-size:13px}.filter-rail{overflow:auto;gap:24px;white-space:nowrap}.agent-layout{display:block}.featured-agent{min-height:590px;padding:24px}.featured-agent h3{font-size:27px}.document-sculpture{right:-42px;bottom:64px;transform:scale(.75)}.agent-grid{grid-template-columns:1fr;margin-top:14px;gap:14px}.agent-card{min-height:168px}.workflow-steps{grid-template-columns:1fr 1fr;gap:12px;margin-top:35px}.workflow-step{min-height:150px;padding:18px}.workflow-step::after{display:none}.workflow-step span{font-size:17px;margin-top:24px}.workflow-demo{padding:18px}.business-matrix{grid-template-columns:1fr;gap:15px;margin-top:42px}.matrix-orbits{height:520px;transform:scale(.65);margin:-76px -115px}.matrix-detail{min-height:300px;padding:28px;margin-top:-66px}.matrix-detail h3{font-size:27px}.cta-section{margin:0 20px 80px;padding:38px 26px!important;min-height:420px}.cta-section h2{font-size:34px}.cta-orbit{width:270px;height:130px;right:-72px;top:auto;bottom:30px;transform:rotate(-8deg);opacity:.5}.site-footer{grid-template-columns:1fr 1fr;padding:50px 20px 28px;gap:34px}.footer-brand,.footer-contact{grid-column:1/-1}.copyright{text-align:left}.agent-dialog{padding:32px 24px}
}
@media (prefers-reduced-motion: reduce) { html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important} }