/* Nutridetalle · recursos */
.howto { display: grid; gap: 34px; }
@media (min-width: 1000px) { .howto { grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; } }
.howto__text { display: grid; gap: 14px; }
.howto__text p { color: var(--ink-2); }
.howto__ways { list-style: none; display: grid; gap: 14px; counter-reset: w; }
.howto__ways li { display: grid; grid-template-columns: 46px 1fr; gap: 4px 16px; padding: 20px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); }
.howto__ways .ico { grid-row: span 2; }
.howto__ways h3 { font-size: 17px; }
.howto__ways p { color: var(--mute); font-size: 15.5px; }

.stories { display: grid; gap: 60px; }
.story { display: grid; gap: 26px; align-items: center; }
@media (min-width: 900px) { .story { grid-template-columns: 1.05fr 1fr; gap: 56px; } .story:nth-child(odd) .story__pic { order: 2; } }
.story__pic { aspect-ratio: 3 / 2; }
.story__date { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--sage-ink); background: var(--sage-soft); padding: 4px 12px; border-radius: 6px; margin-bottom: 12px; }
.story h3 { margin-bottom: 12px; font-size: clamp(20px, 0.6vw + 17px, 25px); }
.story p { color: var(--ink-2); }

.lexi__bar { display: none; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 16px; }
.lexi.is-live .lexi__bar { display: flex; }
.lexi__nav { display: flex; gap: 8px; }
.lexi__nav button { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: var(--paper); border: 1px solid var(--line); color: var(--ink); cursor: pointer; }
.lexi__nav button:hover:not(:disabled) { border-color: var(--coral-ink); color: var(--coral-ink); }
.lexi__nav button:disabled { opacity: .4; cursor: default; }
.lexi__nav svg { width: 20px; height: 20px; }
.lexi__pos { margin: 0; font-size: 14px; color: var(--mute); }
.lexi__scroller { overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 16px; scrollbar-width: thin; scrollbar-color: var(--coral) transparent; }
.lexi__scroller dl { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 82%); gap: 18px; }
@media (min-width: 768px) { .lexi__scroller dl { grid-auto-columns: calc((100% - 18px) / 2); } }
@media (min-width: 1100px) { .lexi__scroller dl { grid-auto-columns: calc((100% - 54px) / 4); } }
.term { scroll-snap-align: start; display: grid; gap: 10px; align-content: start; background: var(--paper); border: 1px solid var(--line); border-top: 4px solid var(--sage); border-radius: 6px 6px var(--radius) var(--radius); padding: 24px; }
.term dt { font-family: var(--serif); font-size: 23px; color: var(--ink); }
.term dd { margin: 0; color: var(--mute); font-size: 15.5px; }

.agenda { list-style: none; display: grid; gap: 14px; }
.agenda__item { display: grid; gap: 16px; align-items: center; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 22px; }
@media (min-width: 900px) { .agenda__item { grid-template-columns: 150px 1fr auto; gap: 30px; padding: 24px 28px; } }
.agenda__when { display: grid; gap: 2px; padding: 14px 16px; border-radius: 12px; background: var(--slate); color: var(--on-dark-2); }
.agenda__when b { color: var(--coral-hi); font-size: 19px; line-height: 1.25; }
.agenda__when span { font-size: 14px; }
.agenda__meta { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--sage-ink); font-weight: 600; margin-bottom: 6px; }
.agenda__meta svg { width: 16px; height: 16px; }
.agenda__item h3 { margin-bottom: 6px; }
.agenda__item p { color: var(--mute); }
.agenda__item .cta { justify-self: start; }