/*
  Responsive Styles
  Mobile, Tablet, Desktop breakpoints
*/

/* ===== Tablet (max-width: 768px) ===== */
@media (max-width: 768px) {
  .hero-title { font-size: 3.5rem; }
  .card { padding: 3rem 2rem; }
  .card-philosophy { font-size: 1.75rem; }
  .navbar { width: 90%; gap: 1rem; padding: 0.6rem 1.5rem; }

  /* Stack download links earlier on tablets */
  .download-minimalist {
    flex-direction: column;
    align-items: center;
    gap: 4rem;
    margin-top: 8rem;
  }
  .download-item {
    min-width: unset;
    width: 100%;
  }
  .vertical-divider {
    display: none;
  }
  
  .poetic-text {
    font-size: 30px !important;
  }
  .poetic-text .en {
    font-size: 36px !important;
  }
}

/* ===== Mobile (max-width: 480px) ===== */
@media (max-width: 480px) {
  .hero-title { font-size: 2.75rem; }
  .card { padding: 2.5rem 1.5rem; border-radius: var(--radius-md); }
  .card-philosophy { font-size: 1.5rem; }
  .card-desc { font-size: 0.95rem; }
  .navbar a { font-size: 0.75rem; }

  .poetic-text {
    font-size: 26px !important;
  }
  .poetic-text .en {
    font-size: 30px !important;
  }

  /* Ensure download links don't overflow on small phones */
  .download-link {
    width: auto !important;
    max-width: 280px;
    min-width: 200px;
    padding: 0 20px !important;
  }
}