.download-hero { padding: 120px 0 80px; background: var(--color-primary); color: #fff; min-height: 80vh; display: flex; align-items: center; }
.download-hero-inner { display: flex; align-items: center; gap: 60px; }
.download-text { flex: 1; }
.download-text h1 { font-size: 3.2rem; margin-bottom: 20px; }
.rating-display { font-size: 1.8rem; color: var(--color-secondary); margin: 10px 0 20px; }
.install-note { margin-top: 12px; opacity: 0.7; }
.phone-mockup { font-size: 12rem; flex: 1; text-align: center; background: #222; border-radius: 40px; padding: 20px; min-height: 400px; display: flex; align-items: center; justify-content: center; }

.screenshots { padding: 60px 0; background: var(--color-bg-light); text-align: center; }
.carousel-container { position: relative; overflow: hidden; max-width: 800px; margin: 30px auto; }
.carousel-track { display: flex; transition: transform 0.5s; }
.slide { min-width: 100%; padding: 40px; background: #fff; border-radius: 12px; font-size: 1.5rem; font-weight: 600; box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
.carousel-btn { position: absolute; top: 50%; transform: translateY(-50%); background: var(--color-primary); color: #fff; border: none; width: 44px; height: 44px; border-radius: 50%; font-size: 1.8rem; cursor: pointer; }
.carousel-btn.prev { left: 10px; }
.carousel-btn.next { right: 10px; }

.features-grid-section { padding: 60px 0; background: #fff; text-align: center; }
.features-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 30px; }
.feature-item { background: var(--color-bg-light); padding: 20px; border-radius: 12px; font-weight: 500; }

.how-to-install { padding: 60px 0; background: var(--color-bg-light); text-align: center; }
.install-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 30px; }
.install-step { background: #fff; padding: 30px 20px; border-radius: 12px; font-weight: 600; }
.step-num { display: inline-block; background: var(--color-secondary); color: #fff; width: 36px; height: 36px; border-radius: 50%; line-height: 36px; margin-bottom: 10px; }

.qr-section { padding: 60px 0; background: var(--color-primary); color: #fff; text-align: center; }
.qr-container { max-width: 300px; margin: 30px auto; }
.qr-placeholder { background: #fff; padding: 40px; border-radius: 12px; font-size: 1.2rem; color: #333; }

@media (max-width: 768px) {
  .download-hero-inner { flex-direction: column; text-align: center; }
  .download-text h1 { font-size: 2.2rem; }
  .phone-mockup { font-size: 8rem; min-height: 250px; }
  .features-grid { grid-template-columns: 1fr 1fr; }
  .install-steps { grid-template-columns: 1fr 1fr; }
}