.page-download {
  background-color: #F4F7FB;
  color: #1F2D3D;
  font-family: Arial, sans-serif;
}

.page-download__hero-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 10px; /* Small top padding, body handles --header-offset */
  text-align: center;
  max-width: 1390px;
  margin: 0 auto 40px auto;
  border-radius: 12px;
  overflow: hidden;
  background-color: #FFFFFF;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

.page-download__hero-image {
  width: 100%;
  height: auto;
  max-height: 675px; /* Adjust based on desired aspect ratio */
  object-fit: cover;
}

.page-download__hero-content {
  padding: 40px 20px;
  max-width: 900px;
}

.page-download__hero-title {
  font-size: clamp(2.2rem, 4vw, 3rem);
  font-weight: 700;
  line-height: 1.2;
  color: #000000;
  margin-bottom: 20px;
}

.page-download__hero-description {
  font-size: 1.1rem;
  line-height: 1.6;
  margin-bottom: 30px;
  color: #1F2D3D;
}

.page-download__hero-buttons {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}

.page-download__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 15px 30px;
  border-radius: 8px;
  font-size: 1.1rem;
  font-weight: 600;
  text-decoration: none;
  color: #FFFFFF;
  background: linear-gradient(180deg, #4A8BFF 0%, #2F6BFF 100%);
  transition: background-color 0.3s ease, transform 0.2s ease;
  border: none;
  cursor: pointer;
  min-width: 200px;
}

.page-download__button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(47, 107, 255, 0.4);
}

.page-download__button-icon {
  width: 24px;
  height: 24px;
  margin-right: 10px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.page-download__button--ios .page-download__button-icon {
  background-image: url('data:image/svg+xml;charset=UTF-8,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="white"%3e%3cpath d="M240.2 128.1c-19.4-2.8-39.2-1.3-58.4 4.5C161.7 139.8 141 154.5 124.7 174c-12.8 15.6-24.3 32.7-33.3 51.5c-9.3 19.3-17.8 39.8-22.3 61.9c-4.4 21.6-4.5 44.5 2.1 66c6.5 21.1 19.1 40 37 55.4c17.5 15 38.5 25.5 61.5 30.7c22.6 5.1 46.5 4.1 69-1.8c22.8-6 44.3-17.8 62.6-33.8c18.3-16.1 33-36.8 43.1-60.7c9.9-23.4 15.1-48.9 15.6-74.9c.4-25.5-3.3-50.6-11.2-74c-7.8-23.1-19.7-44.5-35.3-63.5c-15.5-18.7-34.6-35-56.9-48.4c-22.3-13.3-47.5-23.5-74.7-29.8C273.7 127.3 256.9 127.8 240.2 128.1zM286.8 45.4c16.3 16.2 30 35.7 40.5 58.1c10.4 22.4 17.5 47.4 21 73.7c3.4 26.3 3.3 53-1.1 79.1c-4.4 25.6-12.7 50-24.7 73c-12 22.8-27.5 44-46 63.5c-18.4 19.1-40.2 36-64.8 50.4c-24.4 14.1-51.5 25.1-80.6 32.7c-29.2 7.6-59.7 11.1-91 10.3c-27.4-.7-54.6-5.8-80.5-15.1c-25.7-9.2-49.8-22.7-71.8-40.3c-21.6-17.4-41-38.6-57.8-63.1c-16.7-24.3-30.8-51.8-41.8-81.5c-11-29.6-18.6-61.1-22.5-93.5c-3.8-32.3-4.2-65.2-1.2-97.7c3-32.5 10.5-64.3 22.5-95.2c12-30.8 28.2-60.3 48.2-88.3c20-27.9 43.5-54.2 70.3-78.5c26.6-24.1 56.6-46.3 89.4-66.2c32.7-19.8 68.6-37.4 106.9-52.6c38.1-15 78.4-27.3 120.3-36.8C359 13.5 321.6 28.9 286.8 45.4zM256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zm0 464c-114.9 0-208-93.1-208-208S141.1 48 256 48s208 93.1 208 208s-93.1 208-208 208z"/%3e%3c/svg%3e');
}

.page-download__button--android .page-download__button-icon {
  background-image: url('data:image/svg+xml;charset=UTF-8,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="white"%3e%3cpath d="M416 0H96C43 0 0 43 0 96v320c0 53 43 96 96 96h320c53 0 96-43 96-96V96c0-53-43-96-96-96zM320 256H192v-64h128v64zM256 128h-64V64h64v64zM320 384H192v-64h128v64z"/%3e%3c/svg%3e');
}

.page-download__features-section,
.page-download__guide-section,
.page-download__faq-section,
.page-download__cta-section {
  max-width: 1200px;
  margin: 60px auto;
  padding: 0 20px;
}

.page-download__features-title,
.page-download__guide-title,
.page-download__faq-title,
.page-download__cta-title {
  text-align: center;
  font-size: clamp(1.8rem, 3.5vw, 2.5rem);
  color: #000000;
  margin-bottom: 40px;
  font-weight: 700;
}

.page-download__features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
}

