/* Open Altio launch page (/open-altio/): page-only styles on top of assets/styles.css. */
.faers-hero { padding-bottom: clamp(1.5rem, 3vw, 2rem); }
.launch-video { max-width: min(100%, 560px); margin-inline: auto; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); background: var(--navy-deep); }
.launch-video video { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; }
.way-code { margin: .25rem 0 0; padding: .85rem 1rem; background: var(--mist); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow-x: auto; font-size: .88rem; line-height: 1.6; color: var(--navy-ink); }
.way-code code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre; background: none; padding: 0; }
.get-note { margin-top: 1.75rem; }
.get-list { margin: 0 0 1.5rem; padding-left: 1.2rem; display: grid; gap: .6rem; max-width: var(--narrow); color: var(--text); }
.faers-note { margin-top: 2rem; font-family: var(--serif); font-size: 1.15rem; color: var(--muted); }

/* First release, the two ways in (hosted and open source) and coming next. */
.faers-hero-cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
#sources .cols-3 > * { flex: 0 1 calc((100% - 2 * clamp(1.25rem, 2.5vw, 1.75rem)) / 3); min-width: 260px; }
@media (max-width: 860px) { #sources .cols-3 > * { flex: 1 1 100%; max-width: none; } }
.faers-ways { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(1.25rem, 2.5vw, 1.75rem); align-items: start; }
.faers-ways .contact-card h3 { margin: 0 0 .75rem; }
.faers-way-kicker { margin: 0 0 .35rem; font-size: .76rem; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; color: var(--blue); }
.faers-paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.25rem 0; }
.faers-paths .card { padding: 1.1rem 1.2rem; }
.faers-paths h4 { margin: 0 0 .4rem; font-size: 1rem; }
.faers-paths p { margin: 0; font-size: .92rem; color: var(--muted); }
.faers-way-cta { margin: 1.5rem 0 .5rem; }
@media (max-width: 860px) { .faers-ways { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .faers-paths { grid-template-columns: 1fr; } }
.faers-how { margin: 1rem 0 0; padding-left: 1.2rem; display: grid; gap: .6rem; color: var(--muted); }
.faers-features > * { flex: 0 1 calc((100% - clamp(1.25rem, 2.5vw, 1.75rem)) / 2); max-width: none; }
@media (max-width: 760px) { .faers-features > * { flex: 1 1 100%; } }
.faers-release-cta { margin: 2rem 0 0; text-align: center; }
.faers-way-label { margin: 1.25rem 0 .5rem; font-size: .92rem; color: var(--muted); }