/* A440: the product's own identity (iridescent waveform, cyan-to-violet gradient on "dissonance") is allowed here and on its card only. */
.a440-dissonance { background: linear-gradient(90deg, #22d3ee, #818cf8, #a855f7); -webkit-background-clip: text; background-clip: text; color: transparent; }
.a440-tertiary { margin: 14px 0 0; font-size: 13.5px; color: var(--sy-gray); }
.a440-hero { padding-top: clamp(24px, 3vw, 40px); }
.a440-shots { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: end; }
.a440-shot-mobile { display: none; }
@media (min-width: 768px) { .a440-shots { grid-template-columns: minmax(0, 1fr) 280px; } .a440-shot-mobile { display: block; } }
.sy-device-frame.is-missing img { display: none; }
.sy-device-frame .a440-placeholder { display: none; }
.sy-device-frame.is-missing .a440-placeholder { display: grid; min-height: 420px; }
.sy-device-phone.is-missing .a440-placeholder { min-height: 520px; }
.a440-wave { margin: 28px 0 0; height: 80px; }
.a440-wave svg { display: block; width: 100%; height: 100%; }
.a440-stats { margin-top: 20px; }
.a440-steps { margin: 0; padding: 0; list-style: none; display: grid; gap: 1px; background: var(--sy-line); border: 1px solid var(--sy-line); }
.a440-steps li { display: grid; grid-template-columns: 48px 1fr; gap: 12px; padding: 16px 18px; background: var(--sy-black); font-size: 14.5px; line-height: 1.55; color: var(--sy-gray); }
.a440-steps li span { font-family: var(--sy-mono); font-size: 11px; letter-spacing: .1em; color: var(--sy-blue-text); padding-top: 3px; }
.a440-steps li strong { color: var(--sy-white); font-weight: 500; }