/* Shared Health Guide card/media rules. Kept outside the editorial page bundle. */
.hg-card { color: var(--color-care-forest); font-family: var(--font-interface); font-synthesis: none; overflow-wrap: anywhere; list-style: none; }
.hg-card *, .hg-card *::before, .hg-card *::after { box-sizing: border-box; }
.hg-card :is(h3,p) { margin: 0; }
.hg-card h3 { letter-spacing: -.025em; text-wrap: pretty; }
.hg-card > a { color: inherit; text-decoration: none; touch-action: manipulation; }
.hg-card > a:hover { text-decoration: underline; text-underline-offset: .2em; }
.hg-card > a:focus-visible { outline: 3px solid var(--color-care-forest); outline-offset: 4px; }
.hg-photo { display: block; width: 100%; height: auto; object-fit: cover; object-position: 50% 15%; aspect-ratio: 4/3; border-radius: 1.25rem; background: var(--color-primary-surface-soft); }
.hg-photoPending { display: grid; place-items: center; color: var(--color-body-muted); }
.hg-mediaContainer { position: relative; }
.hg-mediaContainer .media-frame { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; aspect-ratio: auto; border-radius: inherit; object-position: inherit; }
.hg-mediaContainer .media-frame img { width: 100%; height: 100%; object-fit: cover; object-position: inherit; border-radius: inherit; }
.hg-category {  line-height: 1.5; font-weight: 600; color: var(--color-coral-on-light); }
.hg-card { min-width: 0; }
.hg-card > a { display: block; height: 100%; }
.hg-cardCopy { display: grid; gap: .75rem; padding-top: 1rem; }
.hg-card h3 { color: var(--color-bloom-ink);  line-height: 1.25; }
.hg-cardSummary {  line-height: 1.56; color: var(--color-body-muted); }
.hg-cardCompact { background: var(--color-paper-white); border: 1px solid var(--color-border-warm); border-radius: 1.25rem; }
.hg-cardCompact .hg-cardCopy { padding: 1rem; }
.hg-card h3 { font: 600 var(--text-xl)/1.25 var(--font-interface); }
.hg-cardCompact h3 { font: 600 var(--text-lg)/1.25 var(--font-interface); }
.hg-category { font: 600 var(--text-sm)/1.5 var(--font-interface); }
.hg-cardSummary { font: 400 var(--text-base)/1.6 var(--font-interface); }

@media (max-width: 820px) {
  .hg-card:not(.hg-cardCompact) > a { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0,2fr); gap: 1.25rem; padding: .625rem; border: 1px solid var(--color-border-warm); background: var(--color-paper-white); border-radius: 1.25rem; }
  .hg-card:not(.hg-cardCompact) .hg-photo { height: 100%; aspect-ratio: 4/3; }
  .hg-card:not(.hg-cardCompact) .hg-cardCopy { padding-block: .5rem; }
}

@media (max-width: 600px) {
  .hg-related .hg-cardCopy { padding: .875rem; }
  .hg-card:not(.hg-cardCompact) > a { grid-template-columns: minmax(0,1fr); padding: 0; gap: 0; }
  .hg-card:not(.hg-cardCompact) .hg-cardCopy { padding: 1rem; }
  .hg-card:not(.hg-cardCompact) .hg-photo { aspect-ratio: 4/3; height: auto; }
}
