/* Hapkido Australia — mobile responsiveness.
   The website components are inline-styled (the design's desktop look), so these
   rules use class hooks + !important to override inline styles at small widths.
   Desktop (> 860px) renders exactly as authored. */

/* --- Header: hamburger shown only on small screens --- */
.ha-menu-btn { display: none; }
.ha-mobile-menu { display: none; }

/* Nav collapses well before the layout grids: eight links + a button need a lot
   of room, so switch to the hamburger below the design's 1120px content width to
   avoid the desktop nav overflowing at mid widths. */
@media (max-width: 1120px) {
  .ha-nav { display: none !important; }
  .ha-menu-btn { display: inline-flex !important; }
  .ha-mobile-menu.is-open { display: flex !important; }
}

/* --- Layout + typography for phones/small tablets --- */
@media (max-width: 768px) {
  /* Tighten the generous 48px side gutters everywhere. */
  .ha-section { padding-left: 20px !important; padding-right: 20px !important; }

  /* Hero: smaller display title, less towering top padding, stacked buttons. */
  .ha-hero { padding: 56px 20px 52px !important; }
  .ha-hero-title { font-size: 38px !important; }
  .ha-hero-actions { flex-direction: column !important; align-items: stretch !important; }
  .ha-hero-actions > * { width: 100%; }

  /* Multi-column card grids collapse to a single column. */
  .ha-grid-3 { grid-template-columns: 1fr !important; }

  /* Membership: pitch + form stack; paired fields become one per row. */
  .ha-form-wrap { grid-template-columns: 1fr !important; gap: 40px !important; }
  .ha-form-pitch { position: static !important; }
  .ha-form-grid { grid-template-columns: 1fr !important; }
  .ha-card-pad { padding: 24px !important; }

  /* Section display headings scale down. */
  .ha-h1 { font-size: 32px !important; line-height: 1.14 !important; }
  .ha-h2 { font-size: 27px !important; line-height: 1.16 !important; }

  /* Events: date + details on top, Register drops to its own full row. */
  .ha-event-row { grid-template-columns: 64px 1fr !important; gap: 16px !important; }
  .ha-event-action { grid-column: 1 / -1 !important; justify-self: start !important; }

  /* Footer lineage: allow the long "Korea Hapkido Federation / Sung Moo Kwan"
     label to wrap instead of overflowing the viewport. */
  nav[aria-label="Lineage"] span { white-space: normal !important; }
}

/* Guard: never leave the mobile dropdown visible on desktop widths
   (e.g. if it was opened on mobile and the window was widened). */
@media (min-width: 1121px) {
  .ha-mobile-menu { display: none !important; }
}
