/* ============================================
   Page-specific styles
   Kept minimal - most styles belong in components.css
   ============================================ */

/* Homepage: adjust hero spacing and sizing on larger screens */
@media (min-width: 768px) {
  .hero {
    padding-top: calc(var(--spacing-section) * 1.5);
    padding-bottom: calc(var(--spacing-section) * 1.5);
  }

  .hero-logo {
    width: 200px;
    height: 200px;
  }

  .hero-title {
    font-size: var(--font-size-h1);
  }

  .hero-tagline {
    font-size: 1.25rem;
  }
}