/* Additive ecosystem content; the approved SFSound theme stays the foundation. */
.getsuzo-ecosystem { margin-top: 24px; padding: 28px; border: 1px solid var(--glass-edge); border-radius: 26px; background: var(--card-material); box-shadow: var(--card-shadow); color: var(--text); min-width: 0; }
.getsuzo-ecosystem .ecosystem-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.getsuzo-ecosystem .ecosystem-eyebrow { margin: 0 0 12px; color: var(--accent); font-size: 10px; font-weight: 700; letter-spacing: 1.5px; }
.getsuzo-ecosystem h2 { margin: 0; font-size: clamp(24px, 3vw, 32px); line-height: 1.2; letter-spacing: -.8px; }
.getsuzo-ecosystem .ecosystem-heading p:not(.ecosystem-eyebrow) { margin: 12px 0 0; font-size: 14px; line-height: 1.7; color: var(--muted); }
.getsuzo-ecosystem a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; color: var(--accent); font-size: 13px; font-weight: 650; text-decoration: none; }
.getsuzo-ecosystem a:hover { text-decoration: underline; }
.getsuzo-ecosystem a:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 8px; }
.getsuzo-ecosystem a svg { width: 17px; height: 17px; flex: none; }
.getsuzo-ecosystem .ecosystem-hub-link { flex: none; padding: 8px 16px; border-radius: 24px; background: var(--accent-dark); }
.getsuzo-ecosystem .ecosystem-apps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 24px; }
.getsuzo-ecosystem .ecosystem-app { min-width: 0; padding: 20px; border-radius: 20px; background: var(--well); border: 1px solid var(--line); display: flex; flex-direction: column; }
.getsuzo-ecosystem .ecosystem-app-identity { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.getsuzo-ecosystem .ecosystem-app-identity > svg { width: 44px; height: 44px; flex: none; }
.getsuzo-ecosystem h3 { margin: 0; font-size: 18px; letter-spacing: -.4px; }
.getsuzo-ecosystem .ecosystem-app-identity > div > span { display: block; margin-top: 4px; font-size: 11px; color: var(--muted); }
.getsuzo-ecosystem .ecosystem-current { font-size: 10px; font-weight: 600; color: var(--accent); background: var(--accent-dark); padding: 5px 8px; border-radius: 12px; }
.getsuzo-ecosystem .ecosystem-app > p { color: var(--muted); font-size: 13px; line-height: 1.75; margin: 16px 0; }
.getsuzo-ecosystem .ecosystem-app-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; }
.getsuzo-ecosystem .ecosystem-platform { font-size: 11px; color: var(--muted); }
.getsuzo-ecosystem .ecosystem-footnote { margin: 20px 0 0; color: var(--muted); font-size: 12px; line-height: 1.75; }
@media (max-width: 1100px) { .getsuzo-ecosystem .ecosystem-apps { grid-template-columns: 1fr; } .getsuzo-ecosystem .ecosystem-heading { align-items: flex-start; flex-direction: column; gap: 16px; } }
@media (max-width: 700px) { .getsuzo-ecosystem { padding: 24px; } }
@media (max-width: 359px) { .getsuzo-ecosystem { padding: 20px; } .getsuzo-ecosystem .ecosystem-app { padding: 16px; } }
@media (forced-colors: active) { .getsuzo-ecosystem, .getsuzo-ecosystem .ecosystem-app { border-color: CanvasText; } }
