/* Release-page additions keep the existing site typography, colors, and cards. */
.ms-release .release-hero { min-height: auto; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); padding-block: 56px 32px; }
.ms-release h1 { font-size: clamp(40px, 5.5vw, 68px); line-height: 1.05; }
.ms-release .release-lead { color: var(--ink); font-size: clamp(24px, 3vw, 32px); font-weight: 750; line-height: 1.2; }
.ms-release .release-intro { max-width: 900px; padding-bottom: 34px; }
.ms-release .release-intro .intro-heading { justify-content: space-between; }
.ms-release .release-intro .appstore-mark { width: 90px; }
.ms-release .release-meta { margin: 18px 0 0; font-size: 14px; }
.ms-release .release-shot { min-height: 0; padding: 0 0 16px; gap: 16px; }
.ms-release .release-shot > a { display: block; width: 100%; }
.ms-release .release-shot img { border-radius: 0; }
.ms-release .release-shot figcaption { padding-inline: 18px; }
.ms-release .release-features { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ms-release .release-features p { margin-bottom: 0; }
.ms-release .screenshot-card h2 { font-size: 27px; line-height: 1.16; margin-bottom: 0; }
.ms-release .screenshot-card > a { color: #205c5d; font-weight: 700; }
.ms-release .button { padding-block: 10px; text-align: center; }
.ms-release section[id] { scroll-margin-top: 24px; }
.ms-release a:focus-visible { outline: 3px solid #205c5d; outline-offset: 4px; }
.ms-release .skip-link { position: absolute; left: 16px; top: -100px; z-index: 10; padding: 12px 18px; background: white; }
.ms-release .skip-link:focus { top: 12px; }
@media (max-width: 820px) {
  .ms-release.legacy-support .intro-heading { flex-direction: column; }
  .ms-release.legacy-support .support-icon { width: 96px; }
  .ms-release .release-hero, .ms-release .release-features { grid-template-columns: 1fr; }
  .ms-release .release-hero { padding-top: 32px; }
  .ms-release .band, .ms-release .showcase, .ms-release .signup, .ms-release .midi-box-feature { padding: 22px; }
  .ms-release .release-intro .intro-heading { align-items: center; }
  .ms-release .release-intro .appstore-mark { width: 64px; }
}
@media (max-width: 420px) {
  .ms-release .release-intro .intro-heading { flex-wrap: wrap; }
  .ms-release .release-intro .appstore-mark { order: -1; }
}