/* Store badges (2026-11-05; the founder: "We should have app download links in website! should be clear and visible."). Four bricks on /, /fr and /es:
   W1-05 the app bar under the header on phones and tablets, W0-13 under the pictures (both badges, and on computers the QR to cleartrill.ai/get;
   the founder, 2026-11-05: "logos, with a QR, directly under pictures"; it replaced W2-09 under the hero's buttons), W20-04 and W20-05 in Get the app. The badges are Apple’s and Google’s own artwork (assets/store/badge-appstore.png, assets/store/badge-googleplay.png), never redrawn or recoloured. store-badges.js
   puts the phone's own store first, and alone in the app bar. Delete this file, store-badges.js and the four bricks and nothing else changes. */
.store-badges{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.store-badges a{display:inline-block;line-height:0;border-radius:8px}
.store-badges a[hidden]{display:none}
.store-badges a:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
.store-badges img{display:block;height:48px;width:auto}
@media (max-width:640px){.store-badges img{height:40px}}   /* two badges side by side on a phone */
.get-app .store-badges{margin-top:18px}
.app-bar{display:none}
.store-qr{display:none}
@media (max-width:900px){
  .app-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;padding-top:10px;padding-bottom:10px;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
  .app-bar p{margin:0;font-weight:600;font-size:17px;color:var(--ink)}
  .app-bar .store-badges{gap:8px}
  .app-bar .store-badges img{height:40px}
}
@media (min-width:901px){
  .store-qr{display:flex;align-items:center;gap:14px;margin:18px 0 0;color:var(--muted)}
  .store-qr img{width:112px;height:112px;flex:none}
}
/* W0-13, the stores under the pictures: one centred row, the two badges and (on computers) the QR with four words */
.bn-stores{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 28px;padding:16px 0 6px}
.bn-stores .store-badges{justify-content:center}
.bn-qr{display:none}
@media (min-width:901px){
  .bn-qr{display:flex;align-items:center;gap:12px;margin:0;color:var(--muted);font-size:15px}
  .bn-qr img{width:96px;height:96px;flex:none}
}
