
/* Elequi Design System v1 — published Experience homepage.
   Scope intentionally limited to the hero; preserve theme and official assets. */
.hero .hero-copy { min-width: 0; }
.hero .hero-lede { max-width: 62ch; line-height: 1.6; text-wrap: pretty; }
.hero .hero-title { text-wrap: balance; }
.hero .hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin: 24px 0 32px;
}
.hero .hero-actions .btn { min-height: 48px; text-align: center; }
.hero .hero-actions .ios-update-link { line-height: 1.5; }
.hero .product-stage { max-width: 68ch; }
.hero .product-stage p { line-height: 1.6; }
.hero .planner { border-radius: var(--radius-lg); }
.hero .planner :is(input, select, button) { min-height: 44px; }
.hero :is(a, button, input, select):focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}
@media (max-width: 640px) {
  .hero .hero-actions { align-items: stretch; gap: 12px; margin-block: 20px 28px; }
  .hero .hero-actions .btn { width: 100%; }
  .hero .hero-actions .ios-update-link { display: inline-block; padding: 8px 0; }
  .hero .hero-lede { font-size: clamp(1rem, 2.8vw, 1.125rem); }
}
