/* Generated by scripts/george/mobile.mjs from "Case Study SF Nutrition Mobile.dc.html". Do not edit; loaded at 767px and below. */
[data-sec="hero"] { min-height: 100svh !important; }
[data-sec="hero"] > :nth-child(1) > :nth-child(1) { object-position: 55% 60% !important; }
[data-sec="hero"] > :nth-child(1) > :nth-child(2) { background: rgba(10, 12, 16, 0.42) !important; }
[data-sec="hero"] > :nth-child(1) > :nth-child(3) { background: linear-gradient(rgba(10, 12, 16, 0.5) 0%, rgba(10, 12, 16, 0.05) 36%, rgba(1, 16, 56, 0.72) 100%) !important; }
[data-sec="hero"] > :nth-child(3) { max-width: revert !important; margin: revert !important; padding-top: revert !important; width: revert !important; align-items: revert !important; justify-content: flex-end !important; padding: 36px 20px !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(1) { max-width: revert !important; margin: 0px 0px 26px !important; font-size: clamp(2.9rem, 14vw, 4.2rem) !important; line-height: 0.9 !important; text-shadow: rgba(1, 16, 56, 0.5) 0px 2px 24px !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(1) > :nth-child(1) { font-size: 54.6px !important; line-height: 49.14px !important; letter-spacing: -2.457px !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(1) > :nth-child(1) > :nth-child(1) { font-size: 54.6px !important; line-height: 49.14px !important; letter-spacing: -2.457px !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(1) > :nth-child(2) { font-size: 54.6px !important; line-height: 49.14px !important; letter-spacing: -2.457px !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(1) > :nth-child(3) { font-size: 54.6px !important; line-height: 49.14px !important; letter-spacing: -2.457px !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(1) > :nth-child(3) > :nth-child(1) { font-size: 54.6px !important; line-height: 49.14px !important; letter-spacing: -2.457px !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(1) > :nth-child(3) > :nth-child(1) > :nth-child(1) { font-size: 54.6px !important; line-height: 49.14px !important; letter-spacing: -2.457px !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(2) { margin-top: revert !important; padding-top: revert !important; width: revert !important; align-items: revert !important; gap: 8px !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(2) > :nth-child(1) { gap: 6px !important; height: 36px !important; padding: 0px 14px !important; font-size: 12.5px !important; line-height: normal !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(2) > :nth-child(1) > :nth-child(1) { font-size: 12.5px !important; line-height: normal !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(2) > :nth-child(2) { gap: 6px !important; height: 36px !important; padding: 0px 14px !important; font-size: 12.5px !important; line-height: normal !important; text-align: start !important; }
[data-sec="hero"] > :nth-child(3) > :nth-child(2) > :nth-child(2) > :nth-child(1) { font-size: 12.5px !important; line-height: normal !important; text-align: start !important; }
[data-sec="overview"] { padding: revert !important; }
[data-sec="overview"] > :nth-child(1) { max-width: revert !important; margin: revert !important; padding: 48px 20px 52px !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(1) { margin: 0px 0px 28px !important; font-size: var(--fs-section-m) !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) { grid-template-columns: revert !important; display: flex !important; flex-direction: column !important; gap: 24px !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) > :nth-child(1) { padding-top: 16px !important; gap: 10px !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(1) { font-size: 11.5px !important; letter-spacing: 0.14em !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(2) { max-width: revert !important; font-size: 16px !important; line-height: 1.6 !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) > :nth-child(2) { padding-top: 16px !important; gap: 10px !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(1) { font-size: 11.5px !important; letter-spacing: 0.14em !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(2) { max-width: revert !important; font-size: 16px !important; line-height: 1.6 !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) > :nth-child(3) { padding-top: 16px !important; gap: 10px !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) > :nth-child(3) > :nth-child(1) { font-size: 11.5px !important; letter-spacing: 0.14em !important; }
[data-sec="overview"] > :nth-child(1) > :nth-child(2) > :nth-child(3) > :nth-child(2) { max-width: revert !important; font-size: 16px !important; line-height: 1.6 !important; }
[data-sec="challenge"] { padding: revert !important; overflow: revert !important; }
[data-sec="challenge"] > :nth-child(1) { display: revert !important; grid-template-columns: revert !important; gap: revert !important; align-items: revert !important; padding: 48px 20px 52px !important; }
[data-sec="challenge"] > :nth-child(1) > :nth-child(1) { max-width: revert !important; justify-self: revert !important; width: revert !important; padding-left: revert !important; padding-right: revert !important; }
[data-sec="challenge"] > :nth-child(1) > :nth-child(1) > :nth-child(1) { margin: 0px 0px 10px !important; font-size: 11.5px !important; letter-spacing: 0.14em !important; }
[data-sec="challenge"] > :nth-child(1) > :nth-child(1) > :nth-child(2) { margin: 0px 0px 16px !important; font-size: var(--fs-section-m) !important; text-wrap: wrap !important; }
[data-sec="challenge"] > :nth-child(1) > :nth-child(1) > :nth-child(3) { max-width: revert !important; margin: 0px 0px 26px !important; font-size: 15.5px !important; }
[data-sec="challenge"] > :nth-child(1) > :nth-child(2) { margin-left: revert !important; position: revert !important; border-radius: 22px !important; aspect-ratio: 4 / 3 !important; }
[data-sec="services-used"] { padding: revert !important; }
[data-sec="services-used"] > :nth-child(1) { max-width: revert !important; margin: revert !important; padding: 48px 20px 52px !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(1) { margin: revert !important; display: revert !important; align-items: revert !important; justify-content: revert !important; gap: revert !important; flex-wrap: revert !important; margin-bottom: 24px !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(1) > :nth-child(1) { display: contents !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(1) > :nth-child(1) > :nth-child(1) { margin: 0px 0px 10px !important; font-size: 11.5px !important; letter-spacing: 0.14em !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(1) > :nth-child(1) > :nth-child(2) { margin: 0px 0px 14px !important; font-size: var(--fs-section-m) !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(1) > :nth-child(2) { padding-bottom: revert !important; min-height: 44px !important; white-space: normal !important; text-wrap: wrap !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(1) > :nth-child(2) > :nth-child(1) { white-space: normal !important; text-wrap: wrap !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(2) { grid-template-columns: revert !important; display: flex !important; flex-direction: column !important; gap: 12px !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(2) > :nth-child(1) { gap: 34px !important; min-height: 160px !important; padding: 22px !important; border-radius: 22px !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(1) { font-size: 22px !important; }
[data-sec="services-used"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(2) { display: revert !important; flex-direction: revert !important; gap: revert !important; font-weight: 700 !important; margin: 0px !important; font-family: var(--font-display) !important; font-size: 34px !important; letter-spacing: -0.03em !important; line-height: 1 !important; color: var(--bigg-ink) !important; }
[data-sec="related-work"] { padding: revert !important; }
[data-sec="related-work"] > :nth-child(1) { max-width: revert !important; margin: revert !important; padding: 48px 20px 56px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(1) { margin: revert !important; margin-bottom: 24px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(1) > :nth-child(1) { margin: 0px 0px 10px !important; font-size: 11.5px !important; letter-spacing: 0.14em !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(1) > :nth-child(2) { font-size: var(--fs-section-m) !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) { grid-template-columns: revert !important; align-items: revert !important; display: flex !important; flex-direction: column !important; gap: 16px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(1) { border-radius: var(--radius-xl) !important; box-shadow: var(--shadow-md) !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(1) { aspect-ratio: 16 / 10 !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(1) > :nth-child(2) { left: 18px !important; font-size: 13px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(1) > :nth-child(2) > :nth-child(1) { font-size: 13px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(2) { padding: 30px 20px 24px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(2) > :nth-child(1) { font-size: 34px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(2) > :nth-child(2) { font-size: 14.5px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(2) > :nth-child(3) { font-size: 14.5px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(1) > :nth-child(2) > :nth-child(4) { font-size: 11.5px !important; letter-spacing: 0.14em !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(2) { border-radius: var(--radius-xl) !important; box-shadow: var(--shadow-md) !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(1) { aspect-ratio: 16 / 10 !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(1) > :nth-child(2) { left: 18px !important; font-size: 13px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(1) > :nth-child(2) > :nth-child(1) { font-size: 13px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(2) { padding: 30px 20px 24px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(2) > :nth-child(1) { font-size: 34px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(2) > :nth-child(2) { font-size: 14.5px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(2) > :nth-child(3) { font-size: 14.5px !important; }
[data-sec="related-work"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(2) > :nth-child(4) { font-size: 11.5px !important; letter-spacing: 0.14em !important; }
[data-sec="cta"] { border-radius: var(--hp-card-r, 16px) !important; padding-top: calc(2 * var(--hp-card-r, 16px)) !important; }
[data-sec="cta"] > :nth-child(1) { top: calc(2 * var(--hp-card-r, 16px) + 18px) !important; right: 20px !important; width: 44px !important; height: 44px !important; }
[data-sec="cta"] > :nth-child(2) { max-width: revert !important; margin: revert !important; min-height: min(68vh, calc(100svh - 2 * var(--hp-card-r, 16px))) !important; padding: clamp(56px, 10vh, 88px) 20px clamp(48px, 9vh, 80px) !important; }
[data-sec="cta"] > :nth-child(2) > :nth-child(1) { max-width: revert !important; margin: 0px 0px 20px !important; font-size: clamp(38px, 7vh, 48px) !important; letter-spacing: -0.035em !important; line-height: 0.96 !important; }
[data-sec="cta"] > :nth-child(2) > :nth-child(2) { margin: 0px 0px 28px !important; max-width: 34ch !important; font-size: 15px !important; }
[data-sec="cta"] > :nth-child(2) > :nth-child(3) { width: 100% !important; }
[data-sec="cta"] > :nth-child(2) > :nth-child(3) > :nth-child(1) > :nth-child(1) { width: 100% !important; justify-content: center !important; }
[data-sec="footer"] > :nth-child(1) { max-width: revert !important; margin: revert !important; grid-template-columns: revert !important; padding: 44px 20px 32px !important; display: flex !important; flex-direction: column !important; gap: 32px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(1) { grid-column: revert !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(1) > :nth-child(1) { height: 24px !important; margin-bottom: 14px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(1) > :nth-child(2) { max-width: revert !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(2) > :nth-child(1) { margin: 0px 0px 14px !important; font-size: 11.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(2) > :nth-child(2) { gap: 12px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(1) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(2) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(3) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(4) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(5) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(6) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(2) > :nth-child(2) > :nth-child(7) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(3) > :nth-child(1) { margin: 0px 0px 14px !important; font-size: 11.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(3) > :nth-child(2) { gap: 12px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(3) > :nth-child(2) > :nth-child(1) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(3) > :nth-child(2) > :nth-child(2) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(3) > :nth-child(2) > :nth-child(3) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(1) > :nth-child(3) > :nth-child(2) > :nth-child(4) > :nth-child(1) { font-size: 14.5px !important; }
[data-sec="footer"] > :nth-child(2) > :nth-child(1) { max-width: revert !important; margin: revert !important; padding: 18px 20px !important; gap: 10px !important; font-size: 12.5px !important; }
[data-sec="footer"] > :nth-child(2) > :nth-child(1) > :nth-child(1) { font-size: 12.5px !important; }
[data-sec="footer"] > :nth-child(2) > :nth-child(1) > :nth-child(2) { font-size: 12.5px !important; }
[data-sec="footer"] > :nth-child(2) > :nth-child(1) > :nth-child(2) > :nth-child(1) { font-size: 12.5px !important; }
[data-sec="footer"] > :nth-child(2) > :nth-child(1) > :nth-child(2) > :nth-child(2) { font-size: 12.5px !important; }
[data-sec="footer"] > :nth-child(2) > :nth-child(1) > :nth-child(2) > :nth-child(3) { font-size: 12.5px !important; }

/* ---- scripts/george/phone/case-study.css ---- */
/* Case studies at 767px and below: components the mobile files rebuild rather than restyle.
   Values from the "Case Study * Mobile.dc.html" files (22 Oct 2026). Appended to each case study's .m.css. */
/* skip: what-we-did the-results results-bar */

/* Shared for the two sections below: George's phone shell and section heading. */
:is([data-sec="what-we-did"], [data-sec="the-results"]) { padding: 0 !important; }
:is([data-sec="what-we-did"], [data-sec="the-results"]) > div { padding: 48px 20px 52px !important; }
:is([data-sec="what-we-did"], [data-sec="the-results"]) > div > [data-reveal]:first-child { margin: 0 0 26px !important; }
:is([data-sec="what-we-did"], [data-sec="the-results"]) > div > [data-reveal]:first-child p { margin: 0 0 10px !important; font-size: 11.5px !important; letter-spacing: .14em !important; }
:is([data-sec="what-we-did"], [data-sec="the-results"]) h2 { font-size: var(--fs-section-m) !important; }

/* "What we did": each step is one white card; number, title and a muted toggle on the header row, the
   description opening underneath across the full card. */
[data-sec="what-we-did"] [data-reveal] + div { gap: 10px !important; }
[data-sec="what-we-did"] [data-reveal] + div > div {
  grid-template-columns: 44px minmax(0, 1fr) 44px !important; grid-template-areas: "num title tog" "body body body";
  column-gap: 14px !important; row-gap: 0 !important; align-items: center !important;
  padding: 14px 12px; border-radius: 22px; background: #fff;
}
[data-sec="what-we-did"] [data-reveal] + div > div > div:first-child { grid-area: num; align-self: center !important; }
[data-sec="what-we-did"] [data-reveal] + div > div > div:first-child > div[aria-hidden] { display: none !important; }
[data-sec="what-we-did"] [data-reveal] + div > div > div:first-child > div:last-child { width: 44px !important; height: 44px !important; font-size: 13px !important; }
[data-sec="what-we-did"] [data-reveal] + div > div > div:nth-child(2) { display: contents !important; }
[data-sec="what-we-did"] [data-reveal] + div > div > div:nth-child(2) > button { grid-area: title; min-height: 44px !important; padding: 0 !important; border-radius: 0 !important; background: none !important; }
[data-sec="what-we-did"] [data-reveal] + div > div > div:nth-child(2) > button h3 { font-size: 20px !important; line-height: 1.15 !important; }
[data-sec="what-we-did"] [data-reveal] + div > div > div:nth-child(2) > div { grid-area: body; }
[data-sec="what-we-did"] [data-reveal] + div > div > div:nth-child(2) > div p { padding: 12px 8px 8px !important; font-size: 15.5px !important; line-height: 1.65 !important; }
[data-sec="what-we-did"] [data-reveal] + div > div > button { grid-area: tog; width: 44px !important; height: 44px !important; background: var(--surface-muted) !important; }
[data-sec="what-we-did"] [data-reveal] + div > div > button span { font-size: 22px !important; }

/* "The results": numbered timeline, the number and its line on the left, title and copy together on the right. */
[data-sec="the-results"] .cs-timeline { display: flex !important; flex-direction: column; gap: 0 !important; }
[data-sec="the-results"] .cs-timeline > div { display: grid !important; grid-template-columns: 44px minmax(0, 1fr) !important; grid-template-rows: auto 1fr; column-gap: 16px !important; row-gap: 0 !important; }
[data-sec="the-results"] .cs-timeline > div > div:first-child { grid-column: 1; grid-row: 1 / span 2; display: flex !important; flex-direction: column; align-items: center; }
[data-sec="the-results"] .cs-timeline > div > div:first-child > div:first-child { flex: none; width: 44px !important; height: 44px !important; font-size: 13px !important; }
[data-sec="the-results"] .cs-timeline > div > div:first-child > div:nth-child(2) { flex: 1 !important; width: 1.5px !important; height: auto !important; min-height: 20px; margin: 0 !important; position: static !important; }
[data-sec="the-results"] .cs-timeline > div > div:first-child > span { display: none !important; }
[data-sec="the-results"] .cs-timeline h3 { grid-column: 2; margin: 0 0 10px !important; padding-top: 8px; font-size: 20px !important; line-height: 1.2 !important; }
[data-sec="the-results"] .cs-timeline p { grid-column: 2; margin: 0 !important; padding-bottom: 30px; font-family: var(--font-body) !important; font-size: 15px !important; line-height: 1.65 !important; color: var(--text-muted) !important; max-width: none !important; }
[data-sec="the-results"] .cs-timeline + div { margin-top: 12px !important; display: flex !important; flex-direction: column; gap: 10px !important; }
[data-sec="the-results"] .cs-timeline + div a { width: 100%; justify-content: center; }

/* Hero: the "Case study · Client" chip is desktop only. */
[data-sec="hero"] div:has(> span[aria-hidden] + span):not(:has(a)) { display: none !important; }

/* "Want similar results?" panel under the results: a rounded panel, not a pill, with one arrow. */
[data-sec="the-results"] .cs-timeline + div > a:first-child { flex: none !important; gap: 16px !important; padding: 20px 24px !important; border-radius: var(--radius-xl) !important; }
[data-sec="the-results"] .cs-timeline + div > a:first-child p { font-size: 15px !important; }
[data-sec="the-results"] .cs-timeline + div > a:first-child > span > span:not(:first-child) { display: none !important; }
[data-sec="the-results"] .cs-timeline + div > a:last-child { flex: none !important; min-height: 52px; }

/* Stats strip: the cards stack, each on its own colour. */
[data-sec="results-bar"] > div { padding: 48px 20px !important; }
[data-sec="results-bar"] .cs-stats { display: flex !important; flex-direction: column; gap: 12px !important; }
[data-sec="results-bar"] .cs-stats > div { min-height: 0 !important; padding: 24px 22px !important; border-radius: 22px !important; gap: 18px !important; }
[data-sec="results-bar"] .cs-stats > div > p:first-child { font-size: 56px !important; line-height: 1 !important; }
[data-sec="results-bar"] .cs-stats > div > p:last-child { font-size: 15px !important; line-height: 1.4 !important; }