/* Grow'n Go — Home (front-page) section styles.
   Ported from the inline <style> in the design system's ui_kits/website/index.html.
   Scoped to Home-only sections (hero, trust badges, parent-quote band); enqueued
   on the front page only. All values reference the design tokens. */

/* ---- Hero ---- */
.hero { position: relative; overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: 0;
  background:
    radial-gradient(60% 70% at 88% 6%, var(--sun-100) 0%, transparent 55%),
    radial-gradient(50% 60% at 4% 96%, var(--mint-50) 0%, transparent 60%); }
.hero__inner { position: relative; z-index: 1; max-width: var(--container-max); margin-inline: auto;
  padding: var(--space-8) var(--gutter) var(--space-10); display: grid; grid-template-columns: 1fr; gap: var(--space-8); align-items: center; }
.hero__copy { display: flex; flex-direction: column; gap: var(--space-5); max-width: 36ch; }
.hero__title { margin: 0; font-size: clamp(2.5rem, 7vw, var(--text-4xl)); line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight); color: var(--text-strong); }
.hero__title .accent { color: var(--brand-primary-strong); }
.hero__lead { margin: 0; }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.hero__trust { display: flex; flex-wrap: wrap; gap: var(--space-5) var(--space-6); margin-top: var(--space-2); }
.trust { display: flex; align-items: center; gap: var(--space-3); }
.trust__icon { width: 42px; height: 42px; border-radius: var(--radius-md); display: grid; place-items: center; font-size: 1.4rem; flex-shrink: 0; }
.trust__icon--coral { background: var(--coral-100); color: var(--coral-600); }
.trust__icon--mint  { background: var(--mint-100);  color: var(--mint-600); }
.trust__icon--sun   { background: var(--sun-100);   color: var(--sun-500); }
.trust__label { display: flex; flex-direction: column; line-height: 1.25; }
.trust__label b { font-family: var(--font-display); font-size: var(--text-md); color: var(--text-strong); font-weight: var(--weight-semibold); white-space: nowrap; }
.trust__label span { font-size: var(--text-sm); color: var(--text-muted); }
.hero__media { position: relative; }
.hero__media .gg-imgph { aspect-ratio: 5 / 6; box-shadow: var(--shadow-lg); }
.hero__float { position: absolute; left: -8px; bottom: 22px; background: var(--surface-card);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); padding: var(--space-3) var(--space-4);
  display: flex; align-items: center; gap: var(--space-3); border: 1px solid var(--border-subtle); max-width: 230px; }
.hero__float .dot { width: 38px; height: 38px; border-radius: var(--radius-pill); background: var(--mint-100);
  color: var(--mint-600); display: grid; place-items: center; font-size: 1.25rem; flex-shrink: 0; }
.hero__float b { display: block; font-family: var(--font-display); font-weight: var(--weight-semibold); color: var(--text-strong); font-size: var(--text-md); line-height: 1.2; }
.hero__float span { font-size: var(--text-sm); color: var(--text-muted); }
@media (min-width: 768px) { .hero__inner { padding-block: var(--space-10) var(--space-12); } }
@media (min-width: 960px) {
  .hero__inner { grid-template-columns: 1.05fr 0.95fr; gap: var(--space-10); }
  .hero__copy { max-width: none; }
  .hero__title { font-size: var(--text-4xl); }
}

/* ---- Parent quote band ---- */
.quoteband { background: var(--ink-900); color: var(--cream); }
.quoteband__inner { max-width: var(--container-narrow); margin-inline: auto; padding: var(--space-10) var(--gutter); text-align: center; display: flex; flex-direction: column; gap: var(--space-5); align-items: center; }
.quoteband__stars { color: var(--sun-300); font-size: 1.4rem; letter-spacing: 4px; }
.quoteband blockquote { margin: 0; font-family: var(--font-display); font-weight: var(--weight-medium); font-size: clamp(1.5rem, 3.5vw, var(--text-2xl)); line-height: var(--leading-snug); color: var(--cream); }
.quoteband cite { font-style: normal; color: var(--sand-300); font-size: var(--text-md); }
