/* Page styles for article-nutrition-myths.html — extracted from an inline <style> block so the
   site satisfies CSP style-src-elem 'self' (no inline <style> elements). */
.article-head { padding-block: clamp(2.2rem,5vw,3.5rem) clamp(1.6rem,3vw,2.4rem); }
.article-head h1 { font-size: clamp(2.2rem, 1.2rem + 4vw, 3.8rem); max-width: 22ch; }
.article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin-top: 1.2rem; color: var(--muted); font-weight: 600; font-size: .95rem; }
.article-meta .dot { width: 4px; height: 4px; border-radius: 50%; background: var(--line-strong); }
.article-body { max-width: 70ch; }
.article-body p { color: var(--ink-2); font-size: 1.08rem; line-height: 1.7; margin-top: .9rem; }
.article-body p strong { color: var(--ink); }
.article-callout { border-radius: var(--radius-lg); padding: clamp(1.2rem,3vw,1.7rem);
background: color-mix(in srgb, var(--lime) 14%, var(--surface));
border: 1px solid color-mix(in srgb, var(--lime) 30%, var(--line)); margin-top: 1.4rem; }
.article-callout p { margin-top: .4rem; }
.backlink { display: inline-flex; align-items: center; gap: .45rem; font-weight: 700; color: var(--accent-deep); margin-bottom: 1.2rem; }
.backlink svg { width: 17px; height: 17px; }
.backlink:hover { text-decoration: underline; }
.myth { margin-top: clamp(1.8rem,4vw,2.6rem); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; background: var(--surface); }
.myth-head { padding: 1.1rem 1.3rem; background: color-mix(in srgb, var(--orange) 10%, var(--surface)); border-bottom: 1px solid var(--line); display: flex; gap: .8rem; align-items: baseline; }
.myth-head .tag { font-family:'Archivo'; font-stretch:115%; font-weight:900; text-transform:uppercase; font-size:.8rem; color: var(--orange-deep); flex: none; }
.myth-head h2 { font-size: clamp(1.2rem, 1rem + 1vw, 1.5rem); text-transform: none; font-stretch: 110%; line-height: 1.15; }
.myth-body { padding: .4rem 1.3rem 1.3rem; }
.myth-body .truth { display: inline-block; font-family:'Archivo'; font-stretch:115%; font-weight:900; text-transform:uppercase; font-size:.8rem; color: var(--lime-deep); margin-top: 1rem; }