/* ============================================================
   Home page styles
   ============================================================ */

@layer components {
  .home-hero { padding-block: var(--space-3xl) var(--space-xl); }
  .home-hero h1 { color: var(--color-primary); }

  .home-intro {
    text-align: center;
    margin-block-start: var(--space-xl);
  }
  .home-intro h2 { font-size: var(--fs-h3); }

  .studio-info {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: var(--space-xl);
    box-shadow: var(--shadow-card);
  }
  .studio-info__address {
    font-family: var(--font-heading);
    font-size: var(--fs-h4);
    color: var(--color-primary);
    margin-block-end: var(--space-md);
  }

  .studio-actions { display: flex; gap: var(--space-sm); flex-wrap: wrap; }
}