/* Editorial imagery is decorative; the dark base remains readable without it. */
.card.image-card{position:relative;isolation:isolate;overflow:hidden;background:#171c28;color:#fff;min-height:360px;display:flex;flex-direction:column;align-items:flex-start;padding:32px}
.image-card:before{content:'';position:absolute;inset:0;z-index:-2;background-image:var(--editorial-image);background-size:cover;background-position:var(--editorial-position,center);pointer-events:none}
.image-card:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(12,18,30,.87),rgba(12,18,30,.70) 58%,rgba(12,18,30,.58));pointer-events:none}
.image-card.body-editorial{--editorial-image:url('./assets/body-editorial.webp');--editorial-position:66% 42%}
.image-card.longevity-editorial{--editorial-image:url('./assets/longevity-editorial.webp');--editorial-position:62% center}
.image-card h2{font-size:clamp(2.25rem,3vw,3rem);line-height:1.12;margin:18px 0;max-width:16ch;color:#fff}
.image-card p,.image-card .overline,.image-card .text-button{color:#fff}
.image-card p{max-width:32ch;margin-bottom:24px}
.image-card .btn{margin-top:auto;background:#fff;color:#22283a;border:1px solid #fff;min-height:52px}
.image-card .text-button{margin-top:auto;text-align:left;text-decoration-thickness:1px}
.editorial-symbol{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid #ffffff70;border-radius:16px;margin-bottom:18px;background:#ffffff12;color:#fff}
.editorial-symbol .health-icon{width:28px;height:28px}
#navigation a[aria-current=page]>.health-icon{animation:health-icon-select 360ms cubic-bezier(.22,1,.36,1)}
@keyframes health-icon-select{0%{transform:translateY(3px) scale(.92)}60%{transform:translateY(-1px) scale(1.06)}100%{transform:none}}
.toast .health-icon[data-health-icon=check] path{stroke-dasharray:1;stroke-dashoffset:0;animation:health-check-draw 380ms ease-out}
@keyframes health-check-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@media(max-width:760px){.card.image-card{padding:28px;min-height:380px}.image-card:after{background:linear-gradient(100deg,rgba(12,18,30,.88),rgba(12,18,30,.72))}.image-card.body-editorial{--editorial-position:58% center}}
@media(prefers-reduced-motion:reduce){#navigation a[aria-current=page]>.health-icon,.toast .health-icon[data-health-icon=check] path{animation:none!important}}