/* ============ download.css ============ */
.dl-hero { background: var(--color-gradient-hero); padding-block: var(--space-16); text-align: center; position: relative; overflow: hidden; }
.dl-hero h1 { font-size: clamp(2.1rem, 6vw, 2.75rem); }
.dl-hero p { max-width: 56ch; margin: var(--space-4) auto 0; }

.dl-main { display: grid; gap: var(--space-12); align-items: center; }
@media (min-width: 900px) { .dl-main { grid-template-columns: 0.9fr 1.1fr; } }
.dl-phone { display: flex; justify-content: center; }
.dl-phone img { max-width: 300px; border-radius: var(--radius-xl); border: 1px solid var(--color-border); box-shadow: var(--shadow-glow); }
.dl-platforms { display: grid; gap: var(--space-6); }
.platform-card { background: var(--color-bg-secondary); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-6); }
.platform-card h3 { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); }
.platform-card .badges { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.app-meta { display: flex; flex-wrap: wrap; gap: var(--space-6); margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--color-border); }
.app-meta div .k { font-size: var(--text-xs); color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.1em; }
.app-meta div .v { font-family: var(--font-display); font-weight: 600; color: var(--color-accent-gold); }

.install-steps { display: grid; gap: var(--space-4); counter-reset: istep; }
.install-step { display: flex; gap: var(--space-4); align-items: flex-start; background: var(--color-bg-secondary); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-4) var(--space-6); }
.install-step .n { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background: var(--color-gradient-gold); color: #0a0a0f; font-family: var(--font-display); font-weight: 700; border-radius: var(--radius-md); }
.install-step h4 { font-size: var(--text-lg); margin-bottom: var(--space-1); }
.install-step p { font-size: var(--text-sm); margin: 0; }

.req-table { width: 100%; border-collapse: collapse; overflow: hidden; border-radius: var(--radius-md); border: 1px solid var(--color-border); }
.req-table th, .req-table td { padding: var(--space-3) var(--space-4); text-align: left; font-size: var(--text-sm); border-bottom: 1px solid var(--color-border); }
.req-table th { background: var(--color-bg-tertiary); font-family: var(--font-display); color: var(--color-text-primary); }
.req-table td { color: var(--color-text-secondary); }
.req-table tr:last-child td { border-bottom: 0; }
.table-scroll { overflow-x: auto; }

.dl-features { display: grid; gap: var(--space-4); grid-template-columns: 1fr; }
@media (min-width: 640px) { .dl-features { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px){ .dl-features { grid-template-columns: repeat(3,1fr); } }
.dl-feature { display: flex; gap: var(--space-3); align-items: flex-start; background: var(--color-bg-secondary); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-4); }
.dl-feature .ic { font-size: 1.6rem; }
.dl-feature p { font-size: var(--text-sm); margin: 0; }