/* Extra rules for application pages. Copy into css/ (or merge into cosy.css). */
.crumb{font-size:.85rem;color:var(--muted);margin:0 0 1em}
.app-hero{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.app-hero svg,.app-icon svg{width:120px;height:120px;flex:none;border-radius:18px}
.app-hero>div{flex:1 1 320px}
.lead{font-size:1.08rem;color:var(--muted)}
.uses li{margin:.5em 0}
.btnrow{display:flex;flex-wrap:wrap;gap:12px;margin:1.2em 0}
.page a.btn{display:inline-block;padding:11px 20px;border-radius:8px;background:var(--brand);color:#fff;font-weight:600;text-decoration:none}
.page a.btn:hover{background:#13417a;color:#fff}
.page a.btn.yt{background:#c4302b}.page a.btn.eb{background:#0b5fd6}
.hubgrid{columns:3 220px;list-style:none;padding:0}
.hubgrid li{margin:.3em 0;break-inside:avoid}
.app-icon{margin:-.5em 0 .5em}