/* The Nutripure case study: the rules the shared case-study*.css does not cover. Scoped under .cs-nut (data 'class'). */
.cs-nut .tw1-quote img { object-position: 50% 20%; }
.cs-nut .tw1-quote figcaption { flex-wrap: nowrap; }

/* "WhatsApp Us" keeps its icon; from 640px the hero shows it instead of "Send Us a Message" */
.cs-nut [data-hero-wa]::before, .cs-nut .tw1-wa-btn::before { content: ""; flex: none; width: 20px; height: 20px; background: currentColor; -webkit-mask: url("../../img/case-study/nutripure/whatsapp.svg") center / contain no-repeat; mask: url("../../img/case-study/nutripure/whatsapp.svg") center / contain no-repeat; }
.cs-nut .tw1-wa-btn { gap: 8px; }
@media (min-width: 640px) and (max-width: 1023px) { .cs-nut [data-hero-wa] { display: inline-flex; } .cs-nut [data-hero-msg] { display: none; } }

/* the bundle banner inside the second fix box */
.cs-nut .nut-fig { margin: 16px 0 0; max-width: 440px; }
.cs-nut .nut-fig img { display: block; width: 100%; height: auto; border-radius: 10px; border: 1px solid rgba(0, 0, 0, .1); }
.cs-nut .nut-fig figcaption { margin-top: 8px; font-size: 13px; line-height: 1.4; color: rgba(0, 0, 0, .68); }


/* After launch: the "See how we work" link, the closing-card speed-audit link, the timezone text, the "Building something new?" band */
.cs-nut .tw13-after__how .cs-small a { display: inline-block; padding: 12px 0; }
.cs-nut .tw13-more { display: none; }
@media (min-width: 640px) { .cs-nut .tw13-lead { display: none; } .cs-nut .tw13-more { display: inline; } }
.cs-nut .nut-new { grid-column: 1 / -1; display: grid; gap: 18px; border-top: 1px solid rgba(0, 0, 0, .08); padding: 24px 20px; }   /* the same edge as the "how" column above (.tw13-after__how) */
@media (min-width: 768px) { .cs-nut .nut-new { padding: 32px 36px; } }
@media (min-width: 1024px) { .cs-nut .nut-new { padding: 40px; } }
@media (min-width: 1024px) { .cs-nut .nut-new { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px; } }
.cs-nut .nut-routes { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; align-content: start; line-height: 1.5; }
@media (min-width: 1024px) { .cs-nut .nut-routes { padding-top: 30px; } }
.cs-nut .nut-routes li { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: 14px; background: #fff; border: 1px solid rgba(0, 0, 0, .08); font-size: 15px; color: #000; }
.cs-nut .nut-routes .tw7-link { align-self: flex-start; padding: 11px 0; margin: -5px 0; }
