/* Shared app-page presentation; keep store artwork in its original proportions. */
.app-stores { container-type: inline-size; }
.app-page .hero-app .hero-app-copy .app-stores,
.keelai-page .app-stores {
 display:flex; flex-direction:row; flex-wrap:wrap; align-items:center;
 justify-content:center; gap:10px; max-width:340px; margin:0 auto;
 padding:0 0 14px;
}
.app-stores .app-store-link {
 display:flex; flex:0 0 auto; align-items:center; justify-content:center;
 height:40px; min-height:40px; padding:0; border:0; border-radius:6px;
 background:transparent; box-shadow:none; line-height:0;
}
.app-stores .app-store-link::before { content:none; }
.app-stores .app-store-badge { display:block; width:auto; height:40px; max-width:none; }
.app-stores .app-store-badge-hi { height:41px; margin:-.5px 0; }
.app-stores .app-store-link:focus-visible { outline:3px solid var(--accent2,#056092); outline-offset:4px; }
/* When two badges cannot fit, equally wide touch targets retain undistorted artwork. */
@container (max-width:271px) {
 .app-stores .app-store-link { width:100%; flex-basis:100%; background:#000; }
}
.app-page .hero-app .hero-app-media { background:transparent; }
.app-page .hero-app .hero-mascot { filter:none; background:transparent; object-fit:contain; }
@media (max-width:779px) {
 .app-page .hero-app .hero-app-media { top:14px; width:72px; }
 .app-page .hero-app .hero-mascot { width:72px; max-height:86px; }
 .app-page .hero-app .hero-app-copy h1 { padding-inline-end:84px; }
}
@media (min-width:780px) {
 .app-page .hero-app .hero-mascot { width:180px; max-height:210px; }
}
.keelai-page .k-product-links { flex-wrap:wrap; }
.keelai-page .k-product-links .app-stores { width:100%; padding:0; }
.keelai-page .k-product-links .app-store-link { padding:0; border:0; }
@media (max-width:560px) {
 .app-page .topbar-menu .brand, .keelai-page .topbar-menu .brand { min-width:0; flex:1; }
 .app-page .topbar-menu .brand .wordmark, .keelai-page .topbar-menu .brand .wordmark { white-space:normal; font-size:11px; line-height:1.2; }
 .app-page .topbar-menu .topnav, .keelai-page .topbar-menu .topnav { flex-shrink:0; }
 .app-page .topbar-menu .langmenu>summary, .keelai-page .topbar-menu .langmenu>summary { white-space:nowrap; }
}

.app-page .fabrikator-hero .cta-row { flex-wrap:wrap; }
.app-page .fabrikator-hero .cta-row > .app-stores { flex:0 0 100%; width:100%; max-width:none; }
@media (max-width:779px) { .app-page .hero-app.fabrikator-hero .hero-app-copy h1 { padding-inline-end:0; } }

@media (max-width:779px) { .app-page .fabrikator-hero .cta-row > .app-stores { flex:0 0 auto; max-width:340px; } }
