* { box-sizing: border-box; }
body { margin: 0; font-family: 'Montserrat', sans-serif; background: #f4f6f9; color: #1d4261; }

.site-nav { background: #1d4261; color: #fff; }
.nav-inner { max-width: 960px; margin: 0 auto; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; }
.nav-brand { color: #fff; font-weight: 700; text-decoration: none; letter-spacing: .5px; }
.nav-links { list-style: none; display: flex; gap: 16px; align-items: center; margin: 0; padding: 0; }
.nav-links a { color: #fff; text-decoration: none; font-weight: 500; }
.nav-links .nav-cta { border: 1px solid #fff; border-radius: 50px; padding: 6px 14px; }
.nav-links .nav-cta:hover { background: #fff; color: #1d4261; }

.tools-hero { text-align: center; padding: 40px 16px 16px; }
.tools-hero h1 { margin: 0 0 8px; font-size: 28px; font-weight: 900; }
.tools-hero p { margin: 0; color: #4c6a85; }

.tools-main { max-width: 960px; margin: 0 auto; padding: 16px; }
.unsigned-note { background: #fff7e0; border: 1px solid #f0d68a; border-radius: 8px; padding: 10px 14px; font-size: 13px; color: #6b5300; }

.app-section { margin-top: 28px; }
.app-section h2 { margin: 0 0 4px; font-size: 20px; }
.app-section .blurb { margin: 0 0 12px; color: #4c6a85; font-size: 14px; }
.platform-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }

.platform-card { background: #fff; border-radius: 12px; padding: 18px; box-shadow: 0 1px 4px rgba(0,0,0,.08); display: flex; flex-direction: column; gap: 6px; }
.platform-card h3 { margin: 0; font-size: 16px; }
.platform-card h3 i { margin-right: 8px; }
.platform-card .meta { font-size: 13px; color: #4c6a85; }
.platform-card .empty { font-size: 13px; color: #8a9bb0; }

.download-btn, .rollback-btn { display: inline-block; margin-top: 8px; padding: 9px 14px; border-radius: 50px; font: 600 14px 'Montserrat', sans-serif; text-align: center; text-decoration: none; cursor: pointer; }
.download-btn { background: #1d4261; color: #fff; border: 0; }
.download-btn:hover { background: #163248; }
.rollback-btn { background: transparent; color: #b3261e; border: 1px solid #b3261e; }
.rollback-btn:hover { background: #b3261e; color: #fff; }

@media (max-width: 520px) {
  .nav-links { gap: 8px; }
  .tools-hero h1 { font-size: 22px; }
}