:root{--bg:#090d1d;--card:#111a31;--text:#e8edf7;--muted:#9cb0d2;--accent:#2dd4bf;--accent2:#a855f7;--stroke:#243153}
[data-theme="light"]{--bg:#f3f7ff;--card:#fff;--text:#0d1b3d;--muted:#4d5f86;--accent:#0f766e;--accent2:#7e22ce;--stroke:#cfdbf5}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,sans-serif;background:radial-gradient(circle at 20% 0,#182548 0,var(--bg) 40%);color:var(--text)}
.section{max-width:1160px;margin:0 auto;padding:4.5rem 1.2rem}.site-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:1rem;padding:.8rem 1.2rem;background:color-mix(in oklab,var(--bg),transparent 12%);backdrop-filter:blur(8px);border-bottom:1px solid var(--stroke)}
.brand{display:flex;align-items:center;gap:.5rem;color:var(--text);text-decoration:none;font-weight:700}.brand img{width:26px}.site-nav{display:flex;gap:1rem;flex:1;justify-content:center}.site-nav a{color:var(--muted);text-decoration:none}.header-actions{display:flex;gap:.6rem}.btn,.ghost-btn{border:1px solid var(--stroke);border-radius:999px;padding:.65rem 1rem;background:linear-gradient(120deg,var(--accent),var(--accent2));color:#fff;text-decoration:none;font-weight:600}.btn-secondary,.ghost-btn{background:transparent;color:var(--text)}
.menu-btn{display:none}.hero{display:grid;grid-template-columns:1fr 1.1fr;gap:1.4rem;align-items:center}h1{font-size:clamp(2rem,4vw,3.5rem)}h2{font-size:clamp(1.5rem,3vw,2.3rem)}.eyebrow{color:var(--accent);font-weight:600}.hero-cta{display:flex;gap:.7rem;flex-wrap:wrap}
.telemetry-canvas,.card,.metric,.arch-diagram,.contact-form input,.contact-form textarea{background:var(--card);border:1px solid var(--stroke);border-radius:16px}.telemetry-canvas{padding:1rem}.telemetry-canvas svg{width:100%;height:auto}.flow-line{fill:none;stroke:url(#flow);stroke-width:3;stroke-dasharray:8 8;animation:dash 16s linear infinite}.node rect{fill:#0f1730;stroke:var(--stroke)}.node text{font-size:14px;fill:#cde1ff}.node.active rect{stroke:var(--accent)}@keyframes dash{to{stroke-dashoffset:-200}}
.signal-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-top:.7rem}.signal-cards span{padding:.55rem .7rem;background:#0c142b;border:1px solid var(--stroke);border-radius:10px;font-size:.85rem}
.grid-5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.8rem}.card{padding:1rem}.impact{background:linear-gradient(145deg,#122546,#192c57)}
.tab-row{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0}.tab-row button{padding:.55rem .9rem;border-radius:999px;border:1px solid var(--stroke);background:transparent;color:var(--text)}.tab-row .active{background:linear-gradient(120deg,var(--accent),var(--accent2));color:#fff}
.otel-guide{position:relative}.otel-subtitle{max-width:980px;color:var(--muted)}
.otel-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.2rem}
.otel-panel{padding:1rem;border:1px solid var(--stroke);border-radius:16px;background:color-mix(in oklab,var(--card),transparent 10%)}
.signal-orbit{position:relative;min-height:320px;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at center,#132444 0,#0e1730 65%);border:1px solid var(--stroke);border-radius:14px}
.orbit-core{z-index:2;text-align:center;padding:1rem 1.2rem;border-radius:999px;background:linear-gradient(120deg,#113053,#1d2757);border:1px solid #355084;font-weight:700}
.orbit-ring{position:absolute;border:1px dashed #38507a;border-radius:999px;animation:spin 24s linear infinite}.ring-a{width:230px;height:230px}.ring-b{width:290px;height:290px;animation-direction:reverse}
.signal-chip{position:absolute;border:1px solid var(--stroke);background:#0d1a37;color:var(--text);padding:.45rem .65rem;border-radius:999px;cursor:pointer}
.signal-chip:focus-visible{outline:2px solid var(--accent)}
.signal-chip.active{box-shadow:0 0 0 1px var(--accent) inset,0 0 16px color-mix(in srgb,var(--accent),transparent 70%);transform:translateY(-1px)}
.chip-traces{top:16%;left:12%}.chip-metrics{top:20%;right:12%}.chip-logs{left:8%;bottom:34%}.chip-events{right:9%;bottom:35%}.chip-profiles{bottom:14%;left:25%}.chip-baggage{bottom:12%;right:18%}
.otel-inline-note{margin-top:.7rem;padding:.7rem;border:1px solid var(--stroke);border-radius:10px;background:#0d1731;color:#cfe0ff}
.collector-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;position:relative}
.collector-grid::before{content:"";position:absolute;left:6%;right:6%;top:50%;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent2));z-index:0;animation:pulse 3s ease-in-out infinite}
.collector-stage{position:relative;z-index:1;padding:.75rem;border:1px solid var(--stroke);border-radius:12px;background:#0e1834;transition:.2s}
.collector-stage h4{margin:.1rem 0 .4rem}.collector-stage p{margin:0;color:var(--muted);font-size:.9rem}
.collector-stage.active{border-color:var(--accent);transform:translateY(-2px)}
.otel-code{margin-top:.7rem;padding:.75rem;border:1px solid var(--stroke);border-radius:12px;background:#081126;color:#c5f2e5;font-size:.82rem;overflow:auto}
.deploy-pattern{padding:.9rem;border:1px solid var(--stroke);border-radius:12px;background:#0d1732}
.deploy-graph{display:grid;gap:.7rem}
.deploy-line{padding:.6rem;border:1px solid var(--stroke);border-radius:10px;background:#122041}
.enrich-flow{display:grid;grid-template-columns:1fr auto 1.2fr;gap:.7rem;align-items:stretch}
.enrich-card{padding:.8rem;border:1px solid var(--stroke);border-radius:12px;background:#0e1b38}.enrich-card h4{margin:.2rem 0 .5rem}.enrich-card ul{margin:0;padding-left:1rem}
.enrich-middle{position:relative}.enrich-middle::before,.enrich-middle::after{content:"→";position:absolute;top:50%;transform:translateY(-50%);color:var(--accent);font-weight:700}
.enrich-middle::before{left:-.8rem}.enrich-middle::after{right:-.8rem}
.enrich-result p{margin:0;color:#d9f1ff}
@keyframes spin{to{transform:rotate(1turn)}}@keyframes pulse{50%{opacity:.5}}
.arch-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:.9rem}.arch-diagram{padding:1rem;display:grid;gap:.65rem}.arch-layer{padding:.8rem;border:1px solid var(--stroke);border-radius:12px}.arch-layer.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.dashboard-mock{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem}.metric{padding:1rem;animation:float 6s ease-in-out infinite}.metric strong{font-size:1.4rem;display:block}@keyframes float{50%{transform:translateY(-4px)}}
.dpe-flow,.solutions-grid,.packages,.timeline,.chip-groups{display:grid;gap:.8rem}.dpe-flow{grid-template-columns:repeat(5,minmax(0,1fr))}.step,.solution,.package,.story-step{padding:1rem;border:1px solid var(--stroke);border-radius:12px;background:var(--card)}
.solutions-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.solution ul,.package ul{padding-left:1rem}
.package-header{display:flex;align-items:center;flex-wrap:wrap;gap:.4rem}
.package-price{font-size:1.4rem;font-weight:700;color:var(--teal,var(--accent));margin:.2rem 0}
.package-duration{font-size:.85rem;opacity:.7;margin:.1rem 0 .7rem;color:var(--muted)}
.package-tag{background:var(--teal,var(--accent));color:#06211d;padding:2px 8px;border-radius:999px;font-size:.75rem;margin-left:8px;vertical-align:middle;font-weight:700}
.package-upsell{font-style:italic;font-size:.88rem;color:var(--muted);border-left:3px solid var(--accent);padding-left:8px;margin-top:8px}
.timeline{grid-template-columns:repeat(5,minmax(0,1fr))}.story-step{position:relative}.story-step::after{content:"";position:absolute;top:50%;right:-.5rem;width:1rem;height:2px;background:var(--accent)}.story-step:last-child::after{display:none}
.chip-groups{grid-template-columns:repeat(5,minmax(0,1fr))}.chip-group{padding:1rem;border:1px solid var(--stroke);border-radius:12px}.chip{display:inline-block;margin:.2rem;padding:.3rem .6rem;border-radius:999px;border:1px solid var(--stroke);transition:.2s}.chip:hover{border-color:var(--accent);transform:translateY(-2px)}
.calc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.calc-out{margin-top:1rem;padding:1rem;border:1px solid var(--stroke);border-radius:12px;background:var(--card)}
.contact-form{display:grid;gap:.7rem;max-width:720px}.contact-form input,.contact-form textarea{padding:.8rem;color:var(--text)}.note{color:var(--muted)}

.sponsor-btn{border:1px solid var(--accent);border-radius:999px;padding:.4rem .8rem}
.agentguard-chips{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0}
.agentguard-chips span{padding:.45rem .75rem;border:1px solid var(--stroke);border-radius:999px;background:var(--card);font-size:.9rem}
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:1rem;align-items:start}
.contact-call p{color:var(--muted)}
.site-footer{border-top:1px solid var(--stroke);margin-top:2rem;padding:1.5rem 1.2rem 2rem;text-align:center;color:var(--muted)}
.site-footer p{margin:.35rem 0}.site-footer a{color:var(--text);text-decoration:none}
@media (max-width:980px){.hero,.arch-layout,.grid-5,.dashboard-mock,.solutions-grid,.timeline,.chip-groups,.dpe-flow,.otel-grid,.collector-grid{grid-template-columns:1fr 1fr}.site-nav{display:none;position:absolute;top:56px;left:0;right:0;padding:1rem;background:var(--bg);border-bottom:1px solid var(--stroke)}.site-nav.open{display:flex;flex-direction:column}.menu-btn{display:block;margin-left:auto;background:transparent;border:1px solid var(--stroke);color:var(--text);border-radius:8px;padding:.4rem .6rem}.header-actions .btn{display:none}.enrich-flow{grid-template-columns:1fr}.enrich-middle::before,.enrich-middle::after{display:none}}
@media (max-width:640px){.grid-5,.dashboard-mock,.solutions-grid,.timeline,.chip-groups,.calc-grid,.dpe-flow,.otel-grid,.collector-grid,.contact-grid{grid-template-columns:1fr}.signal-orbit{min-height:360px}}