/*
 * Official Apple "Download on the App Store" badge.
 *
 * Apple's App Store marketing guidelines govern this artwork:
 *   - use Apple's badge unmodified (preferred black version); never redraw,
 *     recolour, angle or animate it, so there is no hover transform here;
 *   - at least 40px tall on screen (we use 48px, matching .button);
 *   - clear space of at least one quarter of the badge height (12px at 48px)
 *     with no type or graphics inside it, which every container below keeps;
 *   - one badge per layout, subordinate to the main message.
 *
 * The SVG lives at /assets/badges/download-on-the-app-store-black.svg and is a
 * byte-for-byte copy of developer.apple.com/assets/elements/badges/
 * download-on-the-app-store.svg; scripts/check-app-store-badge.js pins its hash.
 *
 * Pages load this file as app-store-badge.css?v=1, which server.js caches as
 * immutable for a year. Any edit here must bump ?v= on every page that loads
 * it; the check pins this file's hash so an edit without a bump fails.
 */
.app-store-badge {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  line-height: 0;
  border-radius: 9px;
  /* Rows that place a button 12px away (/paradigm, /technology) get 16px, above Apple's 12px minimum. */
  margin-inline-end: 4px;
}
/* The services selector outranks clarity-services.css's `.services-app img { width:100% }`,
   which would otherwise squeeze the badge under Apple's 40px minimum. */
.app-store-badge img,
.services-page .services-app .app-store-badge img {
  display: block;
  width: auto;
  height: 48px;
  max-width: none;
}
.app-store-badge:focus-visible {
  outline: 2px solid var(--ink, #0b1220);
  outline-offset: 4px;
}

/* Services: the badge and "Explore Paradigm" sit in one row with 12px+ clear space. */
.services-page .services-app-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 26px;
  margin-top: 22px;
}
.services-page .services-app .services-app-actions .text-link { margin-top: 0; }

/* Paradigm hero: the release note sat 4px under the old button; give the badge its 12px+ clear space. */
.pd-hero-details .pd-actions + .pd-release-note { margin-top: 16px; }