/* Preview E — "The welcome". Scoped to body.home-hero. */
body.home-hero .hero .e-hero { grid-template-columns: minmax(0, 44fr) minmax(0, 56fr); gap: clamp(36px, 6vw, 88px); align-items: center; }
body.home-hero .e-hero > * { min-width: 0; }
body.home-hero .e-photo { width: 100%; }
body.home-hero .hero-photo { aspect-ratio: 4 / 5; border: 0; border-radius: 28px; background: var(--sand);
  box-shadow: 0 40px 80px -28px rgba(42,26,16,.28), 0 8px 20px rgba(42,26,16,.07); }
body.home-hero .hero-photo img { object-position: 50% 20%; }
body.home-hero .e-text { display: flex; flex-direction: column; align-items: flex-start; }
body.home-hero .e-hello { font-size: 1.6rem; line-height: 1.1; color: var(--brown); margin: 0 0 6px; }
body.home-hero .e-role { font-size: .82rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--teal-ink); margin: 0 0 18px; line-height: 1.4; }
body.home-hero .hero h1 { margin-bottom: 22px; }
body.home-hero .hero .lede { max-width: 34em; }
body.home-hero .hero-costs { min-height: 44px; display: inline-flex; align-items: center; }

/* one fade/rise for the whole hero, nothing else moves */
body.home-hero .hero .e-hero { animation: e-in .9s var(--ease-out, cubic-bezier(.16,1,.3,1)) both; }
body.home-hero .hero .e-hero *, body.home-hero .hero .hero-photo, body.home-hero .hero-trust, body.home-hero .hero h1, body.home-hero .hero .lede, body.home-hero .hero .btn-row { animation: none; }
@keyframes e-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { body.home-hero .hero .e-hero { animation: none; } }

@media (max-width: 900px) {
  body.home-hero .hero { padding-top: 16px; }
  body.home-hero .hero .e-hero { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  body.home-hero .hero-photo { aspect-ratio: auto; height: 50vh; max-height: 440px; border-radius: 24px; }
  body.home-hero .e-photo { max-width: none; }
  body.home-hero .e-text { align-items: stretch; text-align: center; }
  body.home-hero .e-hello { font-size: 1.5rem; margin-bottom: 2px; }
  body.home-hero .e-role { font-size: .74rem; letter-spacing: .08em; margin-bottom: 10px; }
  body.home-hero .hero h1 { font-size: 2.3rem; line-height: 1.05; margin-bottom: 16px; }
  body.home-hero .hero .btn-row { order: 1; flex-flow: row wrap; justify-content: center; align-items: center; gap: 4px 8px; margin-bottom: 4px; }
  body.home-hero .hero .btn-row .btn:not(.btn--ghost) { width: 100%; flex: 0 0 100%; margin-bottom: 4px; }
  body.home-hero .hero .btn-row .btn--ghost, body.home-hero .hero .btn-row .hero-costs { --btn-bg: transparent; --btn-fg: var(--teal-ink); width: auto; min-height: 44px; padding: 8px 10px; border: 0; box-shadow: none; text-decoration: underline; font-size: .98rem; justify-content: center; }
  body.home-hero .hero .lede { order: 2; display: block; margin: 18px auto 0; font-size: 1.05rem; }
  body.home-hero .hero-trust { order: 3; }
}

/* G = E with the logo-echoing arch */
body.home-hero .hero-photo { border-radius: 400px 400px 28px 28px; border: 7px solid #fff; box-shadow: 0 40px 80px -24px rgba(42,26,16,.28), 0 10px 30px rgba(252,194,45,.16); }
@media (max-width: 900px) {
  body.home-hero .hero-photo { border-radius: 300px 300px 24px 24px; border-width: 5px; height: auto; aspect-ratio: 4 / 5; max-height: 420px; }
  body.home-hero .e-photo { max-width: 300px; margin-inline: auto; }
}