/* The app's tool pages (/get-the-app/<tool>/) and the hub on /get-the-app/ (src/lib/toolpages.js). */
.crumbs{font:600 13px "Source Sans 3",system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px}
.crumbs a{color:var(--rust);text-decoration:none}.crumbs a:hover{text-decoration:underline}
.thero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:40px;align-items:center}
.thero .tshot{width:100%;max-width:300px;justify-self:center}
.tshot{border-radius:22px;box-shadow:0 22px 44px -20px rgba(29,40,51,.5);display:block;height:auto}
.tshot-wide{width:100%;max-width:880px;margin:0 auto;height:auto;border-radius:10px;border:1px solid var(--rule);box-shadow:0 18px 36px -22px rgba(29,40,51,.45);display:block}
.pbadges{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.pbadge{font:600 13px "Source Sans 3",system-ui,sans-serif;border-radius:999px;padding:4px 11px;letter-spacing:.02em;white-space:nowrap}
.pbadge.std{background:var(--paper-2);color:var(--iron);border:1px solid var(--rule)}
.pbadge.prem{background:var(--glow);color:var(--rust-dark);border:1px solid var(--ember-soft)}
.feats{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-top:20px}
.feats .card h3{font-size:20px;margin:0 0 6px}.feats .card p{margin:0;font-size:16.5px;line-height:1.55}
.feats .card .pbadge{display:inline-block;margin-top:10px}
.strip{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(170px,220px));justify-content:center;margin-top:30px}
.strip figure{margin:0}.strip .tshot{width:100%}.strip figcaption{font:15px/1.4 "Source Sans 3",system-ui,sans-serif;color:var(--muted);margin-top:8px;text-align:center}
.rulebox{border-left:4px solid var(--ember);background:var(--card);border-radius:0 10px 10px 0;padding:18px 22px}
.rulebox ul{margin:10px 0 0;padding-left:1.2em}.rulebox li{margin:.35em 0}
.plans2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
.plans2 .card h3{margin:0 0 8px;font-size:20px}.plans2 ul{margin:0;padding-left:1.15em;font:16.5px/1.55 "Source Sans 3",system-ui,sans-serif}
.plans2 li{margin:.3em 0}.plans2 .prem{border-color:var(--ember-soft);background:#fff8f1}
.works{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-top:16px}
.hubp{margin-top:26px}.hubp h3{font:600 13px "Source Sans 3",system-ui,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--rust);margin:26px 0 10px}
.hubp h3.neighbor{color:var(--iron)}
.hubg{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
a.htool{display:grid;grid-template-columns:64px 1fr;gap:14px;align-items:center;text-decoration:none;color:var(--text);background:var(--card);border:1px solid var(--rule);border-radius:10px;padding:12px}
a.htool:hover{border-color:var(--ember)}a.htool:hover b{color:var(--rust)}
a.htool img{width:64px;height:auto;border-radius:8px;display:block}
a.htool b{display:block;font:600 17px "Source Sans 3",system-ui,sans-serif;color:var(--iron)}
a.htool span{display:block;font:15px/1.4 "Source Sans 3",system-ui,sans-serif;color:var(--muted)}
a.htool .pbadge{display:inline-block;margin-top:6px;font-size:12px;padding:2px 9px}
@media (max-width:720px){.thero{grid-template-columns:1fr}.thero .tshot{max-width:240px}.plans2{grid-template-columns:1fr}}
