/* Small platform shortcuts shared by the two local homepage previews. */
.hero-platforms{display:flex;justify-content:center;align-items:center;gap:10px;margin:12px auto 0;width:max-content;max-width:100%}
.hero-platforms .hero-platform{position:relative;display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:50%;color:#b0b0b8;transition:color 260ms ease,transform 320ms ease}
.hero-platform::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle,#ffffff12,transparent 72%);opacity:0;transition:opacity 320ms ease;pointer-events:none}
.hero-platforms .hero-platform svg{display:block;width:22px;height:22px;overflow:visible}
.hero-platforms .hero-platform.is-upcoming{color:#686874}
.hero-platforms .hero-platform:hover,.hero-platforms .hero-platform:focus-visible{color:#f2f2f5;transform:translateY(-2px)}
.hero-platform:hover::before,.hero-platform:focus-visible::before{opacity:1}
.hero-platforms .hero-platform:focus-visible{outline:1px solid #b0b0b8;outline-offset:2px}
.hero-platforms .hero-platform.is-upcoming:hover,.hero-platforms .hero-platform.is-upcoming:focus-visible{color:#a0a0ad}
.hero-bottom .hero-platforms+.button-note{margin-top:7px}
@media(prefers-reduced-motion:reduce){.hero-platforms .hero-platform,.hero-platform::before{transition:none}.hero-platforms .hero-platform:hover,.hero-platforms .hero-platform:focus-visible{transform:none}}