/* Simple Healthy Meals — scoped styles, sharing the site's typography and navigation. */
.meals-page { --meals-green: #254a37; --meals-sage: #e8ede3; --meals-cream: #f7f5f0; --meals-terra: #98664e; }
.meals-page main { color: #34372f; }
.meals-page main h1, .meals-page main h2, .meals-page main h3 { color: var(--meals-green); }
.meals-page main h1 { font-size: clamp(2.6rem, 4.4vw, 4.1rem); line-height: 1.08; }
.meals-page main h2 { font-size: clamp(2rem, 3.5vw, 3rem); line-height: 1.14; margin-bottom: 1.4rem; text-wrap: balance; }
.meals-page main h3 { font-size: 1.55rem; line-height: 1.2; margin-bottom: .75rem; }
.meals-page main p:last-child { margin-bottom: 0; }
.meals-page main figure { margin: 0; }
.meals-page main img { width: 100%; height: auto; border-radius: 12px; }
.meals-page main :focus-visible { outline: 3px solid var(--meals-terra); outline-offset: 5px; }
.meals-page main .eyebrow { color: var(--meals-green); letter-spacing: .14em; font-size: .78rem; }
.meals-section { padding-block: clamp(3rem, 7vw, 5.5rem); }
.meals-surface { background: var(--color-surface); }
.meals-sage { background: var(--meals-sage); }
.meals-hero { padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.meals-hero__grid { display: grid; gap: 2.5rem; align-items: center; }
.meals-hero__grid > *, .meals-planner-grid > * { min-width: 0; }
.meals-lede { margin-top: 1.5rem; font-size: 1.1rem; line-height: 1.65; }
.meals-support { font-size: .94rem; color: #555e50; }
.meals-hero__visual { border-radius: 12px; box-shadow: 0 12px 35px #254a370b; }
.meals-action { margin-top: 1.8rem; }
.meals-page .meals-cta { min-height: 54px; max-width: 100%; padding: 1rem 1.25rem; border: 1px solid var(--meals-green); border-radius: 5px; background: var(--meals-green); color: #fffdf9; font-size: .81rem; line-height: 1.5; letter-spacing: .065em; text-align: center; }
.meals-page .meals-cta:hover { background: #163824; border-color: #163824; color: white; }
.meals-reassurance { margin: .8rem 0 0; font-size: .83rem; color: #58604f; }
.meals-intro { max-width: 760px; margin-inline: auto; }
.meals-categories { padding: 1rem 0; border-block: 1px solid var(--color-line); font-size: .95rem; line-height: 1.9; font-weight: 600; color: var(--meals-green); }
.meals-recipes { margin-top: 3rem; }
.meals-page .meals-recipes > h2 { font-size: 2rem; }
.meals-recipe-grid { display: grid; gap: 2.5rem 1.5rem; }
.meals-recipe img { margin-bottom: 1.2rem; }
.meals-page .meals-recipe h3 { font-size: 1.5rem; }
.meals-recipe p { font-size: .94rem; color: #59604f; }
.meals-page .meals-promo { max-width: 760px; margin: 3rem auto 0; }
#recipe-collection + .meals-recipes { margin-top: 3rem; }
.meals-recipes ~ .meals-action, .meals-promo + .meals-action { text-align: center; }
.meals-planner-grid { display: grid; gap: 2rem; }
.meals-planner-card { border: 1px solid #d3dccf; border-radius: 12px; padding: clamp(1.4rem, 3vw, 2.4rem); background: var(--color-surface); }
.meals-checklist { list-style: none; padding: 0; margin: 1.5rem 0; }
.meals-checklist li { position: relative; padding-left: 1.65rem; margin: 0 0 1rem; }
.meals-checklist li::before { content: '✓'; position: absolute; left: 0; color: var(--meals-green); font-weight: 700; }
.meals-prep-grid { display: grid; gap: 2rem; margin-top: 2.5rem; }
.meals-prep-grid > div { padding-top: 1.4rem; border-top: 2px solid #c8d1c1; }
.meals-note { max-width: 760px; margin: 2rem auto 0; }
.meals-files { list-style: none; padding: 0; margin: 2rem auto 0; max-width: 760px; }
.meals-files li { padding-block: 1.4rem; border-bottom: 1px solid var(--color-line); }
.meals-page .meals-files h3 { font-size: 1.45rem; }
.meals-steps { display: grid; gap: 1.8rem; list-style: none; padding: 0; margin-block: 2.5rem; }
.meals-steps li { border-top: 2px solid #b99a84; padding-top: 1.2rem; }
.meals-steps p { font-size: .96rem; }
.meals-offer { max-width: 850px; margin-inline: auto; padding: clamp(1.5rem, 5vw, 3.5rem); border: 1px solid #cbd6c5; border-radius: 16px; background: var(--meals-sage); text-align: center; }
.meals-offer ul { list-style: none; padding: 0; margin: 1.5rem 0; }
.meals-offer li { margin: .4rem 0; }
.meals-price { font-family: var(--font-display); color: var(--meals-green); font-size: 4.5rem; line-height: 1.1; margin: 1.5rem 0 0; }
.meals-faq { margin-top: 2rem; border-top: 1px solid var(--color-line); }
.meals-faq details { border-bottom: 1px solid var(--color-line); }
.meals-faq summary { padding: 1.3rem 1.6rem 1.3rem 0; cursor: pointer; font-weight: 600; color: var(--meals-green); line-height: 1.5; }
.meals-faq details > div { padding-bottom: 1.3rem; }
.meals-faq details[open] summary { margin-bottom: .3rem; }
.meals-final { background: #edf0e8; text-align: center; }
.meals-final-lines { font-size: 1.1rem; line-height: 1.9; }
@media (min-width: 540px) { .meals-recipe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .meals-prep-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 820px) {
  .meals-hero__grid { grid-template-columns: 1fr 1fr; gap: clamp(2rem, 4vw, 4rem); }
  .meals-recipe-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .meals-planner-grid { grid-template-columns: .85fr 1.15fr; gap: 4rem; align-items: center; }
  .meals-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; }
  .meals-prep-grid { gap: 2rem 3rem; max-width: 950px; margin-inline: auto; }
}
@media (max-width: 539px) { .meals-cta { width: 100%; } .meals-page main h1 { font-size: clamp(2.4rem, 9vw, 3.1rem); } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .meals-page * { transition: none; } }
