/* Homepage story refresh. Kept separate so article and legal layouts stay intact. */
.homepage-refresh .cloud,
.homepage-refresh .mobile-grass {
  height: auto;
}

.homepage-refresh .hero-panel {
  padding-top: clamp(2.5rem, 6vw, 5rem);
}

.homepage-refresh .hero-title {
  font-size: clamp(2.3rem, 4.1vw, 3.75rem);
  line-height: 1.08;
}

.homepage-refresh .hero-title-main {
  display: block;
}

.homepage-refresh .hero-promise {
  display: grid;
  gap: 0.25rem;
  margin: 1.25rem auto 0;
  color: white;
  font-family: "Crunchi Inter", ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(1.1rem, 2vw, 1.5rem);
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.25;
  text-shadow: none;
}

.homepage-refresh .hero-support-line {
  margin: 1.4rem auto 0;
  font-size: clamp(0.95rem, 1.6vw, 1.2rem);
  font-weight: 600;
  line-height: 1.6;
}

.homepage-refresh .hero-app-preview {
  margin-top: 2rem;
}

.homepage-refresh .hero-after-panel {
  margin-top: 1.4rem;
}

.homepage-refresh .feature-copy h2,
.homepage-refresh .story-copy h2,
.homepage-refresh .faq-intro h2 {
  line-height: 1.06;
}

.homepage-refresh .feature-copy > p {
  font-weight: 600;
  line-height: 1.65;
}

.homepage-refresh .feature-copy {
  container-type: inline-size;
}

.homepage-refresh .feature-copy h2.heading-paired {
  max-width: none;
  font-size: clamp(1.65rem, 10cqw, 3rem);
}

.heading-paired > span {
  display: block;
}

.homepage-refresh .feature-copy .source-link {
  font-size: 0.96rem;
  line-height: 1.6;
}

.homepage-refresh .nourishment-section {
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  overflow: hidden;
}

.homepage-refresh .nourishment-section .section-kicker {
  max-width: 100%;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.nourishment-section .founder-quote {
  padding: clamp(1.6rem, 4vw, 3rem);
  text-align: left;
}

.closing-cta h2 {
  margin: 0;
  font-family: "Recoleta Crunchi", Georgia, serif;
  font-size: clamp(2.3rem, 4.5vw, 3.75rem);
  line-height: 1.08;
}

.homepage-refresh .feature-copy p a {
  color: inherit;
  font-weight: inherit;
}

.homepage-refresh .proof-title {
  max-width: none;
  color: var(--action-yellow);
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1;
}

.homepage-refresh .review-card:nth-child(1),
.homepage-refresh .review-card:nth-child(2) {
  color: var(--ink);
}

.homepage-refresh .review-card:nth-child(1) figcaption,
.homepage-refresh .review-card:nth-child(2) figcaption {
  color: var(--ink);
}

.homepage-refresh .closing-cta {
  overflow: hidden;
  padding: clamp(2rem, 6vw, 4.5rem) 1rem;
  text-align: center;
}

.closing-cta h2 {
  max-width: 40rem;
  margin: 0 auto;
  color: white;
  text-shadow: 0 0.12rem 0.35rem rgba(42, 58, 68, 0.14);
}

.homepage-refresh .faq-intro h2 {
  color: white;
  text-shadow: 0 0.12rem 0.35rem rgba(42, 58, 68, 0.14);
}

.homepage-refresh .faq-intro {
  top: 6rem;
}

/* Playful app-palette accents: carbs orange, hydration/sky blues,
   plant green, polyphenol magenta, and a text shade of protein gold.
   The existing fiber and polyphenol FAQ colors are deliberately preserved. */
.homepage-refresh .faq-list details summary.faq-question-about { color: #e8734f; }
.homepage-refresh .faq-list details summary.faq-question-calories { color: #008f9d; }
.homepage-refresh .faq-list details summary.faq-question-voice { color: #2f78c8; }
.homepage-refresh .faq-list details summary.faq-question-plants { color: #35b875; }
.homepage-refresh .faq-list details summary.faq-question-fiber { color: #6844e8; }
.homepage-refresh .faq-list details summary.faq-question-rainbow { color: #c75b9b; }
.homepage-refresh .faq-list details summary.faq-question-polyphenols { color: #ff6f61; }
.homepage-refresh .faq-list details summary.faq-question-price { color: #d99500; }

.homepage-refresh .faq-list summary:focus-visible {
  outline: 3px solid #4f36b0;
  outline-offset: 4px;
}

.homepage-refresh .faq-list details p {
  font-weight: 500;
}

.homepage-refresh .app-download-button img {
  height: auto;
}

@media (max-width: 1100px) {
  .homepage-refresh .nourishment-section { grid-template-columns: 1fr; }
  .homepage-refresh .faq-intro { position: static; }
}

@media (max-width: 760px) {
  .homepage-refresh .hero-panel { padding: 2rem 1rem 0; }
  .homepage-refresh .hero-title { font-size: clamp(1.8rem, 7vw, 2.65rem); }
  .homepage-refresh .hero-promise { font-size: clamp(1rem, 4vw, 1.25rem); }
  .homepage-refresh .hero-support-line { max-width: 22rem; margin-top: 1rem; }
  .homepage-refresh .hero-app-preview { margin-top: 1.65rem; }
  .homepage-refresh .feature-copy h2 { font-size: clamp(2.3rem, 7.6vw, 3rem); }
}