/* ============================================================
   download.css — APK download guide
   ============================================================ */

.dl-hero { position: relative; overflow: hidden; padding-block: clamp(2rem, 5vw, 3.4rem) clamp(2rem, 5vw, 3.4rem); }
.dl-hero__grid { display: grid; gap: clamp(2rem, 5vw, 3rem); align-items: center; }
.dl-hero__copy { max-width: 620px; }
.dl-meta { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 1.4rem 0; }
.dl-meta__item {
  display: flex; flex-direction: column; padding: 0.7rem 1rem; border-radius: var(--radius);
  background: var(--color-surface); border: 1px solid var(--border); min-width: 92px;
}
.dl-meta__item b { color: var(--color-gold-bright); font-family: var(--font-display); font-size: 1.15rem; }
.dl-meta__item span { font-size: 0.72rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.08em; }

/* requirements table */
.req-table { width: 100%; border-collapse: collapse; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border); }
.req-table caption { text-align: left; font-family: var(--font-display); font-size: var(--fs-h3); margin-bottom: 1rem; color: var(--text-primary); caption-side: top; }
.req-table th, .req-table td { padding: 0.95rem 1.1rem; text-align: left; border-bottom: 1px solid var(--border); font-size: 0.94rem; }
.req-table th { background: rgba(13,42,32,0.7); color: var(--color-gold-bright); font-weight: 700; width: 40%; }
.req-table td { color: var(--text-secondary); }
.req-table tr:last-child th, .req-table tr:last-child td { border-bottom: 0; }
.req-table tbody tr:hover td, .req-table tbody tr:hover th { background: rgba(20,122,124,0.08); }

/* download safety callout */
.dl-callout {
  display: flex; gap: 1rem; padding: 1.3rem 1.5rem; border-radius: var(--radius);
  background: linear-gradient(100deg, rgba(20,122,124,0.14), rgba(13,42,32,0.4)); border: 1px solid var(--border-strong);
}
.dl-callout svg { width: 28px; height: 28px; color: var(--color-emerald-bright); flex-shrink: 0; }
.dl-callout h3 { font-size: 1.05rem; color: var(--text-primary); margin-bottom: 0.3rem; }
.dl-callout p { font-size: 0.92rem; margin: 0; }

@media (min-width: 992px) {
  .dl-hero__grid { grid-template-columns: 1.1fr 0.9fr; }
  .dl-split { display: grid; grid-template-columns: 1fr 1fr; gap: 2.6rem; align-items: start; }
}