/* Opus ecosystem: a wide cinematic card with a live network grid, then four counters */
.eco__card { position: relative; aspect-ratio: 16 / 8.2; border-radius: 6px; overflow: hidden; background: #05070d; }
.eco__cv { position: absolute; inset: 0; width: 100%; height: 100%; }
.eco__shade { position: absolute; inset: 0; background: linear-gradient(to top, rgba(5, 6, 10, 0.92) 0%, rgba(5, 6, 10, 0.4) 42%, rgba(5, 6, 10, 0) 70%), linear-gradient(to right, rgba(5, 6, 10, 0.7) 0%, rgba(5, 6, 10, 0) 55%); pointer-events: none; }
.eco__copy { position: absolute; left: clamp(20px, 3vw, 44px); bottom: clamp(22px, 3vw, 44px); max-width: 520px; display: flex; flex-direction: column; gap: 12px; }
.eco__copy p:last-child { font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, 0.78); }
.eco__logo { position: absolute; right: clamp(20px, 3vw, 44px); bottom: clamp(26px, 3vw, 48px); height: 22px; width: auto; opacity: 0.6; }
.eco__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 40px; }
.eco__stats > div { display: flex; flex-direction: column; gap: 8px; padding-top: 18px; border-top: 1px solid var(--line); }
.eco__num { font-family: var(--serif); font-size: clamp(36px, 3.4vw, 50px); line-height: 1; letter-spacing: -0.02em; }
@media (max-width: 900px) { .eco__card { aspect-ratio: auto; height: 560px; } .eco__logo { top: 20px; bottom: auto; height: 18px; } .eco__stats { grid-template-columns: repeat(2, 1fr); } }