.page-download__feature-card {
  background-color: #FFFFFF;
  border-radius: 12px;
  padding: 30px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
  text-align: center;
  transition: transform 0.3s ease;
  border: 1px solid #D6E2FF;
}

.page-download__feature-card:hover {
  transform: translateY(-5px);
}

.page-download__feature-heading {
  font-size: 1.4rem;
  color: #2F6BFF;
  margin-bottom: 15px;
  font-weight: 600;
}

.page-download__feature-text {
  font-size: 1rem;
  line-height: 1.6;
  color: #1F2D3D;
}

.page-download__guide-steps {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 40px;
  margin-bottom: 60px;
  background-color: #FFFFFF;
  padding: 40px;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
  border: 1px solid #D6E2FF;
}

.page-download__guide-steps--android {
  flex-direction: row-reverse; /* Image on left for Android */
}

.page-download__guide-content {
  flex: 1;
  min-width: 300px;
  max-width: 550px;
}

.page-download__guide-subtitle {
  font-size: 1.8rem;
  color: #2F6BFF;
  margin-bottom: 25px;
  font-weight: 600;
}

.page-download__guide-list {
  list-style: none;
  padding: 0;
  margin-bottom: 30px;
}

.page-download__guide-item {
  font-size: 1.1rem;
  line-height: 1.8;
  margin-bottom: 15px;
  position: relative;
  padding-left: 30px;
  color: #1F2D3D;
}

.page-download__guide-item::before {
  content: '✓';
  color: #2F6BFF;
  font-weight: bold;
  position: absolute;
  left: 0;
  top: 0;
}

.page-download__guide-image {
  flex: 1;
  min-width: 200px;
  max-width: 500px;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  object-fit: contain;
}

.page-download__button--download-ios, .page-download__button--download-android {
  margin-top: 20px;
}

.page-download__faq-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 25px;
}

.page-download__faq-item {
  background-color: #FFFFFF;
  border-radius: 12px;
  padding: 25px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  border: 1px solid #D6E2FF;
}

.page-download__faq-question {
  font-size: 1.2rem;
  color: #2F6BFF;
  margin-bottom: 10px;
  font-weight: 600;
}

.page-download__faq-answer {
  font-size: 1rem;
  line-height: 1.6;
  color: #1F2D3D;
}

.page-download__cta-section {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 40px;
  text-align: center;
  background-color: #FFFFFF;
  padding: 50px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
  margin-bottom: 60px;
  border: 1px solid #D6E2FF;
}

.page-download__cta-content {
  flex: 1;
  min-width: 300px;
  max-width: 600px;
}

.page-download__cta-description {
  font-size: 1.1rem;
  line-height: 1.6;
  margin-bottom: 30px;
  color: #1F2D3D;
}

.page-download__cta-image {
  flex: 1;
  min-width: 200px;
  max-width: 400px;
  height: auto;
  border-radius: 8px;
  object-fit: contain;
}

.page-download__button--primary {
  padding: 18px 35px;
  font-size: 1.2rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .page-download__hero-title {
    font-size: clamp(1.8rem, 6vw, 2.5rem);
  }

  .page-download__hero-buttons {
    flex-direction: column;
    gap: 15px;
  }

  .page-download__button {
    width: 100%;
    max-width: 300px;
  }

  .page-download__features-grid,
  .page-download__faq-grid {
    grid-template-columns: 1fr;
  }

  .page-download__guide-steps {
    flex-direction: column;
    padding: 20px;
  }

  .page-download__guide-steps--android {
    flex-direction: column; /* Reset for mobile */
  }

  .page-download__guide-image {
    max-width: 100%;
    width: 100%; /* Ensure images don't overflow */
    height: auto;
    margin-bottom: 20px;
  }

  .page-download__cta-section {
    flex-direction: column;
    padding: 30px;
  }

  .page-download__cta-image {
    max-width: 100%;
    width: 100%; /* Ensure images don't overflow */
    height: auto;
  }

  .page-download__hero-section,
  .page-download__features-section,
  .page-download__guide-section,
  .page-download__faq-section,
  .page-download__cta-section {
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 0;
    padding-right: 0;
  }

  /* Ensure all images within .page-download respect max-width for mobile */
  .page-download img {
    max-width: 100%;
    height: auto;
  }

  .page-download__guide-content, .page-download__cta-content {
    padding: 0 15px;
  }

  .page-download__feature-card, .page-download__faq-item {
    padding: 20px;
  }

  .page-download__features-title,
  .page-download__guide-title,
  .page-download__faq-title,
  .page-download__cta-title {
    margin-bottom: 30px;
  }
}

/* Image CSS with min-size enforcement */
.page-download img {
  min-width: 200px;
  min-height: 200px;
}

/* Specific overrides for smaller image containers if they were to exist, ensure they are at least 200px */
.page-download__button-icon {
  min-width: unset; /* Allow icons to be smaller if they were defined */
  min-height: unset;
}