/* --- Atarim tasks, 11 Aug --- */

/* Task: make this text white (x3) — What I Do card headings */
section[data-screen-label="What I do"] h3 {
  color: #ffffff !important;
}

/* Task: less space under the nav bar before content begins */
section[data-screen-label="Hero"] {
  padding-top: 64px !important;
}

/* Task: less gap after the newsletter form before the footer */
section[data-screen-label="Newsletter"] {
  padding-bottom: 90px !important;
}

/* --- Atarim tasks, 15 Aug --- */

/* Task (15 Aug, reworked 17 Oct): "A Few Feeds I've Made Famous" hover.
   The whole card (image + coloured label) lifts 6px and grows 4%, eased,
   with no drop shadow. The images themselves no longer scale, so the
   Atarim / StellarWP / Web Agency Summit labels stay on top. Transitions are
   forced on because the home page switches most transitions off, which is
   what made the old hover jump. Off on touch, small screens and reduced
   motion. */
section[data-screen-label="Feeds band"] img,
section[data-screen-label="Feeds band"] img:hover {
  transform: none !important;
  position: static !important;
  z-index: auto !important;
}
section[data-screen-label="Feeds band"] .zm-feed-card > div {
  z-index: 2 !important;
}
div[data-screen-label="Home"] section[data-screen-label="Feeds band"] .zm-feed-card > a,
div[data-screen-label="Home"] section[data-screen-label="Feeds band"] .zm-feed-card:hover > a {
  box-shadow: none !important;
}
@media (hover: hover) and (min-width: 821px) {
  div[data-screen-label="Home"] section[data-screen-label="Feeds band"] .zm-feed-card {
    transition: transform 380ms cubic-bezier(.2,.7,.2,1) !important;
    will-change: transform;
  }
  div[data-screen-label="Home"] section[data-screen-label="Feeds band"] .zm-feed-card:hover {
    transform: translateY(-6px) scale(1.04) !important;
    z-index: 3;
  }
}
@media (prefers-reduced-motion: reduce) {
  div[data-screen-label="Home"] section[data-screen-label="Feeds band"] .zm-feed-card,
  div[data-screen-label="Home"] section[data-screen-label="Feeds band"] .zm-feed-card:hover {
    transition: none !important;
    transform: none !important;
  }
}

/* --- Atarim tasks, 22 Aug --- */

/* Task: footer was too tall — hide the "QUICK LINKS" heading and run the
   link list in two columns. Column 2 of the footer grid is the quick links. */
footer#contact > div > div:nth-child(2) > *:first-child {
  display: none !important;
}
footer#contact > div > div:nth-child(2) ul {
  column-count: 2;
  column-gap: 36px;
  margin: 0;
  padding: 0;
  list-style: none;
}
footer#contact > div > div:nth-child(2) ul li {
  break-inside: avoid;
}
@media (max-width: 820px) {
  footer#contact > div > div:nth-child(2) ul {
    column-count: 2;
    column-gap: 20px;
  }
}

/* --- Atarim tasks, 23 Aug --- */

/* ===================== HOME ===================== */

@media (max-width: 820px) {

  /* Task: remove the faint hairline sitting above the mobile hero. */
  section[data-screen-label="Hero mobile"] > div:first-child {
    display: none !important;
  }

  /* Task: 20px less space above the hero headline. */
  div[data-screen-label="Home"] section[data-screen-label="Hero mobile"] {
    padding-top: 25px !important;
  }

  /* Task: hide "You Handle the Spreadsheets. I'll Get The Eyeballs."
     and the three navy cards under it. Mobile only — desktop keeps them. */
  section[data-screen-label="What I do"] {
    display: none !important;
  }

  /* Task: left-anchor the "over 30 clients since 2016" line. */
  section[data-screen-label="Proof bento"] div:has(> .zm-phone-pair) > div {
    align-items: flex-start !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  section[data-screen-label="Proof bento"] div:has(> .zm-phone-pair) > div > div {
    align-self: flex-start !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
  }
}

/* Task: run the blue "A Few Feeds I've Made Famous" band edge to edge. */
section[data-screen-label="Feeds band"] {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* ============== PORTFOLIO / CASE STUDY PAGES ============== */

@media (max-width: 820px) {
  section[data-screen-label="Intro"]:has(+ section[data-screen-label="Results"]) > div:last-child {
    margin-bottom: -100px !important;
    position: relative !important;
    z-index: 3 !important;
  }
  section[data-screen-label="Intro"]:has(+ section[data-screen-label="Results"]) > div:last-child img {
    height: 200px !important;
  }
  section[data-screen-label="Intro"]:has(+ section[data-screen-label="Results"]) > div:first-child {
    padding-bottom: 24px !important;
  }
  section[data-screen-label="Intro"] + section[data-screen-label="Results"] {
    padding-top: 124px !important;
  }
}

/* Strategy section, tablet widths (821-999px): text and stats stack side by
   side as tight as the row allows, wrapping below if needed. */
@media (min-width: 821px) {
  section[data-screen-label="Strategy"] {
    justify-content: center !important;
    column-gap: 36px !important;
  }
  section[data-screen-label="Strategy"] > div:first-child {
    max-width: 600px !important;
  }
  section[data-screen-label="Strategy"] > .zm-ba-stack {
    margin-left: 0 !important;
  }
}

/* Task, 16 Oct: Strategy section on all case studies. Text takes the left
   half of the content width, the 2024/2025 stat images sit in the right
   half. Two equal grid columns inside the same 1080px content edge the rest
   of the page uses. The stack is a fixed 470px box with absolutely
   positioned cards, so it needs an explicit width once it is a grid item. */
@media (min-width: 1000px) {
  section[data-screen-label="Strategy"] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: 64px !important;
    align-items: center !important;
  }
  section[data-screen-label="Strategy"] > div:first-child {
    max-width: none !important;
    min-width: 0 !important;
    width: 100% !important;
  }
  section[data-screen-label="Strategy"] > .zm-ba-stack {
    width: 470px !important;
    margin-left: 0 !important;
    justify-self: center !important;
  }
}

/* Task, 16 Oct: too much white space under "Book a Call" on case studies.
   Bottom padding 150px -> 72px; the two lower floating marks move down with
   it so they still sit beside the button. */
div[data-screen-label$="Case Study"] section[data-screen-label="CTA"] {
  padding-bottom: 72px !important;
}
@media (min-width: 821px) {
  div[data-screen-label$="Case Study"] section[data-screen-label="CTA"] > .zm-svc-mark:nth-of-type(3),
  div[data-screen-label$="Case Study"] section[data-screen-label="CTA"] > .zm-svc-mark:nth-of-type(4) {
    bottom: 40px !important;
  }
}

/* ============== SERVICE PAGES ============== */

/* Task, 16 Oct: too much space under "Let's Get Started." at the bottom of
   Social Media, Graphic Design, and Content Strategy. The Stats band is the
   last section on each; trim its bottom padding and the button's margin. */
section[data-screen-label="Stats"]:last-child {
  padding-bottom: 56px !important;
}
section[data-screen-label="Stats"]:last-child > a:last-child {
  margin-bottom: 0 !important;
}
@media (min-width: 821px) {
  section[data-screen-label="Stats"]:last-child > .zm-svc-mark:nth-of-type(5),
  section[data-screen-label="Stats"]:last-child > .zm-svc-mark:nth-of-type(6) {
    bottom: 44px !important;
  }
}

/* Task, 17 Oct: reviews match on every page (Services, Portfolio, About Me).
   One shared desktop layout for the three review bands, using the Services
   page as the reference: quote column width, portrait sizes and positions,
   Sheilah nudged ~75px right, Stephanie sitting on the band floor, and no
   gap between the last review and the footer. Andrew's quote sits in
   the right ~45% (40% on narrower screens) so it never runs over his photo. Overrides each page's own
   inline values and its smaller-desktop portrait caps. */
@media (min-width: 821px) {
  section[data-screen-label="Testimonials"] > .zm-review-band .zm-review-copy > div {
    width: 66% !important;
    max-width: none !important;
    min-width: 280px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: content-box !important;
  }
  section[data-screen-label="Testimonials"] > .zm-review-band .zm-review-copy > .zm-review-copy-right {
    width: 45% !important;
    min-width: 0 !important;
    padding-left: 0 !important;
  }
  section[data-screen-label="Testimonials"] > .zm-review-band:nth-child(1) > .zm-review-photo {
    right: -160px !important; left: auto !important;
    width: 72% !important; max-width: 720px !important; height: 100% !important;
  }
  section[data-screen-label="Testimonials"] > .zm-review-band:nth-child(2) > .zm-review-photo {
    left: 0 !important; right: auto !important;
    width: 50% !important; max-width: 500px !important; height: 80% !important;
  }
  section[data-screen-label="Testimonials"] > .zm-review-band:nth-child(3) > .zm-review-photo {
    right: -40px !important; left: auto !important;
    width: 62.5% !important; max-width: 625px !important; height: 100% !important;
  }
  section[data-screen-label="Testimonials"] > .zm-review-band:nth-child(3) > .zm-review-photo > img {
    object-fit: contain !important;
    object-position: center bottom !important;
  }
  section[data-screen-label="Testimonials"]:has(> .zm-review-band) {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }
  div[data-screen-label]:has(> section[data-screen-label="Testimonials"] > .zm-review-band),
  body:has(.zm-review-band) :is(main, .site-main, #primary, #content, .site-content, .content-area, article, .entry-content, .page-content):has(.zm-review-band) {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }
  body:has(.zm-review-band) #zm-content + *,
  body:has(.zm-review-band) :is(footer, .site-footer, #colophon, .zm-footer) {
    margin-top: 0 !important;
  }
}
@media (min-width: 821px) and (max-width: 1099px) {
  section[data-screen-label="Testimonials"] > .zm-review-band .zm-review-copy > .zm-review-copy-right {
    width: 40% !important;
  }
}
@media (min-width: 1240px) {
  section[data-screen-label="Testimonials"] > .zm-review-band:nth-child(1) > .zm-review-photo { right: calc(50% - 530px) !important; }
  section[data-screen-label="Testimonials"] > .zm-review-band:nth-child(2) > .zm-review-photo { left: calc(50% - 540px) !important; }
  section[data-screen-label="Testimonials"] > .zm-review-band:nth-child(3) > .zm-review-photo { right: calc(50% - 500px) !important; }
}

/* Task, 16 Oct: restore the blue, red, and green grid backgrounds behind
   the laptops on the three Social Media package cards. */
#zm-content div[data-screen-label="Social Media"] .zm-svc-grid div.zm-art-1 {
  background-color: #1877BD !important;
}
#zm-content div[data-screen-label="Social Media"] .zm-svc-grid div.zm-art-2 {
  background-color: #FE5E5E !important;
}
#zm-content div[data-screen-label="Social Media"] .zm-svc-grid div.zm-art-3 {
  background-color: #01C063 !important;
}

/* ============== DEVICE ILLUSTRATIONS (16 Oct) ============== */

/* Social Media package cards and Services cards. Each colored header hides
   its old PNG and shows an animated SVG scene on ::after, sized wider than
   the panel so the devices break past its edges. Screens have slightly
   rounded corners; animations live inside each SVG and stop for reduced
   motion. Hover gives the scene a gentle grow.
   Social Media: phone + like/comment bubbles; laptop + phone;
   monitor + laptop + phone.
   Services: phone + stats card + like/follower pills; tablet with a poster
   assembling + pencil + four-dot palette chip; laptop with a blog post typing in +
   email card on its right edge. */
div[data-screen-label="Social Media"] .zm-svc-grid div[style*="height: 170px"] {
  height: auto !important;
  aspect-ratio: 220 / 140;
}
div[data-screen-label="Social Media"] .zm-svc-grid div[style*="height: 170px"] > img {
  display: none !important;
}
div[data-screen-label="Social Media"] .zm-svc-grid div[style*="height: 170px"]::after {
  content: "";
  position: absolute;
  left: -2.18%;
  width: 104.36%;
  bottom: -14px;
  aspect-ratio: 280 / 215;
  background: no-repeat center / 100% 100%;
  transform: translateY(6.98%);
  transform-origin: 50% 80%;
  transition: transform 260ms cubic-bezier(.2,.7,.2,1);
  pointer-events: none;
  z-index: 2;
}
div[data-screen-label="Social Media"] .zm-svc-grid > div:hover div[style*="height: 170px"]::after {
  transform: translateY(6.98%) scale(1.03);
}
@media (prefers-reduced-motion: reduce) {
  div[data-screen-label="Social Media"] .zm-svc-grid div[style*="height: 170px"]::after { transition: none; }
  div[data-screen-label="Social Media"] .zm-svc-grid > div:hover div[style*="height: 170px"]::after { transform: translateY(6.98%); }
}
div[data-screen-label="Social Media"] .zm-svc-grid div[style*="height: 170px"] + div {
  padding-top: 32px !important;
}
#zm-content div[data-screen-label="Social Media"] .zm-svc-grid div.zm-art-1::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-30 -30 280 215' style='color:%231877BD'%3E%3Cstyle%3E.fs{animation:fs 7s cubic-bezier(.65,0,.25,1) infinite}@keyframes fs{0%25,38%25{transform:translateY(0)}50%25,88%25{transform:translateY(-72px)}100%25{transform:translateY(-144px)}}.ts{animation:ts 8s cubic-bezier(.65,0,.25,1) infinite}@keyframes ts{0%25,38%25{transform:translateX(0)}50%25,88%25{transform:translateX(-64px)}100%25{transform:translateX(-128px)}}.b{transform-box:fill-box;transform-origin:50%25 100%25;animation:b 5s cubic-bezier(.3,.7,.3,1) infinite}@keyframes b{0%25{transform:scaleY(.2)}30%25,82%25{transform:scaleY(1)}100%25{transform:scaleY(.2)}}.ln{stroke-dasharray:44;animation:ln 5s ease-in-out infinite}@keyframes ln{0%25{stroke-dashoffset:44}30%25,82%25{stroke-dashoffset:0}100%25{stroke-dashoffset:44}}.fl{animation:fl 4.5s ease-in-out infinite}@keyframes fl{0%25,100%25{transform:translateY(0)}50%25{transform:translateY(-5px)}}.hp{transform-box:fill-box;transform-origin:50%25 60%25;animation:hp 2.4s ease-in-out infinite}@keyframes hp{0%25,60%25,100%25{transform:scale(1)}70%25{transform:scale(1.35)}80%25{transform:scale(.95)}}.lv{animation:lv 1.6s ease-in-out infinite}@keyframes lv{0%25,100%25{opacity:1}50%25{opacity:.25}}@media (prefers-reduced-motion:reduce){*{animation:none!important}}%3C/style%3E%3Cg transform='rotate(-7 110 90)'%3E%3Crect x='64' y='-14' width='92' height='184' rx='15' fill='%232F343C' stroke='%23fff' stroke-width='8' paint-order='stroke'/%3E%3CclipPath id='rc0'%3E%3Crect x='70.44' y='-6.64' width='79.12' height='169.28' rx='5.5'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23rc0)'%3E%3Csvg x='70.44' y='-6.64' width='79.12' height='169.28' viewBox='0 0 100 214' preserveAspectRatio='xMidYMin slice'%3E%3Crect width='100' height='214' fill='%23fff'/%3E%3Cdefs%3E%3Cg id='pa'%3E%3Ccircle cx='13' cy='9' r='6' fill='%23DDE3EA'/%3E%3Crect x='23' y='5' width='34' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='23' y='11' width='20' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Crect x='6' y='20' width='88' height='38' rx='4' fill='currentColor' opacity='.26'/%3E%3Crect x='14' y='44' width='34' height='6' rx='3' fill='%23fff' opacity='.8'/%3E%3Cpath d='M8 63c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3Crect x='21' y='64' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3C/g%3E%3Cg id='pb'%3E%3Ccircle cx='13' cy='9' r='6' fill='%23DDE3EA'/%3E%3Crect x='23' y='5' width='34' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='23' y='11' width='20' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Crect x='6' y='20' width='88' height='38' rx='4' fill='currentColor' opacity='.45'/%3E%3Ccircle cx='50' cy='39' r='9' fill='currentColor' opacity='.5'/%3E%3Cpath d='M8 63c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3Crect x='21' y='64' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3C/g%3E%3C/defs%3E%3Cg class='fs' style='animation-delay:0s'%3E%3Cuse href='%23pa' y='18'/%3E%3Cuse href='%23pb' y='90'/%3E%3Cuse href='%23pa' y='162'/%3E%3Cuse href='%23pb' y='234'/%3E%3Cuse href='%23pa' y='306'/%3E%3Cuse href='%23pb' y='378'/%3E%3Cuse href='%23pa' y='450'/%3E%3C/g%3E%3Crect width='100' height='14' fill='%23fff'/%3E%3Crect x='34' y='5' width='32' height='5' rx='2.5' fill='%23DDE3EA'/%3E%3C/svg%3E%3C/g%3E%3Crect x='95.28' y='-10.78' width='29.44' height='5.98' rx='2.76' fill='%232F343C'/%3E%3C/g%3E%3Cg class='fl' style='animation-delay:-1.2s'%3E%3Cg transform='translate(-14 44)'%3E%3Crect width='54' height='26' rx='13' fill='%23fff'/%3E%3Cg class='hp' style='animation-delay:-1.2s'%3E%3Cpath d='M11 10.5c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='%23FE5E5E'/%3E%3C/g%3E%3Crect x='27' y='11' width='18' height='4.5' rx='2.2' fill='%233E3E3E' opacity='.6'/%3E%3C/g%3E%3C/g%3E%3Cg class='fl' style='animation-delay:-2.6s'%3E%3Cg transform='translate(176 96)'%3E%3Crect width='50' height='26' rx='13' fill='%23fff'/%3E%3Cpath d='M10 8h13a3 3 0 013 3v5a3 3 0 01-3 3h-8l-5 3.5V19a3 3 0 01-2-3v-5a3 3 0 012-3z' fill='%231877BD'/%3E%3Crect x='30' y='11' width='12' height='4.5' rx='2.2' fill='%233E3E3E' opacity='.6'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
#zm-content div[data-screen-label="Social Media"] .zm-svc-grid div.zm-art-2::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-30 -30 280 215' style='color:%23FE5E5E'%3E%3Cstyle%3E.fs{animation:fs 7s cubic-bezier(.65,0,.25,1) infinite}@keyframes fs{0%25,38%25{transform:translateY(0)}50%25,88%25{transform:translateY(-72px)}100%25{transform:translateY(-144px)}}.ts{animation:ts 8s cubic-bezier(.65,0,.25,1) infinite}@keyframes ts{0%25,38%25{transform:translateX(0)}50%25,88%25{transform:translateX(-64px)}100%25{transform:translateX(-128px)}}.b{transform-box:fill-box;transform-origin:50%25 100%25;animation:b 5s cubic-bezier(.3,.7,.3,1) infinite}@keyframes b{0%25{transform:scaleY(.2)}30%25,82%25{transform:scaleY(1)}100%25{transform:scaleY(.2)}}.ln{stroke-dasharray:44;animation:ln 5s ease-in-out infinite}@keyframes ln{0%25{stroke-dashoffset:44}30%25,82%25{stroke-dashoffset:0}100%25{stroke-dashoffset:44}}.fl{animation:fl 4.5s ease-in-out infinite}@keyframes fl{0%25,100%25{transform:translateY(0)}50%25{transform:translateY(-5px)}}.hp{transform-box:fill-box;transform-origin:50%25 60%25;animation:hp 2.4s ease-in-out infinite}@keyframes hp{0%25,60%25,100%25{transform:scale(1)}70%25{transform:scale(1.35)}80%25{transform:scale(.95)}}.lv{animation:lv 1.6s ease-in-out infinite}@keyframes lv{0%25,100%25{opacity:1}50%25{opacity:.25}}@media (prefers-reduced-motion:reduce){*{animation:none!important}}%3C/style%3E%3Crect x='4' y='22' width='168' height='114' rx='7' fill='%232F343C' stroke='%23fff' stroke-width='8' paint-order='stroke'/%3E%3CclipPath id='rc0'%3E%3Crect x='11.56' y='29.56' width='152.88' height='98.88' rx='6.9'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23rc0)'%3E%3Csvg x='11.559999999999999' y='29.56' width='152.88' height='98.88' viewBox='0 0 200 129' preserveAspectRatio='xMidYMin slice'%3E%3Crect width='200' height='129' fill='%23fff'/%3E%3Cdefs%3E%3Cg id='ta'%3E%3Crect x='8' y='22' width='56' height='98' rx='4' fill='%23fff' stroke='%23E3E8EE'/%3E%3Crect x='12' y='26' width='48' height='46' rx='3' fill='currentColor' opacity='.26'/%3E%3Crect x='12' y='80' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='12' y='87' width='28' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Cpath d='M12 101c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3C/g%3E%3Cg id='tb'%3E%3Crect x='8' y='22' width='56' height='98' rx='4' fill='%23fff' stroke='%23E3E8EE'/%3E%3Crect x='12' y='26' width='48' height='46' rx='3' fill='currentColor' opacity='.45'/%3E%3Crect x='12' y='80' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='12' y='87' width='28' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Cpath d='M12 101c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3C/g%3E%3C/defs%3E%3Cg class='ts' style='animation-delay:0s'%3E%3Cuse href='%23ta' x='0'/%3E%3Cuse href='%23tb' x='64'/%3E%3Cuse href='%23ta' x='128'/%3E%3Cuse href='%23tb' x='192'/%3E%3Cuse href='%23ta' x='256'/%3E%3Cuse href='%23tb' x='320'/%3E%3C/g%3E%3Crect width='200' height='14' fill='%23F1F4F8'/%3E%3Ccircle cx='8' cy='7' r='2.2' fill='%23FE5E5E'/%3E%3Ccircle cx='15' cy='7' r='2.2' fill='%23FFDE59'/%3E%3Ccircle cx='22' cy='7' r='2.2' fill='%2301C063'/%3E%3Crect x='70' y='4.5' width='60' height='5' rx='2.5' fill='%23fff'/%3E%3C/svg%3E%3C/g%3E%3Cpath d='M-11.12 136h198.23999999999998l-9.2 14.8H-1.9z' fill='%23E4E8EE' stroke='%23fff' stroke-width='8' stroke-linejoin='round' paint-order='stroke'/%3E%3Cpath d='M-11.12 136h198.23999999999998l-9.2 14.8H-1.9z' fill='none' stroke='%23B9C2CD'/%3E%3Crect x='67.8' y='137' width='40.3' height='4' rx='2' fill='%23C7CFD9'/%3E%3Cg transform='rotate(8 192 100)'%3E%3Crect x='160' y='34' width='66' height='132' rx='11' fill='%232F343C' stroke='%23fff' stroke-width='8' paint-order='stroke'/%3E%3CclipPath id='rc1'%3E%3Crect x='164.62' y='39.28' width='56.76' height='121.44' rx='4.0'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23rc1)'%3E%3Csvg x='164.62' y='39.28' width='56.76' height='121.44' viewBox='0 0 100 214' preserveAspectRatio='xMidYMin slice'%3E%3Crect width='100' height='214' fill='%23fff'/%3E%3Cdefs%3E%3Cg id='pa'%3E%3Ccircle cx='13' cy='9' r='6' fill='%23DDE3EA'/%3E%3Crect x='23' y='5' width='34' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='23' y='11' width='20' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Crect x='6' y='20' width='88' height='38' rx='4' fill='currentColor' opacity='.26'/%3E%3Crect x='14' y='44' width='34' height='6' rx='3' fill='%23fff' opacity='.8'/%3E%3Cpath d='M8 63c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3Crect x='21' y='64' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3C/g%3E%3Cg id='pb'%3E%3Ccircle cx='13' cy='9' r='6' fill='%23DDE3EA'/%3E%3Crect x='23' y='5' width='34' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='23' y='11' width='20' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Crect x='6' y='20' width='88' height='38' rx='4' fill='currentColor' opacity='.45'/%3E%3Ccircle cx='50' cy='39' r='9' fill='currentColor' opacity='.5'/%3E%3Cpath d='M8 63c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3Crect x='21' y='64' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3C/g%3E%3C/defs%3E%3Cg class='fs' style='animation-delay:-3s'%3E%3Cuse href='%23pa' y='18'/%3E%3Cuse href='%23pb' y='90'/%3E%3Cuse href='%23pa' y='162'/%3E%3Cuse href='%23pb' y='234'/%3E%3Cuse href='%23pa' y='306'/%3E%3Cuse href='%23pb' y='378'/%3E%3Cuse href='%23pa' y='450'/%3E%3C/g%3E%3Crect width='100' height='14' fill='%23fff'/%3E%3Crect x='34' y='5' width='32' height='5' rx='2.5' fill='%23DDE3EA'/%3E%3C/svg%3E%3C/g%3E%3Crect x='182.44' y='36.31' width='21.12' height='4.29' rx='1.98' fill='%232F343C'/%3E%3C/g%3E%3C/svg%3E"); }
#zm-content div[data-screen-label="Social Media"] .zm-svc-grid div.zm-art-3::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-30 -30 280 215' style='color:%2301C063'%3E%3Cstyle%3E.fs{animation:fs 7s cubic-bezier(.65,0,.25,1) infinite}@keyframes fs{0%25,38%25{transform:translateY(0)}50%25,88%25{transform:translateY(-72px)}100%25{transform:translateY(-144px)}}.ts{animation:ts 8s cubic-bezier(.65,0,.25,1) infinite}@keyframes ts{0%25,38%25{transform:translateX(0)}50%25,88%25{transform:translateX(-64px)}100%25{transform:translateX(-128px)}}.b{transform-box:fill-box;transform-origin:50%25 100%25;animation:b 5s cubic-bezier(.3,.7,.3,1) infinite}@keyframes b{0%25{transform:scaleY(.2)}30%25,82%25{transform:scaleY(1)}100%25{transform:scaleY(.2)}}.ln{stroke-dasharray:44;animation:ln 5s ease-in-out infinite}@keyframes ln{0%25{stroke-dashoffset:44}30%25,82%25{stroke-dashoffset:0}100%25{stroke-dashoffset:44}}.fl{animation:fl 4.5s ease-in-out infinite}@keyframes fl{0%25,100%25{transform:translateY(0)}50%25{transform:translateY(-5px)}}.hp{transform-box:fill-box;transform-origin:50%25 60%25;animation:hp 2.4s ease-in-out infinite}@keyframes hp{0%25,60%25,100%25{transform:scale(1)}70%25{transform:scale(1.35)}80%25{transform:scale(.95)}}.lv{animation:lv 1.6s ease-in-out infinite}@keyframes lv{0%25,100%25{opacity:1}50%25{opacity:.25}}@media (prefers-reduced-motion:reduce){*{animation:none!important}}%3C/style%3E%3Cpath d='M100 124h26l4 22h-34z' fill='%23D5DCE5' stroke='%23fff' stroke-width='8' stroke-linejoin='round' paint-order='stroke'/%3E%3Crect x='82' y='144' width='62' height='8' rx='4' fill='%23D5DCE5' stroke='%23fff' stroke-width='8' paint-order='stroke'/%3E%3Crect x='40' y='-12' width='146' height='136' rx='8' fill='%232F343C' stroke='%23fff' stroke-width='9' paint-order='stroke'/%3E%3CclipPath id='rc0'%3E%3Crect x='47.00' y='-5.00' width='132.00' height='122.00' rx='8.0'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23rc0)'%3E%3Csvg x='47' y='-5' width='132' height='122' viewBox='0 0 220 203' preserveAspectRatio='xMidYMin slice'%3E%3Crect width='220' height='203' fill='%23fff'/%3E%3Crect width='34' height='200' fill='%23F1F4F8'/%3E%3Cg fill='%23D5DCE5'%3E%3Crect x='8' y='10' width='18' height='18' rx='4'/%3E%3Crect x='8' y='38' width='18' height='3.5' rx='1.7'/%3E%3Crect x='8' y='48' width='14' height='3.5' rx='1.7'/%3E%3Crect x='8' y='58' width='18' height='3.5' rx='1.7'/%3E%3C/g%3E%3Cg fill='%23fff' stroke='%23E3E8EE'%3E%3Crect x='42' y='9' width='80' height='30' rx='4'/%3E%3Crect x='130' y='9' width='82' height='30' rx='4'/%3E%3Crect x='42' y='46' width='170' height='104' rx='4'/%3E%3C/g%3E%3Crect x='49' y='15' width='30' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='49' y='23' width='42' height='9' rx='2' fill='currentColor'/%3E%3Ccircle class='lv' cx='113' cy='17' r='2.5' fill='currentColor'/%3E%3Crect x='137' y='15' width='30' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='137' y='23' width='30' height='9' rx='2' fill='%233E3E3E' opacity='.75'/%3E%3Cpath class='ln' d='M176 32l8-9 7 5 12-13' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Crect x='48' y='52' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect class='b' style='animation-delay:0.00s' x='54' y='122' width='12' height='18' rx='2' fill='currentColor' opacity='0.30'/%3E%3Crect class='b' style='animation-delay:0.12s' x='74' y='112' width='12' height='28' rx='2' fill='currentColor' opacity='0.40'/%3E%3Crect class='b' style='animation-delay:0.24s' x='94' y='118' width='12' height='22' rx='2' fill='currentColor' opacity='0.50'/%3E%3Crect class='b' style='animation-delay:0.36s' x='114' y='100' width='12' height='40' rx='2' fill='currentColor' opacity='0.60'/%3E%3Crect class='b' style='animation-delay:0.48s' x='134' y='90' width='12' height='50' rx='2' fill='currentColor' opacity='0.70'/%3E%3Crect class='b' style='animation-delay:0.60s' x='154' y='78' width='12' height='62' rx='2' fill='currentColor' opacity='0.80'/%3E%3Crect class='b' style='animation-delay:0.72s' x='174' y='64' width='12' height='76' rx='2' fill='currentColor' opacity='0.90'/%3E%3Crect x='48' y='140' width='158' height='1' fill='%23E3E8EE'/%3E%3C/svg%3E%3C/g%3E%3Crect x='-6' y='80' width='112' height='72' rx='7' fill='%232F343C' stroke='%23fff' stroke-width='8' paint-order='stroke'/%3E%3CclipPath id='rc1'%3E%3Crect x='-0.96' y='85.04' width='101.92' height='61.92' rx='4.3'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23rc1)'%3E%3Csvg x='-0.96' y='85.04' width='101.92' height='61.92' viewBox='0 0 200 122' preserveAspectRatio='xMidYMin slice'%3E%3Crect width='200' height='122' fill='%23fff'/%3E%3Cdefs%3E%3Cg id='ta'%3E%3Crect x='8' y='22' width='56' height='98' rx='4' fill='%23fff' stroke='%23E3E8EE'/%3E%3Crect x='12' y='26' width='48' height='46' rx='3' fill='currentColor' opacity='.26'/%3E%3Crect x='12' y='80' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='12' y='87' width='28' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Cpath d='M12 101c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3C/g%3E%3Cg id='tb'%3E%3Crect x='8' y='22' width='56' height='98' rx='4' fill='%23fff' stroke='%23E3E8EE'/%3E%3Crect x='12' y='26' width='48' height='46' rx='3' fill='currentColor' opacity='.45'/%3E%3Crect x='12' y='80' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='12' y='87' width='28' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Cpath d='M12 101c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3C/g%3E%3C/defs%3E%3Cg class='ts' style='animation-delay:-2s'%3E%3Cuse href='%23ta' x='0'/%3E%3Cuse href='%23tb' x='64'/%3E%3Cuse href='%23ta' x='128'/%3E%3Cuse href='%23tb' x='192'/%3E%3Cuse href='%23ta' x='256'/%3E%3Cuse href='%23tb' x='320'/%3E%3C/g%3E%3Crect width='200' height='14' fill='%23F1F4F8'/%3E%3Ccircle cx='8' cy='7' r='2.2' fill='%23FE5E5E'/%3E%3Ccircle cx='15' cy='7' r='2.2' fill='%23FFDE59'/%3E%3Ccircle cx='22' cy='7' r='2.2' fill='%2301C063'/%3E%3Crect x='70' y='4.5' width='60' height='5' rx='2.5' fill='%23fff'/%3E%3C/svg%3E%3C/g%3E%3Cpath d='M-16.08 152h132.16l-6.2 9.4H-9.9z' fill='%23E4E8EE' stroke='%23fff' stroke-width='8' stroke-linejoin='round' paint-order='stroke'/%3E%3Cpath d='M-16.08 152h132.16l-6.2 9.4H-9.9z' fill='none' stroke='%23B9C2CD'/%3E%3Crect x='36.6' y='153' width='26.9' height='4' rx='2' fill='%23C7CFD9'/%3E%3Cg transform='rotate(8 200 112)'%3E%3Crect x='174' y='58' width='54' height='108' rx='9' fill='%232F343C' stroke='%23fff' stroke-width='8' paint-order='stroke'/%3E%3CclipPath id='rc2'%3E%3Crect x='177.78' y='62.32' width='46.44' height='99.36' rx='3.3'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23rc2)'%3E%3Csvg x='177.78' y='62.32' width='46.44' height='99.36' viewBox='0 0 100 214' preserveAspectRatio='xMidYMin slice'%3E%3Crect width='100' height='214' fill='%23fff'/%3E%3Cdefs%3E%3Cg id='pa'%3E%3Ccircle cx='13' cy='9' r='6' fill='%23DDE3EA'/%3E%3Crect x='23' y='5' width='34' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='23' y='11' width='20' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Crect x='6' y='20' width='88' height='38' rx='4' fill='currentColor' opacity='.26'/%3E%3Crect x='14' y='44' width='34' height='6' rx='3' fill='%23fff' opacity='.8'/%3E%3Cpath d='M8 63c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3Crect x='21' y='64' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3C/g%3E%3Cg id='pb'%3E%3Ccircle cx='13' cy='9' r='6' fill='%23DDE3EA'/%3E%3Crect x='23' y='5' width='34' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='23' y='11' width='20' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Crect x='6' y='20' width='88' height='38' rx='4' fill='currentColor' opacity='.45'/%3E%3Ccircle cx='50' cy='39' r='9' fill='currentColor' opacity='.5'/%3E%3Cpath d='M8 63c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3Crect x='21' y='64' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3C/g%3E%3C/defs%3E%3Cg class='fs' style='animation-delay:-4.5s'%3E%3Cuse href='%23pa' y='18'/%3E%3Cuse href='%23pb' y='90'/%3E%3Cuse href='%23pa' y='162'/%3E%3Cuse href='%23pb' y='234'/%3E%3Cuse href='%23pa' y='306'/%3E%3Cuse href='%23pb' y='378'/%3E%3Cuse href='%23pa' y='450'/%3E%3C/g%3E%3Crect width='100' height='14' fill='%23fff'/%3E%3Crect x='34' y='5' width='32' height='5' rx='2.5' fill='%23DDE3EA'/%3E%3C/svg%3E%3C/g%3E%3Crect x='192.36' y='59.89' width='17.28' height='3.5100000000000002' rx='1.6199999999999999' fill='%232F343C'/%3E%3C/g%3E%3C/svg%3E"); }

div[data-screen-label="Services"] .zm-svc-grid div[style*="height: 190px"] {
  height: auto !important;
  aspect-ratio: 220 / 140;
}
div[data-screen-label="Services"] .zm-svc-grid div[style*="height: 190px"] > img {
  display: none !important;
}
div[data-screen-label="Services"] .zm-svc-grid div[style*="height: 190px"]::after {
  content: "";
  position: absolute;
  left: -2.18%;
  width: 104.36%;
  bottom: -14px;
  aspect-ratio: 280 / 215;
  background: no-repeat center / 100% 100%;
  transform: translateY(6.98%);
  transform-origin: 50% 80%;
  transition: transform 260ms cubic-bezier(.2,.7,.2,1);
  pointer-events: none;
  z-index: 2;
}
div[data-screen-label="Services"] .zm-svc-grid > div:hover div[style*="height: 190px"]::after {
  transform: translateY(6.98%) scale(1.03);
}
@media (prefers-reduced-motion: reduce) {
  div[data-screen-label="Services"] .zm-svc-grid div[style*="height: 190px"]::after { transition: none; }
  div[data-screen-label="Services"] .zm-svc-grid > div:hover div[style*="height: 190px"]::after { transform: translateY(6.98%); }
}
div[data-screen-label="Services"] .zm-svc-grid div[style*="height: 190px"] + div {
  padding-top: 32px !important;
}
#zm-content div[data-screen-label="Services"] .zm-svc-grid div.zm-art-1 { background-color: #1877BD !important; background-image: linear-gradient(rgba(255,255,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px) !important; }
#zm-content div[data-screen-label="Services"] .zm-svc-grid div.zm-art-2 { background-color: #FE5E5E !important; background-image: linear-gradient(rgba(255,255,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px) !important; }
#zm-content div[data-screen-label="Services"] .zm-svc-grid div.zm-art-3 { background-color: #01C063 !important; background-image: linear-gradient(rgba(255,255,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px) !important; }
#zm-content div[data-screen-label="Services"] .zm-svc-grid div.zm-art-1::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-30 -30 280 215' style='color:%231877BD'%3E%3Cstyle%3E.fs{animation:fs 7s cubic-bezier(.65,0,.25,1) infinite}@keyframes fs{0%25,38%25{transform:translateY(0)}50%25,88%25{transform:translateY(-72px)}100%25{transform:translateY(-144px)}}.ts{animation:ts 8s cubic-bezier(.65,0,.25,1) infinite}@keyframes ts{0%25,38%25{transform:translateX(0)}50%25,88%25{transform:translateX(-64px)}100%25{transform:translateX(-128px)}}.b{transform-box:fill-box;transform-origin:50%25 100%25;animation:b 5s cubic-bezier(.3,.7,.3,1) infinite}@keyframes b{0%25{transform:scaleY(.2)}30%25,82%25{transform:scaleY(1)}100%25{transform:scaleY(.2)}}.ln{stroke-dasharray:44;animation:ln 5s ease-in-out infinite}@keyframes ln{0%25{stroke-dashoffset:44}30%25,82%25{stroke-dashoffset:0}100%25{stroke-dashoffset:44}}.fl{animation:fl 4.5s ease-in-out infinite}@keyframes fl{0%25,100%25{transform:translateY(0)}50%25{transform:translateY(-5px)}}.hp{transform-box:fill-box;transform-origin:50%25 60%25;animation:hp 2.4s ease-in-out infinite}@keyframes hp{0%25,60%25,100%25{transform:scale(1)}70%25{transform:scale(1.35)}80%25{transform:scale(.95)}}.lv{animation:lv 1.6s ease-in-out infinite}@keyframes lv{0%25,100%25{opacity:1}50%25{opacity:.25}}@media (prefers-reduced-motion:reduce){*{animation:none!important}}%3C/style%3E%3Cstyle%3E.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:dr 5.5s ease-in-out infinite both}@keyframes dr{0%25,6%25{stroke-dashoffset:1}38%25,84%25{stroke-dashoffset:0}96%25,100%25{stroke-dashoffset:1}}.ty{transform-box:fill-box;transform-origin:0 50%25;animation:ty 7s ease-out infinite both}@keyframes ty{0%25,6%25{transform:scaleX(0)}14%25,86%25{transform:scaleX(1)}94%25,100%25{transform:scaleX(0)}}.ap{transform-box:fill-box;transform-origin:50%25 50%25;animation:ap 6s cubic-bezier(.3,.7,.3,1.25) infinite both}@keyframes ap{0%25,5%25{transform:scale(0);opacity:0}14%25,84%25{transform:scale(1);opacity:1}93%25,100%25{transform:scale(0);opacity:0}}.rk{transform-box:fill-box;transform-origin:50%25 100%25;animation:rk 3.4s ease-in-out infinite}@keyframes rk{0%25,100%25{transform:rotate(-3deg)}50%25{transform:rotate(3deg)}}@media (prefers-reduced-motion:reduce){*{animation:none!important;stroke-dashoffset:0!important}}%3C/style%3E%3Cg transform='translate(171 39) scale(0.86) translate(-171 -39)'%3E%3Cg transform='rotate(5 170 40)'%3E%3Crect x='112' y='-6' width='118' height='90' rx='8' fill='%23fff' stroke='%23fff' stroke-width='8'/%3E%3Crect x='112' y='-6' width='118' height='90' rx='8' fill='%23fff' stroke='%23E3E8EE'/%3E%3Crect x='122' y='4' width='34' height='4' rx='2' fill='%23C9D1DB'/%3E%3Crect x='122' y='12' width='46' height='11' rx='2.5' fill='%232F343C'/%3E%3Cpath d='M122 72 H222' stroke='%23E3E8EE'/%3E%3Cpath d='M122 72 L122 72' stroke='none'/%3E%3Cpath d='M124 70 L124 70 L140 62 L156 64 L172 50 L188 52 L204 36 L220 30 L220 72 L124 72 Z' fill='currentColor' opacity='.14'/%3E%3Cpath class='dr' pathLength='1' d='M124 70 L140 62 L156 64 L172 50 L188 52 L204 36 L220 30' fill='none' stroke='currentColor' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle class='ap' style='animation-delay:1.6s' cx='220' cy='30' r='4' fill='currentColor' stroke='%23fff' stroke-width='2'/%3E%3C/g%3E%3C/g%3E%3Cg transform='rotate(-6 77 79)'%3E%3Crect x='34' y='-8' width='86' height='174' rx='14' fill='%232F343C' stroke='%23fff' stroke-width='8' paint-order='stroke'/%3E%3CclipPath id='rc0'%3E%3Crect x='40.02' y='-1.12' width='73.96' height='160.24' rx='5.2'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23rc0)'%3E%3Csvg x='40.02' y='-1.12' width='73.96' height='160.24' viewBox='0 0 100 217' preserveAspectRatio='xMidYMin slice'%3E%3Crect width='100' height='217' fill='%23fff'/%3E%3Cdefs%3E%3Cg id='pa'%3E%3Ccircle cx='13' cy='9' r='6' fill='%23DDE3EA'/%3E%3Crect x='23' y='5' width='34' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='23' y='11' width='20' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Crect x='6' y='20' width='88' height='38' rx='4' fill='currentColor' opacity='.26'/%3E%3Crect x='14' y='44' width='34' height='6' rx='3' fill='%23fff' opacity='.8'/%3E%3Cpath d='M8 63c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3Crect x='21' y='64' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3C/g%3E%3Cg id='pb'%3E%3Ccircle cx='13' cy='9' r='6' fill='%23DDE3EA'/%3E%3Crect x='23' y='5' width='34' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Crect x='23' y='11' width='20' height='3' rx='1.5' fill='%23E3E8EE'/%3E%3Crect x='6' y='20' width='88' height='38' rx='4' fill='currentColor' opacity='.45'/%3E%3Ccircle cx='50' cy='39' r='9' fill='currentColor' opacity='.5'/%3E%3Cpath d='M8 63c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='currentColor'/%3E%3Crect x='21' y='64' width='40' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3C/g%3E%3C/defs%3E%3Cg class='fs' style='animation-delay:-1.5s'%3E%3Cuse href='%23pa' y='18'/%3E%3Cuse href='%23pb' y='90'/%3E%3Cuse href='%23pa' y='162'/%3E%3Cuse href='%23pb' y='234'/%3E%3Cuse href='%23pa' y='306'/%3E%3Cuse href='%23pb' y='378'/%3E%3Cuse href='%23pa' y='450'/%3E%3C/g%3E%3Crect width='100' height='14' fill='%23fff'/%3E%3Crect x='34' y='5' width='32' height='5' rx='2.5' fill='%23DDE3EA'/%3E%3C/svg%3E%3C/g%3E%3Crect x='63.24' y='-4.99' width='27.52' height='5.59' rx='2.58' fill='%232F343C'/%3E%3C/g%3E%3Cg transform='translate(5 43) scale(0.82) translate(-5 -43)'%3E%3Cg class='fl' style='animation-delay:-1.2s'%3E%3Cg transform='translate(-22 30)'%3E%3Crect width='54' height='26' rx='13' fill='%23fff' stroke='%23fff' stroke-width='7'/%3E%3Cg class='hp' style='animation-delay:-1.2s'%3E%3Cpath d='M11 10.5c0-2.6 3.4-2.6 4.4-.8.9-1.8 4.4-1.8 4.4.8 0 2.6-4.4 5.3-4.4 5.3s-4.4-2.7-4.4-5.3z' fill='%23FE5E5E'/%3E%3C/g%3E%3Crect x='27' y='11' width='18' height='4.5' rx='2.2' fill='%233E3E3E' opacity='.6'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform='translate(170 128) scale(0.82) translate(-170 -128)'%3E%3Cg class='fl' style='animation-delay:-3s'%3E%3Cg transform='translate(118 112)'%3E%3Crect width='104' height='32' rx='16' fill='%23fff' stroke='%23fff' stroke-width='7'/%3E%3Ccircle cx='16' cy='16' r='10' fill='currentColor' opacity='.3'/%3E%3Ccircle cx='16' cy='13' r='3.6' fill='currentColor'/%3E%3Cpath d='M9.5 22c1.5-4 11.5-4 13 0' fill='currentColor'/%3E%3Crect x='32' y='10' width='38' height='4' rx='2' fill='%233E3E3E' opacity='.7'/%3E%3Crect x='32' y='18' width='26' height='3.5' rx='1.7' fill='%23C9D1DB'/%3E%3Cg class='ap' style='animation-delay:-2s'%3E%3Ccircle cx='88' cy='16' r='9' fill='currentColor'/%3E%3Cpath d='M88 12v8M84 16h8' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
#zm-content div[data-screen-label="Services"] .zm-svc-grid div.zm-art-2::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-30 -30 280 215' style='color:%23FE5E5E'%3E%3Cstyle%3E.fs{animation:fs 7s cubic-bezier(.65,0,.25,1) infinite}@keyframes fs{0%25,38%25{transform:translateY(0)}50%25,88%25{transform:translateY(-72px)}100%25{transform:translateY(-144px)}}.ts{animation:ts 8s cubic-bezier(.65,0,.25,1) infinite}@keyframes ts{0%25,38%25{transform:translateX(0)}50%25,88%25{transform:translateX(-64px)}100%25{transform:translateX(-128px)}}.b{transform-box:fill-box;transform-origin:50%25 100%25;animation:b 5s cubic-bezier(.3,.7,.3,1) infinite}@keyframes b{0%25{transform:scaleY(.2)}30%25,82%25{transform:scaleY(1)}100%25{transform:scaleY(.2)}}.ln{stroke-dasharray:44;animation:ln 5s ease-in-out infinite}@keyframes ln{0%25{stroke-dashoffset:44}30%25,82%25{stroke-dashoffset:0}100%25{stroke-dashoffset:44}}.fl{animation:fl 4.5s ease-in-out infinite}@keyframes fl{0%25,100%25{transform:translateY(0)}50%25{transform:translateY(-5px)}}.hp{transform-box:fill-box;transform-origin:50%25 60%25;animation:hp 2.4s ease-in-out infinite}@keyframes hp{0%25,60%25,100%25{transform:scale(1)}70%25{transform:scale(1.35)}80%25{transform:scale(.95)}}.lv{animation:lv 1.6s ease-in-out infinite}@keyframes lv{0%25,100%25{opacity:1}50%25{opacity:.25}}@media (prefers-reduced-motion:reduce){*{animation:none!important}}%3C/style%3E%3Cstyle%3E.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:dr 5.5s ease-in-out infinite both}@keyframes dr{0%25,6%25{stroke-dashoffset:1}38%25,84%25{stroke-dashoffset:0}96%25,100%25{stroke-dashoffset:1}}.ty{transform-box:fill-box;transform-origin:0 50%25;animation:ty 7s ease-out infinite both}@keyframes ty{0%25,6%25{transform:scaleX(0)}14%25,86%25{transform:scaleX(1)}94%25,100%25{transform:scaleX(0)}}.ap{transform-box:fill-box;transform-origin:50%25 50%25;animation:ap 6s cubic-bezier(.3,.7,.3,1.25) infinite both}@keyframes ap{0%25,5%25{transform:scale(0);opacity:0}14%25,84%25{transform:scale(1);opacity:1}93%25,100%25{transform:scale(0);opacity:0}}.rk{transform-box:fill-box;transform-origin:50%25 100%25;animation:rk 3.4s ease-in-out infinite}@keyframes rk{0%25,100%25{transform:rotate(-3deg)}50%25{transform:rotate(3deg)}}@media (prefers-reduced-motion:reduce){*{animation:none!important;stroke-dashoffset:0!important}}%3C/style%3E%3Cg transform='rotate(-5 90 66)'%3E%3Crect x='0' y='-2' width='178' height='136' rx='12' fill='%232F343C' stroke='%23fff' stroke-width='9' paint-order='stroke'/%3E%3CclipPath id='rc0'%3E%3Crect x='8.00' y='6.00' width='162.00' height='120.00' rx='8.0'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23rc0)'%3E%3Csvg x='8' y='6' width='162' height='120' viewBox='0 0 200 148' preserveAspectRatio='xMidYMin slice'%3E%3Crect width='200' height='148' fill='%23F1F4F8'/%3E%3Crect width='22' height='200' fill='%23fff'/%3E%3Cg fill='%23D5DCE5'%3E%3Crect x='6' y='10' width='10' height='10' rx='2.5'/%3E%3Crect x='6' y='28' width='10' height='10' rx='5'/%3E%3Crect x='6' y='46' width='10' height='10' rx='2.5'/%3E%3Crect x='6' y='64' width='10' height='10' rx='2.5'/%3E%3C/g%3E%3Crect x='5' y='27' width='12' height='12' rx='6' fill='none' stroke='currentColor' stroke-width='1.5'/%3E%3Crect x='178' width='22' height='200' fill='%23fff'/%3E%3Cg%3E%3Ccircle cx='189' cy='16' r='5' fill='%231877BD'/%3E%3Ccircle cx='189' cy='30' r='5' fill='currentColor'/%3E%3Ccircle cx='189' cy='44' r='5' fill='%23FFDE59'/%3E%3Ccircle cx='189' cy='58' r='5' fill='%2301C063'/%3E%3C/g%3E%3Crect x='40' y='10' width='120' height='130' rx='3' fill='%23fff' stroke='%23E3E8EE'/%3E%3Crect class='ap' style='animation-delay:0s' x='48' y='18' width='104' height='62' rx='3' fill='currentColor' opacity='.85'/%3E%3Ccircle class='ap' style='animation-delay:.35s' cx='122' cy='46' r='17' fill='%23FFDE59'/%3E%3Cpath class='ap' style='animation-delay:.6s' d='M48 80 L78 52 L100 72 L112 62 L152 80 Z' fill='%23fff' opacity='.55'/%3E%3Crect class='ty' style='animation-delay:.9s' x='48' y='90' width='86' height='9' rx='2' fill='%232F343C'/%3E%3Crect class='ty' style='animation-delay:1.15s' x='48' y='104' width='62' height='5' rx='2' fill='%23C9D1DB'/%3E%3Crect class='ap' style='animation-delay:1.4s' x='48' y='118' width='44' height='13' rx='6.5' fill='currentColor'/%3E%3Crect class='ap' style='animation-delay:1.4s' x='55' y='123' width='30' height='3' rx='1.5' fill='%23fff'/%3E%3C/svg%3E%3C/g%3E%3Ccircle cx='174' cy='66' r='1.6' fill='%235A616B'/%3E%3C/g%3E%3Cg transform='translate(204 -20) rotate(24)'%3E%3Cg class='rk'%3E%3Crect x='0' y='0' width='13' height='150' rx='6.5' fill='%23fff' stroke='%23fff' stroke-width='8'/%3E%3Cpath d='M0 128 L6.5 152 L13 128 Z' fill='%23fff' stroke='%23fff' stroke-width='8' stroke-linejoin='round'/%3E%3Crect x='0' y='0' width='13' height='130' rx='6.5' fill='%23F4F5F7' stroke='%23C7CFD9'/%3E%3Crect x='0' y='12' width='13' height='3' fill='%23E3E8EE'/%3E%3Cpath d='M0.5 128 L6.5 151 L12.5 128 Z' fill='%23E9ECF1' stroke='%23C7CFD9' stroke-linejoin='round'/%3E%3Cpath d='M4.6 144 L6.5 151 L8.4 144 Z' fill='%232F343C'/%3E%3C/g%3E%3C/g%3E%3Cg transform='translate(11 126) scale(0.82) translate(-11 -126)'%3E%3Cg class='fl' style='animation-delay:-2s'%3E%3Cg transform='translate(-24 112)'%3E%3Crect width='78' height='28' rx='14' fill='%23fff' stroke='%23fff' stroke-width='7'/%3E%3Ccircle cx='15' cy='14' r='7' fill='%231877BD'/%3E%3Ccircle cx='31' cy='14' r='7' fill='currentColor'/%3E%3Ccircle cx='47' cy='14' r='7' fill='%23FFDE59'/%3E%3Ccircle cx='63' cy='14' r='7' fill='%2301C063'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
#zm-content div[data-screen-label="Services"] .zm-svc-grid div.zm-art-3::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-30 -30 280 215' style='color:%2301C063'%3E%3Cstyle%3E.fs{animation:fs 7s cubic-bezier(.65,0,.25,1) infinite}@keyframes fs{0%25,38%25{transform:translateY(0)}50%25,88%25{transform:translateY(-72px)}100%25{transform:translateY(-144px)}}.ts{animation:ts 8s cubic-bezier(.65,0,.25,1) infinite}@keyframes ts{0%25,38%25{transform:translateX(0)}50%25,88%25{transform:translateX(-64px)}100%25{transform:translateX(-128px)}}.b{transform-box:fill-box;transform-origin:50%25 100%25;animation:b 5s cubic-bezier(.3,.7,.3,1) infinite}@keyframes b{0%25{transform:scaleY(.2)}30%25,82%25{transform:scaleY(1)}100%25{transform:scaleY(.2)}}.ln{stroke-dasharray:44;animation:ln 5s ease-in-out infinite}@keyframes ln{0%25{stroke-dashoffset:44}30%25,82%25{stroke-dashoffset:0}100%25{stroke-dashoffset:44}}.fl{animation:fl 4.5s ease-in-out infinite}@keyframes fl{0%25,100%25{transform:translateY(0)}50%25{transform:translateY(-5px)}}.hp{transform-box:fill-box;transform-origin:50%25 60%25;animation:hp 2.4s ease-in-out infinite}@keyframes hp{0%25,60%25,100%25{transform:scale(1)}70%25{transform:scale(1.35)}80%25{transform:scale(.95)}}.lv{animation:lv 1.6s ease-in-out infinite}@keyframes lv{0%25,100%25{opacity:1}50%25{opacity:.25}}@media (prefers-reduced-motion:reduce){*{animation:none!important}}%3C/style%3E%3Cstyle%3E.dr{stroke-dasharray:1;stroke-dashoffset:1;animation:dr 5.5s ease-in-out infinite both}@keyframes dr{0%25,6%25{stroke-dashoffset:1}38%25,84%25{stroke-dashoffset:0}96%25,100%25{stroke-dashoffset:1}}.ty{transform-box:fill-box;transform-origin:0 50%25;animation:ty 7s ease-out infinite both}@keyframes ty{0%25,6%25{transform:scaleX(0)}14%25,86%25{transform:scaleX(1)}94%25,100%25{transform:scaleX(0)}}.ap{transform-box:fill-box;transform-origin:50%25 50%25;animation:ap 6s cubic-bezier(.3,.7,.3,1.25) infinite both}@keyframes ap{0%25,5%25{transform:scale(0);opacity:0}14%25,84%25{transform:scale(1);opacity:1}93%25,100%25{transform:scale(0);opacity:0}}.rk{transform-box:fill-box;transform-origin:50%25 100%25;animation:rk 3.4s ease-in-out infinite}@keyframes rk{0%25,100%25{transform:rotate(-3deg)}50%25{transform:rotate(3deg)}}@media (prefers-reduced-motion:reduce){*{animation:none!important;stroke-dashoffset:0!important}}%3C/style%3E%3Cg transform='translate(110 150) scale(1.1) translate(-110 -150)'%3E%3Cg transform='translate(28 0)'%3E%3Crect x='-2' y='30' width='168' height='112' rx='7' fill='%232F343C' stroke='%23fff' stroke-width='8' paint-order='stroke'/%3E%3CclipPath id='rc0'%3E%3Crect x='5.50' y='37.50' width='153.00' height='97.00' rx='6.8'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23rc0)'%3E%3Csvg x='5.5' y='37.5' width='153' height='97' viewBox='0 0 200 127' preserveAspectRatio='xMidYMin slice'%3E%3Crect width='200' height='127' fill='%23fff'/%3E%3Crect width='200' height='14' fill='%23F1F4F8'/%3E%3Ccircle cx='8' cy='7' r='2.2' fill='%23FE5E5E'/%3E%3Ccircle cx='15' cy='7' r='2.2' fill='%23FFDE59'/%3E%3Ccircle cx='22' cy='7' r='2.2' fill='%2301C063'/%3E%3Crect x='70' y='4.5' width='60' height='5' rx='2.5' fill='%23fff'/%3E%3Crect x='14' y='22' width='118' height='42' rx='4' fill='currentColor' opacity='.3'/%3E%3Ccircle cx='42' cy='43' r='9' fill='currentColor' opacity='.5'/%3E%3Crect class='ty' style='animation-delay:.5s' x='14' y='70' width='96' height='8' rx='2' fill='%232F343C'/%3E%3Crect class='ty' style='animation-delay:0.90s' x='14' y='84' width='100' height='4' rx='2' fill='%23C9D1DB'/%3E%3Crect class='ty' style='animation-delay:1.08s' x='14' y='93' width='108' height='4' rx='2' fill='%23C9D1DB'/%3E%3Crect class='ty' style='animation-delay:1.26s' x='14' y='102' width='92' height='4' rx='2' fill='%23C9D1DB'/%3E%3Crect class='ty' style='animation-delay:1.44s' x='14' y='111' width='104' height='4' rx='2' fill='%23C9D1DB'/%3E%3Crect class='ty' style='animation-delay:1.62s' x='14' y='120' width='70' height='4' rx='2' fill='%23C9D1DB'/%3E%3Crect x='142' y='22' width='48' height='60' rx='4' fill='%23F1F4F8'/%3E%3Crect x='148' y='29' width='30' height='4' rx='2' fill='%23C9D1DB'/%3E%3Crect x='148' y='38' width='36' height='3.5' rx='1.7' fill='%23E3E8EE'/%3E%3Crect x='148' y='45' width='26' height='3.5' rx='1.7' fill='%23E3E8EE'/%3E%3Crect class='ap' style='animation-delay:2s' x='148' y='56' width='36' height='12' rx='6' fill='currentColor'/%3E%3C/svg%3E%3C/g%3E%3Cpath d='M-17 142h198l-9 14.6H-8z' fill='%23E4E8EE' stroke='%23fff' stroke-width='8' stroke-linejoin='round' paint-order='stroke'/%3E%3Cpath d='M-17 142h198l-9 14.6H-8z' fill='none' stroke='%23B9C2CD'/%3E%3Crect x='62' y='143' width='40' height='4' rx='2' fill='%23C7CFD9'/%3E%3C/g%3E%3C/g%3E%3Cg transform='translate(3 -6)'%3E%3Cg transform='translate(201 104) scale(0.84) translate(-201 -104)'%3E%3Cg class='fl' style='animation-delay:-.6s'%3E%3Cg transform='rotate(8 200 104)'%3E%3Crect x='164' y='78' width='74' height='52' rx='7' fill='%23fff' stroke='%23fff' stroke-width='8'/%3E%3Crect x='164' y='78' width='74' height='52' rx='7' fill='%23fff' stroke='%23E3E8EE'/%3E%3Cpath d='M167 82 L201 106 L235 82' fill='none' stroke='currentColor' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='M168 127 L192 104 M234 127 L210 104' stroke='%23E3E8EE' stroke-width='2'/%3E%3Cg class='ap' style='animation-delay:.3s'%3E%3Ccircle cx='236' cy='80' r='9' fill='%23FE5E5E' stroke='%23fff' stroke-width='3'/%3E%3Crect x='234.6' y='76' width='2.8' height='8' rx='1.4' fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }

/* Task, 17 Oct: About Me hero. "Book a Call" pulses on hover like "See My
   Work" beside it (same cta-pulse animation). It's an outline button, so it
   takes the light blue wash instead of the dark fill to keep its text
   readable. The About hero is the only Hero followed by the Pains section. */
section[data-screen-label="Hero"]:has(+ section[data-screen-label="Pains"]) a.scp2:hover {
  animation: cta-pulse 450ms ease-out forwards;
  background: var(--zm-blue-wash, #EDF7FF) !important;
}
@media (prefers-reduced-motion: reduce) {
  section[data-screen-label="Hero"]:has(+ section[data-screen-label="Pains"]) a.scp2:hover { animation: none; }
}

/* Task, 17 Oct: every button pulses on hover, site-wide. Buttons that
   already carry cta-pulse / cta-pulse-light keep theirs; this covers the
   rest (outline buttons, View Packages, Read the case study, I'm Ready to
   Grow on Social, Let's chat!, the header Book a Call, the mobile menu
   button and the mobile review cards). Same motion as See My Work: a quick
   grow and a ring that fades out. Blue ring on light backgrounds, white ring
   on blue bands. Outline buttons also take a light fill so text stays
   readable. Off for reduced motion. */
@keyframes zm-btn-pulse {
  0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(24, 119, 189, 0.45); }
  50% { transform: scale(1.045); }
  100% { transform: scale(1.02); box-shadow: 0 0 0 12px rgba(24, 119, 189, 0); }
}
@keyframes zm-btn-pulse-light {
  0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.55); }
  50% { transform: scale(1.045); }
  100% { transform: scale(1.02); box-shadow: 0 0 0 12px rgba(255, 255, 255, 0); }
}
a:is(.scp1, .scp2, .scp3, .scp4, .zm-nav-cta, .zm-mobile-cta):not(.cta-pulse):not(.cta-pulse-light):hover,
section[data-screen-label="Case studies"] .zm-grid-on-blue a:hover,
.zm-reviews-mobile a:hover {
  animation: zm-btn-pulse 450ms ease-out forwards;
}
.zm-grid-on-blue a:is(.scp1, .scp2, .scp3, .scp4):not(.cta-pulse):not(.cta-pulse-light):hover,
section[data-screen-label="Case studies"] .zm-grid-on-blue a:hover,
.zm-reviews-mobile .zm-grid-on-blue a:hover {
  animation-name: zm-btn-pulse-light;
}
a:is(.scp1, .scp2, .scp3, .scp4):not(.cta-pulse):not(.cta-pulse-light)[style*="background: transparent"]:hover {
  background: var(--zm-blue-wash, #EDF7FF) !important;
}
.zm-grid-on-blue a:is(.scp1, .scp2, .scp3, .scp4):not(.cta-pulse):not(.cta-pulse-light)[style*="background: transparent"]:hover,
section[data-screen-label="Case studies"] .zm-grid-on-blue a[style*="background: transparent"]:hover {
  background: rgba(255, 255, 255, 0.14) !important;
}
@media (prefers-reduced-motion: reduce) {
  a:is(.scp1, .scp2, .scp3, .scp4, .zm-nav-cta, .zm-mobile-cta):hover,
  section[data-screen-label="Case studies"] .zm-grid-on-blue a:hover,
  .zm-reviews-mobile a:hover { animation: none !important; }
}

/* Task, 17 Oct: Home "A Few Feeds I've Made Famous". Just the feed images:
   hide the "View case study" links under each image and the "See all 5
   case studies" link below them. */
section[data-screen-label="Feeds band"] .zm-feed-more,
section[data-screen-label="Feeds band"] .zm-feed-all {
  display: none !important;
}

/* Task, 17 Oct: tighten the "A Few Feeds I've Made Famous" band now that
   the case study links are gone. Top padding 96 -> 72, bottom 110 -> 72
   (mobile bottom was 106), and a little less space between the heading and
   the images. */
div[data-screen-label="Home"] section[data-screen-label="Feeds band"] {
  padding-top: 72px !important;
  padding-bottom: 72px !important;
  gap: 40px !important;
}
@media (max-width: 560px) {
  div[data-screen-label="Home"] section[data-screen-label="Feeds band"] {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }
}

/* Task, 17 Oct: About Me "fun facts" bento, desktop. Stickers sized and
   placed to match the reference layout: bigger noodle bowl hanging off the
   left edge, two separate ice cream cones low and large, bigger tilted drink
   in the bottom-right corner, larger map pin shifted right, cats photo a
   touch smaller with more tilt. Hovers keep each sticker's tilt and add a
   small grow. Mobile keeps its own layout. */
@media (min-width: 821px) {
  .zm-about-bento.zm-about-bento > div > div:has(> #about-food) {
    left: -12px !important; right: auto !important; top: auto !important; bottom: 6px !important;
    width: 128px !important; height: 120px !important;
    transform: rotate(-8deg) !important;
  }
  .zm-about-bento.zm-about-bento > div > div:has(> #about-food):hover { transform: rotate(-8deg) scale(1.06) !important; }

  .zm-about-bento.zm-about-bento > div > div:has(> #about-ice) {
    left: 0 !important; right: 0 !important; top: auto !important; bottom: 0 !important;
    width: auto !important; height: 170px !important;
    transform: none !important;
  }
  .zm-about-bento.zm-about-bento > div > div:has(> #about-ice):hover { transform: scale(1.04) !important; }
  .zm-about-bento #about-ice,
  .zm-about-bento #about-ice-2 {
    position: absolute !important; height: 154px !important; object-fit: contain !important;
  }
  .zm-about-bento #about-ice { left: 26px !important; bottom: -10px !important; width: 107px !important; }
  .zm-about-bento #about-ice-2 { left: 156px !important; bottom: 6px !important; width: 89px !important; }

  .zm-about-bento.zm-about-bento > div > div:has(> #about-drink) {
    left: auto !important; right: -1px !important; top: auto !important; bottom: 0 !important;
    width: 120px !important; height: 151px !important;
    transform: rotate(10deg) !important;
  }
  .zm-about-bento.zm-about-bento > div > div:has(> #about-drink):hover { transform: rotate(10deg) scale(1.06) !important; }

  .zm-about-bento.zm-about-bento > div > div:has(> #about-cats-tile) {
    left: 35px !important; right: auto !important; top: auto !important; bottom: -31px !important;
    width: 171px !important; height: 133px !important;
    transform: rotate(-5deg) !important;
  }
  .zm-about-bento.zm-about-bento > div > div:has(> #about-cats-tile):hover { transform: rotate(-5deg) scale(1.06) !important; }

  .zm-about-bento.zm-about-bento > div > div:has(> #about-map) {
    left: 71px !important; right: auto !important; top: auto !important; bottom: 11px !important;
    width: 136px !important; height: 146px !important;
    transform: none !important;
  }
  .zm-about-bento.zm-about-bento > div > div:has(> #about-map):hover { transform: translateX(6px) !important; }
}

/* Task, 17 Oct: About Me bento hovers, desktop.
   TikTok phone: same hover as the phone in the home page bento. Hovering the
   "Favorite Social Platform?" tile grows the phone 10% from its base (the
   phone already carries its own 500ms ease).
   Ice cream: the two cones are separate images and now hover separately.
   The shared container no longer grows; each cone grows 8% from its base on
   its own. Off for reduced motion. */
@media (min-width: 821px) {
  .zm-about-bento.zm-about-bento > div:hover > .zm-tiktok-phone {
    transform: translateX(-50%) scale(1.1) !important;
  }
  .zm-about-bento.zm-about-bento > div > div:has(> #about-ice):hover {
    transform: none !important;
  }
  .zm-about-bento #about-ice,
  .zm-about-bento #about-ice-2 {
    transform-origin: 50% 100%;
    transition: transform 250ms cubic-bezier(.2,.7,.2,1);
  }
  .zm-about-bento #about-ice:hover,
  .zm-about-bento #about-ice-2:hover {
    transform: scale(1.08);
  }
}
@media (prefers-reduced-motion: reduce) {
  .zm-about-bento.zm-about-bento > div:hover > .zm-tiktok-phone { transform: translateX(-50%) scale(1) !important; }
  .zm-about-bento #about-ice:hover,
  .zm-about-bento #about-ice-2:hover { transform: none; }
}

/* ============== TYPE SCALE (17 Oct) ==============
   One text standard across every page's content (not header/footer).
   Body 16px, fine print 14px, buttons 16px, H3 18px, H2 24px, H1 28px on
   inner pages (home hero keeps its statement headline). Review quotes, stat
   numbers and star ratings keep their display sizes. Uses the main content
   id so it outranks each page's own inline and mobile sizes. */
#zm-content p:not(.h1):not(section[data-screen-label="Testimonials"] p) {
  font-size: 16px !important;
}
#zm-content p[style*="font-size: 12px"] {
  font-size: 14px !important;
}
#zm-content section[data-screen-label="What you get"] div[style*="font-size: 15px"],
#zm-content section[data-screen-label="What I do"] [style*="font-size: 15px"],
#zm-content section[data-screen-label="Proof bento"] [style*="font-size: 14.5px"] {
  font-size: 16px !important;
}
#zm-content a:is(.scp1, .scp2, .scp3, .scp4, .zm-review-btn, .cta-pulse, .cta-pulse-light),
#zm-content .zm-reviews-mobile a,
#zm-content section[data-screen-label="Case studies"] .zm-grid-on-blue a {
  font-size: 16px !important;
}
#zm-content h3 {
  font-size: 18px !important;
}
#zm-content h2 {
  font-size: 24px !important;
}
#zm-content h1:not(div[data-screen-label="Home"] h1) {
  font-size: 28px !important;
}
/* About Me bento: taller tiles so the 16px text clears the stickers. */
@media (min-width: 821px) {
  .zm-about-bento.zm-about-bento > div {
    min-height: 285px !important;
  }
}

/* Task, 17 Oct: Content Ideas (30 Days) hero, desktop. Ebook cover 25%
   larger: 268px -> 335px wide. */
@media (min-width: 821px) {
  .zm-ebook-hero .zm-ebook-cover-wrap {
    max-width: 335px !important;
  }
}

/* Task, 17 Oct: Home "My Clients" phones glide instead of jumping. The home
   page switches the phones' transition off, so the hover lift snapped into
   place. Each column now eases up ~0.7s (fast start, soft landing) and eases
   back down the same way. Off for reduced motion. */
div[data-screen-label="Home"] section[data-screen-label="Proof bento"] .zm-phone-pair {
  transition: transform 700ms cubic-bezier(.22, 1, .36, 1) !important;
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  div[data-screen-label="Home"] section[data-screen-label="Proof bento"] .zm-phone-pair {
    transition: none !important;
  }
}

/* Task, 17 Oct: footer redesign, desktop. Bigger and tighter, matching the
   reference: large ZM monogram, bold 20px text, centred link columns pulled
   in toward the middle, compact white buttons that pulse on hover. */
@media (min-width: 821px) {
  footer.zm-footer { padding: 72px 24px 60px !important; }
  footer.zm-footer .zm-footer__inner {
    max-width: 1080px;
    grid-template-columns: 1.35fr 1fr 1.25fr auto;
    column-gap: 40px;
    align-items: start;
  }
  footer.zm-footer .zm-footer__brand img { width: 196px; margin-bottom: 16px; }
  footer.zm-footer .zm-footer__copy {
    display: flex; align-items: center; gap: 8px;
    font-size: 20px; font-weight: 600; line-height: 1.3;
  }
  footer.zm-footer .zm-footer__c { font-size: 28px; font-weight: 300; line-height: 1; }
  footer.zm-footer .zm-footer__col { text-align: center; }
  footer.zm-footer .zm-footer__eyebrow {
    font-size: 20px; font-weight: 700; letter-spacing: 0.02em;
    opacity: 1; margin-bottom: 12px;
  }
  footer.zm-footer .zm-footer__col ul { gap: 8px; align-items: center; }
  footer.zm-footer .zm-footer__col a { font-size: 20px; font-weight: 600; line-height: 1.2; }
  footer.zm-footer .zm-footer__btns { gap: 22px; width: 150px; }
  footer.zm-footer .zm-footer__btns a {
    height: 40px; padding: 0 12px;
    font-size: 19px; font-weight: 500; border-radius: 4px;
  }
}
footer.zm-footer .zm-footer__social {
  display: flex; justify-content: center; align-items: center; gap: 40px; margin-top: 26px;
}
footer.zm-footer .zm-footer__social a { display: inline-flex; color: #fff; }
footer.zm-footer .zm-footer__social a:hover { opacity: 0.8; text-decoration: none; }
footer.zm-footer .zm-footer__social svg { width: 30px; height: 30px; }
footer.zm-footer .zm-footer__social a + a svg { width: 34px; height: 34px; }
footer.zm-footer .zm-footer__btns a:hover {
  animation: zm-btn-pulse-light 450ms ease-out forwards;
  text-decoration: none;
}
@media (prefers-reduced-motion: reduce) {
  footer.zm-footer .zm-footer__btns a:hover { animation: none; }
}

/* Task, 17 Oct: footer tweaks. Copyright stays on one line; Book a Call and
   Newsletter keep their blue text on hover (the theme turns footer links
   white on hover, which hid the text on the white buttons); a softer pulse
   for these two buttons. */
footer.zm-footer .zm-footer__copy { white-space: nowrap; }
@keyframes zm-btn-pulse-soft {
  0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4); }
  50% { transform: scale(1.02); }
  100% { transform: scale(1.01); box-shadow: 0 0 0 7px rgba(255, 255, 255, 0); }
}
footer.zm-footer .zm-footer__btns a:hover {
  color: var(--zm-blue, #1877BD) !important;
  animation: zm-btn-pulse-soft 450ms ease-out forwards;
}
@media (prefers-reduced-motion: reduce) {
  footer.zm-footer .zm-footer__btns a:hover { animation: none; }
}

/* Task, 17 Oct: footer copyright line 33% smaller on desktop
   (text 20px -> 13.4px, (c) symbol 28px -> 18.8px). */
@media (min-width: 821px) {
  footer.zm-footer .zm-footer__copy { font-size: 13.4px; gap: 6px; }
  footer.zm-footer .zm-footer__c { font-size: 18.8px; }
}

/* Task, 17 Oct: footer redesign, mobile. Two columns side by side (Quick
   Links | Get in Touch + buttons), no logo, no social icons, bold centred
   text, compact buttons, copyright centred along the bottom. */
@media (max-width: 820px) {
  footer.zm-footer { padding: 36px 16px 28px !important; }
  footer.zm-footer .zm-footer__inner {
    grid-template-columns: 1fr 1.25fr !important;
    grid-template-areas: "links touch" "links btns" "copy copy";
    column-gap: 12px !important; row-gap: 0 !important;
    align-items: start;
  }
  footer.zm-footer .zm-footer__brand { grid-area: copy; margin-top: 40px; }
  footer.zm-footer .zm-footer__brand img { display: none !important; }
  footer.zm-footer .zm-footer__copy {
    display: flex; justify-content: center; align-items: center; gap: 8px;
    font-size: 15px; font-weight: 600;
  }
  footer.zm-footer .zm-footer__c { font-size: 20px; font-weight: 300; line-height: 1; }
  footer.zm-footer .zm-footer__col { grid-area: links; text-align: center; }
  footer.zm-footer .zm-footer__touch { grid-area: touch; }
  footer.zm-footer .zm-footer__eyebrow {
    font-size: 18px; font-weight: 700; letter-spacing: 0; opacity: 1; margin-bottom: 8px;
  }
  footer.zm-footer .zm-footer__col ul { gap: 10px; align-items: center; }
  footer.zm-footer .zm-footer__col a {
    font-size: clamp(14px, 4.1vw, 17px); font-weight: 600; line-height: 1.5;
  }
  footer.zm-footer .zm-footer__social { display: none !important; }
  footer.zm-footer .zm-footer__btns {
    grid-area: btns; align-items: center; gap: 12px; margin-top: 16px;
  }
  footer.zm-footer .zm-footer__btns a {
    width: 112px; height: 32px; min-height: 0; padding: 0 8px;
    font-size: 15px; font-weight: 500; border-radius: 4px;
  }
}

/* ============== MOBILE FIXES (17 Oct) ============== */
@media (max-width: 820px) {
  /* Portfolio: room between the header and the "Say Hello" hero. */
  #zm-content div[data-screen-label="Portfolio"] section[data-screen-label="Hero"] {
    padding-top: 36px !important;
  }

  /* Social Media + Services: show the colored card artwork on phones too. */
  #zm-content div[data-screen-label="Social Media"] .zm-svc-grid div[style*="height: 170px"],
  #zm-content div[data-screen-label="Services"] .zm-svc-grid div[style*="height: 190px"] {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 220 / 140 !important;
    flex: 0 0 auto !important;
  }

  /* Social Media headline: two lines max. */
  #zm-content div[data-screen-label="Social Media"] section[data-screen-label="Hero"] h1 {
    font-size: 26px !important;
  }
  #zm-content div[data-screen-label="Social Media"] section[data-screen-label="Hero"] h1 br {
    display: none;
  }

  /* Case studies: "after 3 months" on one line. */
  #zm-content .zm-ba-stack > div > div[style*="position: absolute"] {
    display: flex !important;
    justify-content: center;
    gap: 0.28em;
    white-space: nowrap;
  }
  #zm-content .zm-ba-stack > div > div[style*="position: absolute"] br { display: none; }

  /* Case studies: results chart sits centred between the image and the
     bottom of the blue section. */
  #zm-content div[data-screen-label$="Case Study"] section[data-screen-label="Results"] > div {
    transform: translateY(44px);
  }

  /* Case studies: CTA shapes a little closer to the button. */
  #zm-content div[data-screen-label$="Case Study"] section[data-screen-label="CTA"] > .zm-svc-mark:nth-of-type(1) { left: 14% !important; }
  #zm-content div[data-screen-label$="Case Study"] section[data-screen-label="CTA"] > .zm-svc-mark:nth-of-type(2) { right: 14% !important; }
  #zm-content div[data-screen-label$="Case Study"] section[data-screen-label="CTA"] > .zm-svc-mark:nth-of-type(3) { left: 14% !important; }
  #zm-content div[data-screen-label$="Case Study"] section[data-screen-label="CTA"] > .zm-svc-mark:nth-of-type(4) { right: 15% !important; }

  /* Mobile review cards: photo on the left, name and company right beside it. */
  #zm-content .zm-reviews-mobile > div > div[style*="border-top"] {
    justify-content: flex-start !important;
    text-align: left !important;
  }
  #zm-content .zm-reviews-mobile > div > div[style*="border-top"] > div {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  #zm-content .zm-reviews-mobile > div > div[style*="border-top"] > div:last-child {
    flex: 1 1 auto !important;
    text-align: left !important;
  }
}

/* Cache check, 17 Oct (no styling effect). */

/* Mobile fixes, round 2 (17 Oct). */
@media (max-width: 820px) {
  /* Card artwork panels: size by padding instead of aspect-ratio, which
     iPhone Safari collapses inside these flex cards. 140/220 = 63.64%. */
  #zm-content div[data-screen-label="Social Media"] .zm-svc-grid div[style*="height: 170px"],
  #zm-content div[data-screen-label="Services"] .zm-svc-grid div[style*="height: 190px"] {
    height: 0 !important;
    aspect-ratio: auto !important;
    padding-top: 63.64% !important;
    box-sizing: content-box !important;
  }

  /* Social Media headline: keep the space before "Growth Engine". */
  #zm-content div[data-screen-label="Social Media"] section[data-screen-label="Hero"] h1 > span {
    margin-left: 0.26em;
  }

  /* Portfolio hero (unlabelled section): room below the header. */
  #zm-content div[data-screen-label="Portfolio"] section[style*="max-width: 760px"] {
    padding-top: 36px !important;
  }
}

/* Card artwork panels: always visible on phones (17 Oct). */
@media (max-width: 820px) {
  #zm-content .zm-svc-grid div.zm-art { opacity: 1 !important; visibility: visible !important; overflow: visible !important; }
  #zm-content .zm-svc-grid div.zm-art::after { content: "" !important; display: block !important; opacity: 1 !important; visibility: visible !important; }
}

/* Card artwork panels on phones: full width. They have no in-flow content, so without this they shrink to 0px wide (17 Oct). */
@media (max-width: 820px) {
  #zm-content .zm-svc-grid div.zm-art { width: 100% !important; align-self: stretch !important; }
}

/* Home mobile hero: text group centred between the header and the photos (17 Oct). Moves headline, paragraph and See My Work up 20px as one unit; photos stay put. */
#zm-content section[data-screen-label="Hero mobile"] > div:nth-child(2) {
  transform: translateY(-20px);
}

/* Home About section: Learn more about me: text only (17 Oct). No outline, fill or pulse; keeps the blue text and arrow. */
#zm-content section[data-screen-label="About"] a[href*="about-me"],
#zm-content section[data-screen-label="About"] a[href*="about-me"]:hover,
#zm-content section[data-screen-label="About"] a[href*="about-me"]:focus {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  animation: none !important;
}

/* Home bento on phones: option D (17 Oct). Colored art band on top, text on white below, full-width cards, Client Love restored last. Remove this block to restore the previous mobile layout. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] > div > div { grid-template-columns: minmax(0, 1fr) !important; grid-auto-rows: auto !important; gap: 22px !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"], #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"], #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"], #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"], #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"] { --band: 190px; display: block !important; position: relative !important; height: auto !important; min-height: 0 !important; overflow: hidden !important; padding: calc(var(--band) + 18px) 20px 22px !important; color: var(--zm-ink) !important; border: 1px solid var(--zm-hairline) !important; grid-column: auto !important; grid-row: auto !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"]::after, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"]::after, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"]::after, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"]::after, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"]::after { content: ""; position: absolute; left: 0; right: 0; top: var(--band); bottom: 0; background: #fff; z-index: 3; pointer-events: none; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"] > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"] > div:first-child { position: relative !important; z-index: 4 !important; font-size: 20px !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2), #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] > div:nth-child(2), #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"] > div:nth-child(2), #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2), #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"] > div:nth-child(2) { position: static !important; z-index: auto !important; opacity: 1 !important; font-size: 16px !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) > div, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] > div:nth-child(2) > div, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"] > div:nth-child(2) > div, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"] > div:nth-child(2) > div { position: static !important; z-index: auto !important; height: auto !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) > div > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] > div:nth-child(2) > div > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"] > div:nth-child(2) > div > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"] > div:nth-child(2) > div > div:first-child { position: relative !important; z-index: 4 !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-clients-copy { position: relative !important; left: auto !important; top: auto !important; width: auto !important; max-width: none !important; z-index: 4 !important; margin: 0 !important; padding: 0 !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"] > div:first-child { color: var(--zm-navy) !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"] > div:first-child { color: #1E9E55 !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:first-child { color: #E04F48 !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] { --band: 120px; order: 6; display: block !important; }
#zm-content section[data-screen-label="Proof bento"] > div > div > div:has(.zm-star) { display: contents !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] [data-zm-x~="zm-x24"] { position: absolute !important; top: 38px !important; left: 50% !important; transform: translateX(-50%) !important; z-index: 2 !important; font-size: 34px !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-phone-pair { position: absolute !important; z-index: 2 !important; width: 33% !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-phone-pair--left { left: 15% !important; top: 18px !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-phone-pair--right { left: 52% !important; top: 6px !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-social-chart { position: absolute !important; left: 50% !important; top: 22px !important; width: 82% !important; margin: 0 !important; transform: translateX(-50%) !important; z-index: 2 !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-bento-phone { top: 26px !important; bottom: auto !important; width: 200px !important; transform: translateX(-50%) !important; z-index: 2 !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-design-mockup { left: 6% !important; right: auto !important; top: 34px !important; bottom: auto !important; width: 46% !important; z-index: 2 !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-design-wapuu { right: 2% !important; left: auto !important; top: 14px !important; bottom: auto !important; width: 46% !important; z-index: 2 !important; }
}
/* End home bento option D */

/* Home bento option D, round 2 (17 Oct): Clients text shown, Social stats up and 30% bigger, Year in Review emojis, bigger Wapuu. Phones only. */
@keyframes zm-emoji-bob { 0%, 100% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-8px) rotate(6deg); } }
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) > .zm-clients-copy { position: relative !important; z-index: 4 !important; color: var(--zm-ink) !important; opacity: 1 !important; left: auto !important; top: auto !important; width: auto !important; max-width: none !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) > .zm-clients-copy * { color: var(--zm-ink) !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-social-chart { top: 4px !important; transform: translateX(-50%) scale(1.3) !important; transform-origin: 50% 0 !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-design-wapuu { width: 61% !important; right: -8% !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"]::before { content: "\2764\FE0F"; left: 9%; top: 36px; position: absolute; z-index: 2; font-size: 26px; line-height: 1; pointer-events: none; animation: zm-emoji-bob 3.6s ease-in-out infinite; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::before { content: "\1F525"; right: 9%; top: 30px; position: absolute; z-index: 2; font-size: 26px; line-height: 1; pointer-events: none; animation: zm-emoji-bob 3.6s ease-in-out infinite; animation-duration: 4.2s; animation-delay: -1.1s; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::after { content: "\1F4AC"; left: 13%; top: 122px; position: absolute; z-index: 2; font-size: 26px; line-height: 1; pointer-events: none; animation: zm-emoji-bob 3.6s ease-in-out infinite; animation-duration: 4.8s; animation-delay: -2.3s; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div::before { content: "\1F44F"; right: 12%; top: 114px; position: absolute; z-index: 2; font-size: 26px; line-height: 1; pointer-events: none; animation: zm-emoji-bob 3.6s ease-in-out infinite; animation-duration: 3.9s; animation-delay: -0.6s; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div::after { content: "\2728"; right: 31%; top: 6px; font-size: 20px; position: absolute; z-index: 2; line-height: 1; pointer-events: none; animation: zm-emoji-bob 5.2s ease-in-out infinite; animation-delay: -3s; }
}
@media (prefers-reduced-motion: reduce) { #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"]::before, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::before, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::after, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div::before, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div::after { animation: none !important; } }
/* End home bento option D, round 2 */

/* Home bento option D, round 3 (17 Oct): bigger Wapuu, sticker emojis (4), Social stats centred in band, Clients text left. Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] .zm-design-wapuu { width: 70% !important; right: -14% !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"]::before, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::before, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::after, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div::before { filter: drop-shadow(1.5px 0 0 #fff) drop-shadow(-1.5px 0 0 #fff) drop-shadow(0 1.5px 0 #fff) drop-shadow(0 -1.5px 0 #fff) drop-shadow(0 2px 3px rgba(27, 66, 97, 0.25)) !important; font-size: 28px !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div::after { content: none !important; display: none !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-social-chart { top: calc(var(--band) / 2) !important; left: 50% !important; margin: 0 !important; transform: translate(-50%, -62%) scale(1.3) !important; transform-origin: 50% 50% !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:first-child, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) > .zm-clients-copy, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) > .zm-clients-copy * { text-align: left !important; margin-left: 0 !important; margin-right: 0 !important; }
}
/* End home bento option D, round 3 */

/* Home bento option D, round 4 (17 Oct): Wapuu and Social stats may overflow card edges, thicker sticker outline, Social stats 10% larger, Clients copy full width and left. Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"], #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"] { overflow: visible !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"]::after, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"]::after { border-radius: 0 0 11px 11px; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"]::before, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::before, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::after, #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div::before { filter: drop-shadow(2.5px 0 0 #fff) drop-shadow(-2.5px 0 0 #fff) drop-shadow(0 2.5px 0 #fff) drop-shadow(0 -2.5px 0 #fff) drop-shadow(0 2px 3px rgba(27, 66, 97, 0.25)) !important; }
#zm-content section[data-screen-label="Proof bento"] .zm-social-chart { transform: translate(-50%, -62%) scale(1.43) !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) { display: block !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) > .zm-clients-copy { display: block !important; width: 100% !important; max-width: none !important; align-self: stretch !important; justify-self: stretch !important; left: 0 !important; right: auto !important; transform: none !important; padding: 0 !important; text-indent: 0 !important; text-align: left !important; }
}
/* End home bento option D, round 4 */

/* Home bento option D, round 6 (17 Oct): Social stats back to the previous size and shown above the white panel, so they overflow the green band. Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] .zm-social-chart { z-index: 5 !important; top: calc(var(--band) / 2 - 20px) !important; }
}
/* End home bento option D, round 6 */

/* Home bento option D, round 7 (17 Oct): My Clients paragraph starts flush under the title. Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) { display: block !important; margin: 0 !important; padding: 0 !important; text-indent: 0 !important; transform: none !important; translate: none !important; left: auto !important; width: auto !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"] > div:nth-child(2) > .zm-clients-copy { display: block !important; float: none !important; margin: 0 !important; padding: 0 !important; text-indent: 0 !important; transform: none !important; translate: none !important; left: 0 !important; right: auto !important; width: 100% !important; max-width: none !important; text-align: left !important; }
}
/* End home bento option D, round 7 */

/* Home bento option D, round 8 (17 Oct): Year in Review stickers use the uploaded heart, fire, message and like images. Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"]::before { content: "" !important; width: 34px; height: 34px; font-size: 0 !important; background: no-repeat center / contain; background-image: url("https://zachery-mimbs.com/wp-content/uploads/2026/10/hearemoji-new.png"); }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::before { content: "" !important; width: 34px; height: 34px; font-size: 0 !important; background: no-repeat center / contain; background-image: url("https://zachery-mimbs.com/wp-content/uploads/2026/10/firemeoji8.png"); }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::after { content: "" !important; width: 34px; height: 34px; font-size: 0 !important; background: no-repeat center / contain; background-image: url("https://zachery-mimbs.com/wp-content/uploads/2026/10/message5.png"); }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div::before { content: "" !important; width: 34px; height: 34px; font-size: 0 !important; background: no-repeat center / contain; background-image: url("https://zachery-mimbs.com/wp-content/uploads/2026/10/likeemoji.png"); }
}
/* End home bento option D, round 8 */

/* Home bento option D, round 9 (17 Oct): Year in Review stickers use images with smooth baked-in white outlines; one soft shadow replaces the four stacked outline shadows. Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"]::before { width: 42px; height: 42px; filter: drop-shadow(0 2px 3px rgba(27, 66, 97, 0.28)) !important; background-image: url("https://zachery-mimbs.com/wp-content/uploads/2026/10/sticker-heart.webp"); }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::before { width: 42px; height: 42px; filter: drop-shadow(0 2px 3px rgba(27, 66, 97, 0.28)) !important; background-image: url("https://zachery-mimbs.com/wp-content/uploads/2026/10/sticker-fire.webp"); }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2)::after { width: 42px; height: 42px; filter: drop-shadow(0 2px 3px rgba(27, 66, 97, 0.28)) !important; background-image: url("https://zachery-mimbs.com/wp-content/uploads/2026/10/sticker-message.webp"); }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"] > div:nth-child(2) > div::before { width: 42px; height: 42px; filter: drop-shadow(0 2px 3px rgba(27, 66, 97, 0.28)) !important; background-image: url("https://zachery-mimbs.com/wp-content/uploads/2026/10/sticker-like.webp"); }
}
/* End home bento option D, round 9 */

/* Home bento option D, round 10 (17 Oct): Wapuu shown above the white panel so he overflows the bottom of the Design band. Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] .zm-design-wapuu { z-index: 5 !important; }
}
/* End home bento option D, round 10 */

/* Home bento option D, round 11 (17 Oct): Client Love band shows two stacked review cards (option 4, 20% larger). Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] { --band: 170px !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] [data-zm-x~="zm-x24"] { display: none !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"]::before { content: "\2605\2605\2605\2605\2605" !important; position: absolute; z-index: 2; width: 65%; height: 90px; box-sizing: border-box; padding: 13px 15px; border-radius: 12px; background-color: #fff; background-image: linear-gradient(#E2E9F3, #E2E9F3), linear-gradient(#E2E9F3, #E2E9F3); background-repeat: no-repeat; background-position: 15px 48px, 15px 64px; color: #FFC83D; font-size: 17px; letter-spacing: 2px; line-height: 1; box-shadow: 0 6px 14px rgba(27, 66, 97, 0.18); pointer-events: none; left: 8%; top: 24px; background-size: 78% 8px, 52% 8px; transform: rotate(-6deg); }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] > div:nth-child(2)::before { content: "\2605\2605\2605\2605\2605" !important; position: absolute; z-index: 2; width: 65%; height: 90px; box-sizing: border-box; padding: 13px 15px; border-radius: 12px; background-color: #fff; background-image: linear-gradient(#E2E9F3, #E2E9F3), linear-gradient(#E2E9F3, #E2E9F3); background-repeat: no-repeat; background-position: 15px 48px, 15px 64px; color: #FFC83D; font-size: 17px; letter-spacing: 2px; line-height: 1; box-shadow: 0 6px 14px rgba(27, 66, 97, 0.18); pointer-events: none; left: 27%; top: 70px; background-size: 74% 8px, 46% 8px; transform: rotate(4deg); }
}
/* End home bento option D, round 11 */

/* Home bento option D, round 12 (17 Oct): more breathing room. 37px between cards, roomier text padding. Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Proof bento"] > div > div { gap: 37px !important; }
#zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x22"], #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"], #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x25"], #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x26"], #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x27"] { padding: calc(var(--band) + 24px) 24px 28px !important; }
}
/* End home bento option D, round 12 */

/* Home About section: Learn more about me: 20px to match the subheading, arrow 22px (17 Oct). All screens. */
#zm-content section[data-screen-label="About"] a[href*="about-me"] { font-size: 20px !important; }
#zm-content section[data-screen-label="About"] a[href*="about-me"] * { font-size: inherit !important; }
#zm-content section[data-screen-label="About"] a[href*="about-me"] svg { width: 22px !important; height: 22px !important; }

/* Feeds band on phones: more blue above and below (17 Oct). 56px to 88px. Phones only. */
@media (max-width: 820px) {
#zm-content section[data-screen-label="Feeds band"] { padding-top: 88px !important; padding-bottom: 88px !important; }
}

/* Content Ideas hero on phones (17 Oct): matches the other page heroes. Blue pill label, centred two-line headline (30 Days in blue), audience line, centred paragraph. Phones only. */
@media (max-width: 820px) {
#zm-content [data-zm-page="30-days-of-content"] .zm-ebook-lead { text-align: center !important; display: flex !important; flex-direction: column; align-items: center; gap: 14px; }
#zm-content [data-zm-page="30-days-of-content"] .zm-ebook-lead h1 { font-size: 0 !important; line-height: 1.2 !important; text-align: center !important; margin: 0 !important; }
#zm-content [data-zm-page="30-days-of-content"] .zm-ebook-lead h1::before { content: "Free guide"; display: block; width: max-content; margin: 0 auto 16px; padding: 9px 20px; border-radius: 10px; background: #1877BD; color: #fff; font-size: 13px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; line-height: 1.2; }
#zm-content [data-zm-page="30-days-of-content"] .zm-ebook-lead h1 span[style*="38px"] { font-size: 28px !important; font-weight: 600 !important; line-height: 1.25 !important; }
#zm-content [data-zm-page="30-days-of-content"] .zm-ebook-lead h1 span[style*="22px"] { display: inline-block; font-size: 18px !important; font-weight: 600 !important; margin-top: 10px; color: var(--zm-ink); }
#zm-content [data-zm-page="30-days-of-content"] .zm-ebook-lead p { text-align: center !important; max-width: 34ch !important; margin: 0 auto !important; }
}

/* Content Ideas signup form visible on phones (17 Oct). The theme hides the last box in .zm-ebook-split on phones, which on this page is the form column. */
@media (max-width: 820px) {
#zm-content [data-zm-page="30-days-of-content"] .zm-ebook-split > .zm-ebook-copy-col { display: flex !important; }
}

/* Content Ideas CTA on phones (17 Oct): stage fits the screen so all four shapes show, placed like the case study CTAs; tighter spacing. Phones only. */
@media (max-width: 820px) {
#zm-content [data-zm-page="30-days-of-content"] section#cta { padding: 70px 20px 90px !important; min-height: 0 !important; }
#zm-content [data-zm-page="30-days-of-content"] section#cta .zm-cta-stage { left: 0 !important; right: 0 !important; margin-left: 0 !important; width: 100% !important; }
#zm-content [data-zm-page="30-days-of-content"] section#cta .zm-svc-mark { display: block !important; }
#zm-content [data-zm-page="30-days-of-content"] section#cta .zm-svc-mark:nth-of-type(1) { left: 14% !important; right: auto !important; top: 50% !important; bottom: auto !important; margin-top: -82px !important; }
#zm-content [data-zm-page="30-days-of-content"] section#cta .zm-svc-mark:nth-of-type(2) { right: 14% !important; left: auto !important; top: 50% !important; bottom: auto !important; margin-top: -80px !important; }
#zm-content [data-zm-page="30-days-of-content"] section#cta .zm-svc-mark:nth-of-type(3) { left: 14% !important; right: auto !important; bottom: 43px !important; top: auto !important; margin-top: 0 !important; }
#zm-content [data-zm-page="30-days-of-content"] section#cta .zm-svc-mark:nth-of-type(4) { right: 15% !important; left: auto !important; bottom: 37px !important; top: auto !important; margin-top: 0 !important; }
}

/* Content Strategy on phones (17 Oct): animated laptop v2 (SVG animation tags so iPhone Safari animates it), 333x237, sits on the edge between the hero and the blue Blogs section. Phones only. */
@media (max-width: 820px) {
  #zm-content section[data-screen-label="Hero"]:has(+ section[data-screen-label="Blogs"]) { position: relative !important; z-index: 3 !important; padding-bottom: 134px !important; }
  #zm-content section[data-screen-label="Hero"]:has(+ section[data-screen-label="Blogs"])::after { content: ""; position: absolute; left: 50%; bottom: -142px; width: 333px; height: 237px; transform: translateX(-50%); background: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 280 200%27%3E%3Cdefs%3E%3CclipPath id=%27s%27%3E%3Crect x=%2736%27 y=%2716%27 width=%27196%27 height=%27126%27 rx=%274%27/%3E%3C/clipPath%3E%3ClinearGradient id=%27g%27 x1=%270%27 y1=%270%27 x2=%270%27 y2=%271%27%3E%3Cstop offset=%270%27 stop-color=%27%231877BD%27 stop-opacity=%27.28%27/%3E%3Cstop offset=%271%27 stop-color=%27%231877BD%27 stop-opacity=%270%27/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x=%2728%27 y=%278%27 width=%27212%27 height=%27142%27 rx=%2711%27 fill=%27%231d1d1f%27/%3E%3Crect x=%2729.5%27 y=%279.5%27 width=%27209%27 height=%27139%27 rx=%2710%27 fill=%27none%27 stroke=%27%233a3a3d%27/%3E%3Cg clip-path=%27url(%23s)%27%3E%3Crect x=%2736%27 y=%2716%27 width=%27196%27 height=%27126%27 fill=%27%23fff%27/%3E%3Crect x=%2736%27 y=%2716%27 width=%27196%27 height=%2714%27 fill=%27%23EEF3FA%27/%3E%3Ccircle cx=%2744%27 cy=%2723%27 r=%272.4%27 fill=%27%23FE5E5E%27/%3E%3Ccircle cx=%2752%27 cy=%2723%27 r=%272.4%27 fill=%27%23FFDE59%27/%3E%3Ccircle cx=%2760%27 cy=%2723%27 r=%272.4%27 fill=%27%2301C063%27/%3E%3Crect x=%2770%27 y=%2719.5%27 width=%27118%27 height=%277%27 rx=%273.5%27 fill=%27%23fff%27/%3E%3Crect x=%2748%27 y=%2738%27 width=%27172%27 height=%2740%27 rx=%275%27 fill=%27%23D6E6F7%27/%3E%3Cpath d=%27M62 74 L84 54 L100 66 L114 56 L136 74 Z%27 fill=%27%239EC3EA%27/%3E%3Ccircle cx=%27196%27 cy=%2750%27 r=%276%27 fill=%27%23FFDE59%27/%3E%3Crect x=%2748%27 y=%2786%27 width=%270%27 height=%277%27 rx=%273%27 fill=%27%231B4261%27%3E%3Canimate attributeName=%27width%27 values=%270;0;138;138;0%27 keyTimes=%270;.08;.28;.82;1%27 begin=%270s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%2748%27 y=%27100%27 width=%270%27 height=%274.5%27 rx=%272%27 fill=%27%23C9D6E6%27%3E%3Canimate attributeName=%27width%27 values=%270;0;166;166;0%27 keyTimes=%270;.08;.28;.82;1%27 begin=%270.25s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%2748%27 y=%27110%27 width=%270%27 height=%274.5%27 rx=%272%27 fill=%27%23C9D6E6%27%3E%3Canimate attributeName=%27width%27 values=%270;0;158;158;0%27 keyTimes=%270;.08;.28;.82;1%27 begin=%270.45s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%2748%27 y=%27120%27 width=%270%27 height=%274.5%27 rx=%272%27 fill=%27%23C9D6E6%27%3E%3Canimate attributeName=%27width%27 values=%270;0;170;170;0%27 keyTimes=%270;.08;.28;.82;1%27 begin=%270.65s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%2748%27 y=%27130%27 width=%270%27 height=%274.5%27 rx=%272%27 fill=%27%23C9D6E6%27%3E%3Canimate attributeName=%27width%27 values=%270;0;118;118;0%27 keyTimes=%270;.08;.28;.82;1%27 begin=%270.85s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3C/g%3E%3Crect x=%2730%27 y=%27148%27 width=%27208%27 height=%274%27 fill=%27%232b2b2e%27/%3E%3Cpath d=%27M30 152 H238 L262 180 Q264 184 258 184 H10 Q4 184 6 180 Z%27 fill=%27%23DCE1E8%27/%3E%3Cpath d=%27M6 180 Q4 184 10 184 H258 Q264 184 262 180 Z%27 fill=%27%23C3CAD4%27/%3E%3Cpath d=%27M10 184 H258 Q258 188 250 188 H18 Q10 188 10 184 Z%27 fill=%27%23AEB6C2%27/%3E%3Cg fill=%27%23C3CAD4%27%3E%3Cpath d=%27M40 156 H228 L231 160 H37 Z%27/%3E%3Cpath d=%27M36 162 H232 L235 166 H33 Z%27/%3E%3Cpath d=%27M32 168 H236 L239 172 H29 Z%27/%3E%3C/g%3E%3Cpath d=%27M114 174 H154 L156 182 H112 Z%27 fill=%27%23CBD1DA%27/%3E%3Cg%3E%3CanimateTransform attributeName=%27transform%27 type=%27translate%27 values=%270 0;0 -4;0 0%27 dur=%273.2s%27 repeatCount=%27indefinite%27 calcMode=%27spline%27 keySplines=%27.4 0 .6 1;.4 0 .6 1%27/%3E%3Crect x=%27184%27 y=%2766%27 width=%2792%27 height=%2782%27 rx=%2710%27 fill=%27%23fff%27 stroke=%27%23E2E9F3%27/%3E%3Cg stroke=%27%23EEF2F7%27%3E%3Cline x1=%27194%27 y1=%2780%27 x2=%27266%27 y2=%2780%27/%3E%3Cline x1=%27194%27 y1=%2796%27 x2=%27266%27 y2=%2796%27/%3E%3Cline x1=%27194%27 y1=%27112%27 x2=%27266%27 y2=%27112%27/%3E%3Cline x1=%27194%27 y1=%27128%27 x2=%27266%27 y2=%27128%27/%3E%3C/g%3E%3Cline x1=%27194%27 y1=%27138%27 x2=%27266%27 y2=%27138%27 stroke=%27%23C9D6E6%27 stroke-width=%271.5%27/%3E%3Crect x=%27197%27 y=%27138%27 width=%278%27 height=%270%27 rx=%272%27 fill=%27%23D6E6F7%27%3E%3Canimate attributeName=%27height%27 values=%270;0;10;10;0%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27y%27 values=%27138;138;128;128;138%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%27209%27 y=%27138%27 width=%278%27 height=%270%27 rx=%272%27 fill=%27%23D6E6F7%27%3E%3Canimate attributeName=%27height%27 values=%270;0;16;16;0%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.12s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27y%27 values=%27138;138;122;122;138%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.12s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%27221%27 y=%27138%27 width=%278%27 height=%270%27 rx=%272%27 fill=%27%23D6E6F7%27%3E%3Canimate attributeName=%27height%27 values=%270;0;24;24;0%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.24s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27y%27 values=%27138;138;114;114;138%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.24s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%27233%27 y=%27138%27 width=%278%27 height=%270%27 rx=%272%27 fill=%27%23D6E6F7%27%3E%3Canimate attributeName=%27height%27 values=%270;0;34;34;0%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.36s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27y%27 values=%27138;138;104;104;138%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.36s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%27245%27 y=%27138%27 width=%278%27 height=%270%27 rx=%272%27 fill=%27%23D6E6F7%27%3E%3Canimate attributeName=%27height%27 values=%270;0;46;46;0%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.48s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27y%27 values=%27138;138;92;92;138%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.48s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%27257%27 y=%27138%27 width=%278%27 height=%270%27 rx=%272%27 fill=%27%23B9D6F2%27%3E%3Canimate attributeName=%27height%27 values=%270;0;60;60;0%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.6s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27y%27 values=%27138;138;78;78;138%27 keyTimes=%270;.06;.22;.86;1%27 begin=%270.6s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Cpath d=%27M201 124 L213 118 L225 110 L237 100 L249 88 L261 74 L261 138 L201 138 Z%27 fill=%27url(%23g)%27 opacity=%270%27%3E%3Canimate attributeName=%27opacity%27 values=%270;0;1;1;0%27 keyTimes=%270;.4;.7;.88;1%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/path%3E%3Cpolyline points=%27201,124 213,118 225,110 237,100 249,88 261,74%27 fill=%27none%27 stroke=%27%231877BD%27 stroke-width=%272.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-dasharray=%27110%27 stroke-dashoffset=%27110%27%3E%3Canimate attributeName=%27stroke-dashoffset%27 values=%27110;110;0;0;110%27 keyTimes=%270;.2;.7;.88;1%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/polyline%3E%3Ccircle cx=%27261%27 cy=%2774%27 r=%274%27 fill=%27none%27 stroke=%27%2301C063%27 stroke-width=%272%27 opacity=%270%27%3E%3Canimate attributeName=%27r%27 values=%274;4;4;9.6;9.6%27 keyTimes=%270;.72;.8;.9;1%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27opacity%27 values=%270;0;.5;0;0%27 keyTimes=%270;.72;.8;.9;1%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/circle%3E%3Ccircle cx=%27261%27 cy=%2774%27 r=%270%27 fill=%27%2301C063%27 stroke=%27%23fff%27 stroke-width=%271.5%27%3E%3Canimate attributeName=%27r%27 values=%270;0;5.6;4;4;0%27 keyTimes=%270;.66;.72;.78;.88;1%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/circle%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain; pointer-events: none; z-index: 3; }
  #zm-content section[data-screen-label="Hero"] + section[data-screen-label="Blogs"] { padding-top: 172px !important; }
}
/* End Content Strategy laptop v2 */

/* Content Strategy Newsletters on phones (17 Oct): animated laptop (newsletter on screen, envelopes, bell, @) replaces the static image in the same 4:3 frame. Phones only. */
@media (max-width: 820px) {
  #zm-content section[data-screen-label="Newsletters"] div:has(> img[src*="cs-news-art"]) { background: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 380 366%27%3E %3Cg stroke=%27%23fff%27 stroke-width=%2736%27 stroke-linejoin=%27round%27 fill=%27%23fff%27%3E%3Cpolygon points=%2744.8,256.0 218.0,156.0 204.2,18.0 31.0,118.0%27/%3E%3Cpolygon points=%2746.0,268.0 219.2,168.0 331.8,233.0 158.6,333.0%27/%3E%3Cpolygon points=%27331.8,233.0 158.6,333.0 158.6,346.0 331.8,246.0%27/%3E%3Cpolygon points=%2746.0,268.0 158.6,333.0 158.6,346.0 46.0,281.0%27/%3E%3C/g%3E %3Cpolygon points=%27331.8,233.0 158.6,333.0 158.6,346.0 331.8,246.0%27 fill=%27%237F868F%27 stroke=%27%237F868F%27 stroke-width=%2716%27 stroke-linejoin=%27round%27/%3E %3Cpolygon points=%2746.0,268.0 158.6,333.0 158.6,346.0 46.0,281.0%27 fill=%27%23B3B9C1%27 stroke=%27%23B3B9C1%27 stroke-width=%2716%27 stroke-linejoin=%27round%27/%3E %3Cpolygon points=%2746.0,268.0 219.2,168.0 331.8,233.0 158.6,333.0%27 fill=%27%23ECEEF1%27 stroke=%27%23ECEEF1%27 stroke-width=%2724%27 stroke-linejoin=%27round%27/%3E %3Cg fill=%27%2326282C%27 stroke=%27%2326282C%27 stroke-width=%271.6%27 stroke-linejoin=%27round%27%3E%3Cpolygon points=%2781.5,271.5 89.8,266.7 97.3,271.0 89.0,275.8%27/%3E%3Cpolygon points=%2792.9,264.9 101.2,260.1 108.6,264.4 100.3,269.2%27/%3E%3Cpolygon points=%27104.2,258.4 112.5,253.6 120.0,257.9 111.6,262.7%27/%3E%3Cpolygon points=%27115.5,251.8 123.9,247.1 131.3,251.4 123.0,256.1%27/%3E%3Cpolygon points=%27126.9,245.3 135.2,240.5 142.6,244.8 134.3,249.6%27/%3E%3Cpolygon points=%27138.2,238.8 146.5,233.9 154.0,238.2 145.7,243.1%27/%3E%3Cpolygon points=%27149.6,232.2 157.9,227.4 165.3,231.7 157.0,236.5%27/%3E%3Cpolygon points=%27160.9,225.7 169.2,220.8 176.7,225.2 168.4,230.0%27/%3E%3Cpolygon points=%27172.3,219.1 180.6,214.3 188.0,218.6 179.7,223.4%27/%3E%3Cpolygon points=%27183.6,212.6 191.9,207.8 199.4,212.1 191.1,216.9%27/%3E%3Cpolygon points=%27195.0,206.0 203.3,201.2 210.7,205.5 202.4,210.3%27/%3E%3Cpolygon points=%27206.3,199.4 214.6,194.7 222.1,199.0 213.7,203.8%27/%3E%3Cpolygon points=%27217.6,192.9 226.0,188.1 233.4,192.4 225.1,197.2%27/%3E%3Cpolygon points=%2791.6,277.3 99.9,272.5 107.3,276.8 99.0,281.6%27/%3E%3Cpolygon points=%27102.9,270.8 111.2,265.9 118.7,270.2 110.3,275.1%27/%3E%3Cpolygon points=%27114.2,264.2 122.6,259.4 130.0,263.7 121.7,268.5%27/%3E%3Cpolygon points=%27125.6,257.6 133.9,252.9 141.3,257.2 133.0,261.9%27/%3E%3Cpolygon points=%27136.9,251.1 145.2,246.3 152.7,250.6 144.4,255.4%27/%3E%3Cpolygon points=%27148.3,244.6 156.6,239.8 164.0,244.0 155.7,248.8%27/%3E%3Cpolygon points=%27159.6,238.0 167.9,233.2 175.4,237.5 167.1,242.3%27/%3E%3Cpolygon points=%27171.0,231.5 179.3,226.7 186.7,230.9 178.4,235.8%27/%3E%3Cpolygon points=%27182.3,224.9 190.6,220.1 198.1,224.4 189.8,229.2%27/%3E%3Cpolygon points=%27193.7,218.4 202.0,213.6 209.4,217.8 201.1,222.7%27/%3E%3Cpolygon points=%27205.0,211.8 213.3,207.0 220.8,211.3 212.5,216.1%27/%3E%3Cpolygon points=%27216.3,205.2 224.7,200.5 232.1,204.8 223.8,209.5%27/%3E%3Cpolygon points=%27227.7,198.7 236.0,193.9 243.5,198.2 235.1,203.0%27/%3E%3Cpolygon points=%27101.6,283.1 109.9,278.3 117.4,282.6 109.0,287.4%27/%3E%3Cpolygon points=%27112.9,276.6 121.3,271.8 128.7,276.1 120.4,280.8%27/%3E%3Cpolygon points=%27124.3,270.0 132.6,265.2 140.1,269.5 131.7,274.3%27/%3E%3Cpolygon points=%27135.6,263.4 143.9,258.7 151.4,262.9 143.1,267.8%27/%3E%3Cpolygon points=%27147.0,256.9 155.3,252.1 162.7,256.4 154.4,261.2%27/%3E%3Cpolygon points=%27158.3,250.3 166.6,245.5 174.1,249.8 165.8,254.7%27/%3E%3Cpolygon points=%27169.7,243.8 178.0,239.0 185.4,243.3 177.1,248.1%27/%3E%3Cpolygon points=%27181.0,237.2 189.3,232.4 196.8,236.8 188.5,241.6%27/%3E%3Cpolygon points=%27192.4,230.7 200.7,225.9 208.1,230.2 199.8,235.0%27/%3E%3Cpolygon points=%27203.7,224.2 212.0,219.3 219.5,223.7 211.2,228.5%27/%3E%3Cpolygon points=%27215.0,217.6 223.4,212.8 230.8,217.1 222.5,221.9%27/%3E%3Cpolygon points=%27226.4,211.0 234.7,206.2 242.2,210.6 233.8,215.3%27/%3E%3Cpolygon points=%27237.7,204.5 246.1,199.7 253.5,204.0 245.2,208.8%27/%3E%3Cpolygon points=%27111.6,288.9 120.0,284.1 127.4,288.4 119.1,293.2%27/%3E%3Cpolygon points=%27123.0,282.3 131.3,277.6 138.8,281.9 130.4,286.6%27/%3E%3Cpolygon points=%27134.3,275.8 142.6,271.0 150.1,275.3 141.8,280.1%27/%3E%3Cpolygon points=%27145.7,269.2 154.0,264.4 161.4,268.8 153.1,273.6%27/%3E%3Cpolygon points=%27157.0,262.7 165.3,257.9 172.8,262.2 164.5,267.0%27/%3E%3Cpolygon points=%27168.4,256.1 176.7,251.3 184.1,255.6 175.8,260.4%27/%3E%3Cpolygon points=%27179.7,249.6 188.0,244.8 195.5,249.1 187.2,253.9%27/%3E%3Cpolygon points=%27191.1,243.1 199.4,238.2 206.8,242.5 198.5,247.3%27/%3E%3Cpolygon points=%27202.4,236.5 210.7,231.7 218.2,236.0 209.9,240.8%27/%3E%3Cpolygon points=%27213.7,230.0 222.1,225.2 229.5,229.4 221.2,234.2%27/%3E%3Cpolygon points=%27225.1,223.4 233.4,218.6 240.9,222.9 232.5,227.7%27/%3E%3Cpolygon points=%27236.4,216.8 244.8,212.1 252.2,216.3 243.9,221.1%27/%3E%3Cpolygon points=%27247.8,210.3 256.1,205.5 263.5,209.8 255.2,214.6%27/%3E%3Cpolygon points=%27121.7,294.7 130.0,289.9 137.5,294.2 129.1,299.0%27/%3E%3Cpolygon points=%27133.0,288.1 141.3,283.4 148.8,287.6 140.5,292.4%27/%3E%3Cpolygon points=%27144.4,281.6 152.7,276.8 160.1,281.1 151.8,285.9%27/%3E%3Cpolygon points=%27155.7,275.1 164.0,270.2 171.5,274.6 163.2,279.4%27/%3E%3Cpolygon points=%27167.1,268.5 175.4,263.7 182.8,268.0 174.5,272.8%27/%3E%3Cpolygon points=%27178.4,261.9 186.7,257.1 194.2,261.4 185.9,266.2%27/%3E%3Cpolygon points=%27189.8,255.4 198.1,250.6 205.5,254.9 197.2,259.7%27/%3E%3Cpolygon points=%27201.1,248.9 209.4,244.1 216.9,248.3 208.6,253.2%27/%3E%3Cpolygon points=%27212.5,242.3 220.8,237.5 228.2,241.8 219.9,246.6%27/%3E%3Cpolygon points=%27223.8,235.8 232.1,230.9 239.6,235.2 231.2,240.1%27/%3E%3Cpolygon points=%27235.1,229.2 243.5,224.4 250.9,228.7 242.6,233.5%27/%3E%3Cpolygon points=%27246.5,222.6 254.8,217.9 262.2,222.2 253.9,226.9%27/%3E%3Cpolygon points=%27257.8,216.1 266.1,211.3 273.6,215.6 265.3,220.4%27/%3E%3C/g%3E %3Cpolygon points=%27186.3,277.0 234.8,249.0 261.6,264.5 213.1,292.5%27 fill=%27%23E4E7EB%27 stroke=%27%23B5BBC3%27 stroke-width=%273%27 stroke-linejoin=%27round%27/%3E %3Cpolygon points=%2744.8,256.0 218.0,156.0 204.2,18.0 31.0,118.0%27 fill=%27%231E1F22%27 stroke=%27%231E1F22%27 stroke-width=%2724%27 stroke-linejoin=%27round%27/%3E %3Cg transform=%27matrix(0.8660,-0.5000,0.1,1,27.14,116.00)%27%3E%3CclipPath id=%27sc%27%3E%3Crect x=%270%27 y=%270%27 width=%27208%27 height=%27146%27 rx=%277%27/%3E%3C/clipPath%3E%3Cg clip-path=%27url(%23sc)%27%3E%3Cg transform=%27scale(1.1556,1.1231)%27%3E %3Crect x=%270%27 y=%270%27 width=%27180%27 height=%27130%27 fill=%27%23F6F9FE%27/%3E %3Crect x=%270%27 y=%270%27 width=%27180%27 height=%2718%27 fill=%27%231877BD%27/%3E %3Ccircle cx=%2713%27 cy=%279%27 r=%274.5%27 fill=%27%23fff%27/%3E %3Crect x=%2722%27 y=%276.5%27 width=%2740%27 height=%275%27 rx=%272.5%27 fill=%27%23fff%27 opacity=%27.85%27/%3E %3Crect x=%2714%27 y=%2726%27 width=%27152%27 height=%2740%27 rx=%277%27 fill=%27%23D6E6F7%27/%3E %3Cpath d=%27M28 62 L50 44 L64 54 L76 46 L96 62 Z%27 fill=%27%239EC3EA%27 stroke=%27%239EC3EA%27 stroke-width=%273%27 stroke-linejoin=%27round%27/%3E%3Ccircle cx=%27148%27 cy=%2738%27 r=%276%27 fill=%27%23FFDE59%27/%3E %3Crect x=%2714%27 y=%2774%27 width=%270%27 height=%277%27 rx=%273.5%27 fill=%27%231B4261%27%3E%3Canimate attributeName=%27width%27 values=%270;0;110;110;0%27 keyTimes=%270;.06;.24;.86;1%27 begin=%270s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%2714%27 y=%2787%27 width=%270%27 height=%274.5%27 rx=%272.25%27 fill=%27%23C9D6E6%27%3E%3Canimate attributeName=%27width%27 values=%270;0;150;150;0%27 keyTimes=%270;.06;.24;.86;1%27 begin=%270.2s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%2714%27 y=%2796%27 width=%270%27 height=%274.5%27 rx=%272.25%27 fill=%27%23C9D6E6%27%3E%3Canimate attributeName=%27width%27 values=%270;0;140;140;0%27 keyTimes=%270;.06;.24;.86;1%27 begin=%270.35s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E%3Crect x=%2714%27 y=%27105%27 width=%270%27 height=%274.5%27 rx=%272.25%27 fill=%27%23C9D6E6%27%3E%3Canimate attributeName=%27width%27 values=%270;0;120;120;0%27 keyTimes=%270;.06;.24;.86;1%27 begin=%270.5s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3C/rect%3E %3Crect x=%2714%27 y=%27114%27 width=%2746%27 height=%2711%27 rx=%275.5%27 fill=%27%231877BD%27/%3E%3Crect x=%2721%27 y=%27118.5%27 width=%2732%27 height=%272.5%27 rx=%271.25%27 fill=%27%23fff%27/%3E %3C/g%3E%3C/g%3E%3C/g%3E %3Ccircle cx=%27116.8%27 cy=%2760.0%27 r=%272.2%27 fill=%27%23000%27/%3E%3Ccircle cx=%27116.4%27 cy=%2759.5%27 r=%27.7%27 fill=%27%233a3d44%27/%3E %3Cg transform=%27translate(205,120)%27%3E%3Cg opacity=%270%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27translate%27 values=%270 0;0 0;31.5 -35.1;70.0 -78.0;70.0 -78.0%27 keyTimes=%270;.04;.3;.62;1%27 calcMode=%27spline%27 keySplines=%270 0 1 1;.3 0 .6 1;.3 0 .7 1;0 0 1 1%27 begin=%270s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27opacity%27 values=%270;0;1;1;0;0%27 keyTimes=%270;.04;.1;.5;.62;1%27 begin=%270s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Cg transform=%27rotate(-10) scale(1.0)%27%3E%3Cg%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%27.4;.4;1;1%27 keyTimes=%270;.04;.16;1%27 begin=%270s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Crect x=%27-22%27 y=%27-15%27 width=%2744%27 height=%2730%27 rx=%275%27 fill=%27%23fff%27 stroke=%27%23fff%27 stroke-width=%273%27/%3E%3Crect x=%27-22%27 y=%27-15%27 width=%2744%27 height=%2730%27 rx=%275%27 fill=%27%23fff%27 stroke=%27%23C9D6E6%27 stroke-width=%271.5%27/%3E%3Cpath d=%27M-20 -12 L0 3 L20 -12%27 fill=%27none%27 stroke=%27%231877BD%27 stroke-width=%273%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform=%27translate(205,120)%27%3E%3Cg opacity=%270%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27translate%27 values=%270 0;0 0;43.2 -13.5;96.0 -30.0;96.0 -30.0%27 keyTimes=%270;.04;.3;.62;1%27 calcMode=%27spline%27 keySplines=%270 0 1 1;.3 0 .6 1;.3 0 .7 1;0 0 1 1%27 begin=%272s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27opacity%27 values=%270;0;1;1;0;0%27 keyTimes=%270;.04;.1;.5;.62;1%27 begin=%272s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Cg transform=%27rotate(8) scale(0.82)%27%3E%3Cg%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%27.4;.4;1;1%27 keyTimes=%270;.04;.16;1%27 begin=%272s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Crect x=%27-22%27 y=%27-15%27 width=%2744%27 height=%2730%27 rx=%275%27 fill=%27%23fff%27 stroke=%27%23fff%27 stroke-width=%273%27/%3E%3Crect x=%27-22%27 y=%27-15%27 width=%2744%27 height=%2730%27 rx=%275%27 fill=%27%23fff%27 stroke=%27%23C9D6E6%27 stroke-width=%271.5%27/%3E%3Cpath d=%27M-20 -12 L0 3 L20 -12%27 fill=%27none%27 stroke=%27%231877BD%27 stroke-width=%273%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform=%27translate(205,120)%27%3E%3Cg opacity=%270%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27translate%27 values=%270 0;0 0;18.0 -48.6;40.0 -108.0;40.0 -108.0%27 keyTimes=%270;.04;.3;.62;1%27 calcMode=%27spline%27 keySplines=%270 0 1 1;.3 0 .6 1;.3 0 .7 1;0 0 1 1%27 begin=%274s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Canimate attributeName=%27opacity%27 values=%270;0;1;1;0;0%27 keyTimes=%270;.04;.1;.5;.62;1%27 begin=%274s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Cg transform=%27rotate(-4) scale(0.9)%27%3E%3Cg%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%27.4;.4;1;1%27 keyTimes=%270;.04;.16;1%27 begin=%274s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Crect x=%27-22%27 y=%27-15%27 width=%2744%27 height=%2730%27 rx=%275%27 fill=%27%23fff%27 stroke=%27%23fff%27 stroke-width=%273%27/%3E%3Crect x=%27-22%27 y=%27-15%27 width=%2744%27 height=%2730%27 rx=%275%27 fill=%27%23fff%27 stroke=%27%23C9D6E6%27 stroke-width=%271.5%27/%3E%3Cpath d=%27M-20 -12 L0 3 L20 -12%27 fill=%27none%27 stroke=%27%231877BD%27 stroke-width=%273%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E %3Cg transform=%27translate(64,250)%27%3E%3Cg transform=%27scale(0)%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%270;0;1.18;.94;1;1;0%27 keyTimes=%270;.04;.13;.18;.22;.9;1%27 begin=%27.4s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Ccircle r=%2730%27 fill=%27%231877BD%27/%3E%3Ccircle r=%2730%27 fill=%27none%27 stroke=%27%23fff%27 stroke-width=%273%27/%3E%3Cg%3E%3CanimateTransform attributeName=%27transform%27 type=%27rotate%27 values=%270;0;-14;12;-8;5;0;0%27 keyTimes=%270;.24;.28;.32;.36;.4;.44;1%27 begin=%27.4s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Cpath d=%27M-11 6 V-3 Q-11 -13 0 -14 Q11 -13 11 -3 V6 L14 9 H-14 Z%27 fill=%27%23fff%27 stroke=%27%23fff%27 stroke-width=%272%27 stroke-linejoin=%27round%27/%3E%3Ccircle cx=%270%27 cy=%2712%27 r=%273.2%27 fill=%27%23fff%27/%3E%3Ccircle cx=%270%27 cy=%27-15%27 r=%272%27 fill=%27%23fff%27/%3E%3C/g%3E%3Cg transform=%27translate(17,-17)%27%3E%3Cg transform=%27scale(0)%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%270;0;1.3;1;1;0%27 keyTimes=%270;.2;.25;.29;.9;1%27 begin=%27.4s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Ccircle r=%279%27 fill=%27%23FE5E5E%27 stroke=%27%23fff%27 stroke-width=%272.5%27/%3E%3Cpath d=%27M-1.5 -4 L1 -5.5 V5%27 fill=%27none%27 stroke=%27%23fff%27 stroke-width=%272.2%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E %3Cg transform=%27translate(96,300)%27%3E%3Cg transform=%27scale(0)%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%270;0;1.18;.94;1;1;0%27 keyTimes=%270;.04;.13;.18;.22;.9;1%27 begin=%271.3s%27 dur=%276s%27 repeatCount=%27indefinite%27/%3E%3Ccircle r=%2718%27 fill=%27%2301C063%27/%3E%3Ccircle r=%2718%27 fill=%27none%27 stroke=%27%23fff%27 stroke-width=%272.5%27/%3E%3Ccircle r=%275%27 fill=%27none%27 stroke=%27%23fff%27 stroke-width=%272.6%27/%3E%3Cpath d=%27M5 -3 V3 Q5 7 9 6 Q11 5 11 0 A11 11 0 1 0 6 9%27 fill=%27none%27 stroke=%27%23fff%27 stroke-width=%272.6%27 stroke-linecap=%27round%27/%3E%3C/g%3E%3C/g%3E %3C/svg%3E") no-repeat center / contain !important; }
  #zm-content section[data-screen-label="Newsletters"] div:has(> img[src*="cs-news-art"]) > img { visibility: hidden !important; }
}
/* Newsletter laptop up 12px (18 Oct). Phones only. */
@media (max-width: 820px) {
  #zm-content section[data-screen-label="Newsletters"] div:has(> img[src*="cs-news-art"]) { position: relative !important; top: -12px !important; }
}
/* End Content Strategy newsletter laptop */

/* Graphic Design on phones: packages closer to the hero (17 Oct). Section and everything below it move up 50px together. Phones only. */
@media (max-width: 820px) {
  #zm-content section[data-screen-label="Hero"] + section[data-screen-label="Design day"] { margin-top: -50px !important; }
}

/* Graphic Design on phones: Wapuu 15% larger (17 Oct), growing upward from his base so he overlaps the photos just slightly; layered above them. Phones only. */
@media (max-width: 820px) {
  #zm-content img.zm-dd-wapuu { transform: scale(1.15) !important; transform-origin: 50% 100% !important; position: relative !important; z-index: 2 !important; }
}

/* Graphic Design on phones: showcase photos 10% larger (17 Oct). Uses the scale property so any existing tilt is kept. Wapuu excluded. Phones only. */
@media (max-width: 820px) {
  #zm-content img.zm-dd-img:not(.zm-dd-wapuu) { scale: 1.1; transform-origin: 50% 50%; }
}

/* Graphic Design on phones: WCEU caption down 5px (17 Oct). Phones only. */
@media (max-width: 820px) {
  #zm-content section[data-screen-label="Design day"] div[style*="max-width: 44ch"] { position: relative !important; top: 5px !important; }
}

/* Graphic Design on phones: Wapuu gentle rock (17 Oct). Uses the rotate property so his scale stays; pivots from his base. Still for reduced motion. Phones only. */
@keyframes zm-wapuu-rock { 0% { rotate: -3deg; } 100% { rotate: 3deg; } }
@media (max-width: 820px) {
  #zm-content img.zm-dd-wapuu { animation: zm-wapuu-rock 1.8s ease-in-out infinite alternate; }
}
@media (max-width: 820px) and (prefers-reduced-motion: reduce) {
  #zm-content img.zm-dd-wapuu { animation: none !important; }
}

/* Graphic Design on phones (17 Oct): animated tablet from the Services page (poster building, pencil rocking) under the hero paragraph, rebuilt with SVG animation tags so iPhone Safari plays it. Phones only. */
@media (max-width: 820px) {
  #zm-content section[data-screen-label="Hero"]:has(+ section[data-screen-label="Design day"])::after { content: ""; display: block; align-self: center; width: 100%; max-width: 360px; aspect-ratio: 280 / 215; margin: 23px auto 3px; background: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-30 -30 280 215%27 style=%27color:%23FE5E5E%27%3E%3Cg transform=%27rotate(-5 90 66)%27%3E%3Crect x=%270%27 y=%27-2%27 width=%27178%27 height=%27136%27 rx=%2712%27 fill=%27%232F343C%27 stroke=%27%23fff%27 stroke-width=%279%27 paint-order=%27stroke%27/%3E%3CclipPath id=%27rc0%27%3E%3Crect x=%278%27 y=%276%27 width=%27162%27 height=%27120%27 rx=%278%27/%3E%3C/clipPath%3E%3Cg clip-path=%27url(%23rc0)%27%3E%3Csvg x=%278%27 y=%276%27 width=%27162%27 height=%27120%27 viewBox=%270 0 200 148%27 preserveAspectRatio=%27xMidYMin slice%27%3E%3Crect width=%27200%27 height=%27148%27 fill=%27%23F1F4F8%27/%3E%3Crect width=%2722%27 height=%27200%27 fill=%27%23fff%27/%3E%3Cg fill=%27%23D5DCE5%27%3E%3Crect x=%276%27 y=%2710%27 width=%2710%27 height=%2710%27 rx=%272.5%27/%3E%3Crect x=%276%27 y=%2728%27 width=%2710%27 height=%2710%27 rx=%275%27/%3E%3Crect x=%276%27 y=%2746%27 width=%2710%27 height=%2710%27 rx=%272.5%27/%3E%3Crect x=%276%27 y=%2764%27 width=%2710%27 height=%2710%27 rx=%272.5%27/%3E%3C/g%3E%3Crect x=%275%27 y=%2727%27 width=%2712%27 height=%2712%27 rx=%276%27 fill=%27none%27 stroke=%27currentColor%27 stroke-width=%271.5%27/%3E%3Crect x=%27178%27 width=%2722%27 height=%27200%27 fill=%27%23fff%27/%3E%3Cg%3E%3Ccircle cx=%27189%27 cy=%2716%27 r=%275%27 fill=%27%231877BD%27/%3E%3Ccircle cx=%27189%27 cy=%2730%27 r=%275%27 fill=%27currentColor%27/%3E%3Ccircle cx=%27189%27 cy=%2744%27 r=%275%27 fill=%27%23FFDE59%27/%3E%3Ccircle cx=%27189%27 cy=%2758%27 r=%275%27 fill=%27%2301C063%27/%3E%3C/g%3E%3Crect x=%2740%27 y=%2710%27 width=%27120%27 height=%27130%27 rx=%273%27 fill=%27%23fff%27 stroke=%27%23E3E8EE%27/%3E%3Cg transform=%27translate(100 49)%27%3E%3Cg transform=%27scale(0)%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%270;0;1.12;1;1;0;0%27 keyTimes=%270;.05;.12;.14;.84;.93;1%27 dur=%276s%27 begin=%270s%27 repeatCount=%22indefinite%22/%3E%3Canimate attributeName=%27opacity%27 values=%270;0;1;1;0;0%27 keyTimes=%270;.05;.12;.84;.93;1%27 dur=%276s%27 begin=%270s%27 repeatCount=%22indefinite%22/%3E%3Cg transform=%27translate(-100 -49)%27%3E%3Crect x=%2748%27 y=%2718%27 width=%27104%27 height=%2762%27 rx=%273%27 fill=%27currentColor%27 opacity=%27.85%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform=%27translate(122 46)%27%3E%3Cg transform=%27scale(0)%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%270;0;1.12;1;1;0;0%27 keyTimes=%270;.05;.12;.14;.84;.93;1%27 dur=%276s%27 begin=%270.35s%27 repeatCount=%22indefinite%22/%3E%3Canimate attributeName=%27opacity%27 values=%270;0;1;1;0;0%27 keyTimes=%270;.05;.12;.84;.93;1%27 dur=%276s%27 begin=%270.35s%27 repeatCount=%22indefinite%22/%3E%3Cg transform=%27translate(-122 -46)%27%3E%3Ccircle cx=%27122%27 cy=%2746%27 r=%2717%27 fill=%27%23FFDE59%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform=%27translate(100 66)%27%3E%3Cg transform=%27scale(0)%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%270;0;1.12;1;1;0;0%27 keyTimes=%270;.05;.12;.14;.84;.93;1%27 dur=%276s%27 begin=%270.6s%27 repeatCount=%22indefinite%22/%3E%3Canimate attributeName=%27opacity%27 values=%270;0;1;1;0;0%27 keyTimes=%270;.05;.12;.84;.93;1%27 dur=%276s%27 begin=%270.6s%27 repeatCount=%22indefinite%22/%3E%3Cg transform=%27translate(-100 -66)%27%3E%3Cpath d=%27M48 80 L78 52 L100 72 L112 62 L152 80 Z%27 fill=%27%23fff%27 opacity=%27.55%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform=%27translate(48 94.5)%27%3E%3Cg transform=%27scale(0 1)%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%270 1;0 1;1 1;1 1;0 1;0 1%27 keyTimes=%270;.06;.14;.86;.94;1%27 dur=%277s%27 begin=%270.9s%27 repeatCount=%22indefinite%22/%3E%3Cg transform=%27translate(-48 -94.5)%27%3E%3Crect x=%2748%27 y=%2790%27 width=%2786%27 height=%279%27 rx=%272%27 fill=%27%232F343C%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform=%27translate(48 106.5)%27%3E%3Cg transform=%27scale(0 1)%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%270 1;0 1;1 1;1 1;0 1;0 1%27 keyTimes=%270;.06;.14;.86;.94;1%27 dur=%277s%27 begin=%271.15s%27 repeatCount=%22indefinite%22/%3E%3Cg transform=%27translate(-48 -106.5)%27%3E%3Crect x=%2748%27 y=%27104%27 width=%2762%27 height=%275%27 rx=%272%27 fill=%27%23C9D1DB%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform=%27translate(70 124.5)%27%3E%3Cg transform=%27scale(0)%27%3E%3CanimateTransform attributeName=%27transform%27 type=%27scale%27 values=%270;0;1.12;1;1;0;0%27 keyTimes=%270;.05;.12;.14;.84;.93;1%27 dur=%276s%27 begin=%271.4s%27 repeatCount=%22indefinite%22/%3E%3Canimate attributeName=%27opacity%27 values=%270;0;1;1;0;0%27 keyTimes=%270;.05;.12;.84;.93;1%27 dur=%276s%27 begin=%271.4s%27 repeatCount=%22indefinite%22/%3E%3Cg transform=%27translate(-70 -124.5)%27%3E%3Crect x=%2748%27 y=%27118%27 width=%2744%27 height=%2713%27 rx=%276.5%27 fill=%27currentColor%27/%3E%3Crect x=%2755%27 y=%27123%27 width=%2730%27 height=%273%27 rx=%271.5%27 fill=%27%23fff%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%3C/g%3E%3Ccircle cx=%27174%27 cy=%2766%27 r=%271.6%27 fill=%27%235A616B%27/%3E%3C/g%3E%3Cg transform=%27translate(204 -20) rotate(24)%27%3E%3Cg%3E%3CanimateTransform attributeName=%27transform%27 type=%27rotate%27 values=%27-3 6.5 152;3 6.5 152;-3 6.5 152%27 keyTimes=%270;.5;1%27 calcMode=%27spline%27 keySplines=%27.42 0 .58 1;.42 0 .58 1%27 dur=%273.4s%27 repeatCount=%22indefinite%22/%3E%3Crect x=%270%27 y=%270%27 width=%2713%27 height=%27150%27 rx=%276.5%27 fill=%27%23fff%27 stroke=%27%23fff%27 stroke-width=%278%27/%3E%3Cpath d=%27M0 128 L6.5 152 L13 128 Z%27 fill=%27%23fff%27 stroke=%27%23fff%27 stroke-width=%278%27 stroke-linejoin=%27round%27/%3E%3Crect x=%270%27 y=%270%27 width=%2713%27 height=%27130%27 rx=%276.5%27 fill=%27%23F4F5F7%27 stroke=%27%23C7CFD9%27/%3E%3Crect x=%270%27 y=%2712%27 width=%2713%27 height=%273%27 fill=%27%23E3E8EE%27/%3E%3Cpath d=%27M0.5 128 L6.5 151 L12.5 128 Z%27 fill=%27%23E9ECF1%27 stroke=%27%23C7CFD9%27 stroke-linejoin=%27round%27/%3E%3Cpath d=%27M4.6 144 L6.5 151 L8.4 144 Z%27 fill=%27%232F343C%27/%3E%3C/g%3E%3C/g%3E%3Cg transform=%27translate(11 126) scale(0.82) translate(-11 -126)%27%3E%3Cg%3E%3CanimateTransform attributeName=%27transform%27 type=%27translate%27 values=%270 0;0 -5;0 0%27 keyTimes=%270;.5;1%27 calcMode=%27spline%27 keySplines=%27.42 0 .58 1;.42 0 .58 1%27 dur=%274.5s%27 begin=%27-2s%27 repeatCount=%22indefinite%22/%3E%3Cg transform=%27translate(-24 112)%27%3E%3Crect width=%2778%27 height=%2728%27 rx=%2714%27 fill=%27%23fff%27 stroke=%27%23fff%27 stroke-width=%277%27/%3E%3Ccircle cx=%2715%27 cy=%2714%27 r=%277%27 fill=%27%231877BD%27/%3E%3Ccircle cx=%2731%27 cy=%2714%27 r=%277%27 fill=%27currentColor%27/%3E%3Ccircle cx=%2747%27 cy=%2714%27 r=%277%27 fill=%27%23FFDE59%27/%3E%3Ccircle cx=%2763%27 cy=%2714%27 r=%277%27 fill=%27%2301C063%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain; pointer-events: none; }
}
/* End Graphic Design tablet */

/* Mobile menu: Let's Chat button text white (18 Oct), including visited, hover, focus and tap. */
a.zm-mobile-cta, a.zm-mobile-cta:visited, a.zm-mobile-cta:hover, a.zm-mobile-cta:focus, a.zm-mobile-cta:active { color: #fff !important; }

/* Portfolio case studies (18 Oct): animated red hand-drawn arrow from 2024 to the 2025 stats. Overlay only: the screenshots and labels are untouched. Phones and desktop. v3: 13px further right, ~10% larger, appears and starts drawing when the stats scroll into view (footer script #zm-arrow-js adds .zm-arrow-in), holds 10s, then fades and repeats. */
#zm-content .zm-ba-stack > div:has(> img[src*="stats-after"])::after { content: ""; position: absolute; top: -115px; right: -13px; width: 97px; height: 113px; background: no-repeat center / contain; pointer-events: none; z-index: 3; }
#zm-content .zm-ba-stack.zm-arrow-in > div:has(> img[src*="stats-after"])::after { background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 70 82%27%3E%3Cg fill=%27none%27 stroke=%27%23FE5E5E%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Canimate attributeName=%27opacity%27 values=%271;1;0;0%27 keyTimes=%270;.906;.947;1%27 dur=%2712.3s%27 repeatCount=%22indefinite%22/%3E%3Cpath d=%27M24 4 C 34 20, 39 50, 32 78%27 stroke-width=%273.6%27 pathLength=%271%27 stroke-dasharray=%271%27 stroke-dashoffset=%271%27%3E%3Canimate attributeName=%27stroke-dashoffset%27 values=%271;1;0;0%27 keyTimes=%270;.01;.083;1%27 calcMode=%27spline%27 keySplines=%270 0 1 1;.55 0 .3 1;0 0 1 1%27 dur=%2712.3s%27 repeatCount=%22indefinite%22/%3E%3C/path%3E%3Cpath d=%27M42.0 69.7 L32 78 L27.1 65.9%27 stroke-width=%273.6%27 pathLength=%271%27 stroke-dasharray=%271%27 stroke-dashoffset=%271%27%3E%3Canimate attributeName=%27stroke-dashoffset%27 values=%271;1;0;0%27 keyTimes=%270;.083;.104;1%27 dur=%2712.3s%27 repeatCount=%22indefinite%22/%3E%3C/path%3E%3C/g%3E%3C/svg%3E"); }
@media (max-width: 820px) {
  #zm-content .zm-ba-stack > div:has(> img[src*="stats-after"])::after { top: auto; margin-top: -87px; right: max(-13px, calc(50% - 185px)); width: 77px; height: 85px; }
}
/* Portfolio arrow desktop placement (18 Oct): the stats stack vertically on desktop too, so the arrow runs down the right edge of the cards from the 2024 card to the top-right corner of the 2025 card. Desktop only. */
@media (min-width: 821px) {
  #zm-content .zm-ba-stack > div:has(> img[src*="stats-after"])::after { top: auto; margin-top: -107px; right: calc(50% - 206px); }
}
/* End portfolio arrow */

/* Portfolio arrow, desktop (18 Oct, v4): arrow sits in the gap between the 2024 and 2025 stat cards, pointing down into the 2025 card. Left of centre so it clears the handwritten 2024 label. Sized to fit the gap. Desktop only. */
@media (min-width: 821px) {
  #zm-content .zm-ba-stack > div:has(> img[src*="stats-after"])::after { top: -68px; bottom: auto; margin-top: 0; right: auto; left: calc(35% - 27px); width: 55px; height: 64px; }
}
/* End portfolio arrow v4 */

/* --- Atarim tasks, 23 Oct --- */

/* Task, 23 Oct: nav dropdown items centred instead of left aligned. */
[id^="menu-primary"] ul.sub-menu,
[id^="menu-primary"] ul.sub-menu li,
[id^="menu-primary"] ul.sub-menu a {
  text-align: center !important;
}
[id^="menu-primary"] ul.sub-menu a {
  justify-content: center !important;
}

/* Task, 23 Oct: Home bento "Social" card. Stats card and the two floating
   green pills move up 7px together. Desktop only (phones have their own
   placement). */
@media (min-width: 821px) {
  #zm-content div[data-screen-label="Home"] section[data-screen-label="Proof bento"] .zm-social-chart {
    top: -7px !important;
  }
}

/* Task, 23 Oct: Home bento "2025 Year in Review" (red card). The phone's
   hover grow drops from 10% to 3% so it no longer touches the text above. */
@media (min-width: 821px) {
  #zm-content [data-zm-page="home"] div:has(> div > div > .zm-bento-phone):hover .zm-bento-phone {
    transform: translateX(-50%) scale(1.03) !important;
  }
}

/* Task, 23 Oct: less white space under the home newsletter form, above the
   footer. Desktop bottom padding 90px -> 48px, phones 150px -> 80px. The two
   lower floating shapes move down by the same amount so they keep their
   place beside the form. */
#zm-content [data-zm-page="home"] section[data-screen-label="Newsletter"] {
  padding-bottom: 48px !important;
}
#zm-content [data-zm-page="home"] .zm-nl-stage .zm-svc-mark:nth-of-type(3) { bottom: 134px !important; }
#zm-content [data-zm-page="home"] .zm-nl-stage .zm-svc-mark:nth-of-type(4) { bottom: 126px !important; }
@media (max-width: 820px) {
  #zm-content [data-zm-page="home"] section[data-screen-label="Newsletter"] {
    padding-bottom: 80px !important;
  }
  #zm-content [data-zm-page="home"] .zm-nl-stage .zm-svc-mark:nth-of-type(3) { bottom: 62px !important; }
  #zm-content [data-zm-page="home"] .zm-nl-stage .zm-svc-mark:nth-of-type(4) { bottom: 54px !important; }
}

/* Task, 23 Oct (round 2): even less space under the home newsletter.
   Desktop 48px -> 24px, phones 80px -> 48px; lower shapes follow. */
#zm-content [data-zm-page="home"] section[data-screen-label="Newsletter"] {
  padding-bottom: 24px !important;
}
#zm-content [data-zm-page="home"] .zm-nl-stage .zm-svc-mark:nth-of-type(3) { bottom: 110px !important; }
#zm-content [data-zm-page="home"] .zm-nl-stage .zm-svc-mark:nth-of-type(4) { bottom: 102px !important; }
@media (max-width: 820px) {
  #zm-content [data-zm-page="home"] section[data-screen-label="Newsletter"] {
    padding-bottom: 48px !important;
  }
  #zm-content [data-zm-page="home"] .zm-nl-stage .zm-svc-mark:nth-of-type(3) { bottom: 30px !important; }
  #zm-content [data-zm-page="home"] .zm-nl-stage .zm-svc-mark:nth-of-type(4) { bottom: 22px !important; }
}

/* Task, 23 Oct: mobile menu. Top-level items (Home, Portfolio, Services,
   Freebies, Blog) centred to match the centred dropdown items, so the whole
   menu sits on one centre line. Phones only; desktop nav unchanged. */
@media (max-width: 820px) {
  [id^="menu-primary"],
  [id^="menu-primary"] > li,
  [id^="menu-primary"] > li > a {
    text-align: center !important;
  }
  [id^="menu-primary"] > li {
    justify-content: center !important;
    align-items: center !important;
  }
  [id^="menu-primary"] > li > a {
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Task, 23 Oct: mobile menu shows parent pages only (Home, Portfolio,
   Services, Blog). Dropdown items and their chevrons are hidden, and Freebies
   (with Post Pizazzer and Content Ideas under it) is hidden entirely.
   Phones only; desktop nav keeps its dropdowns. */
@media (max-width: 820px) {
  [id^="menu-primary"] ul.sub-menu,
  [id^="menu-primary"] > li:has(> a[href="#"]),
  [id^="menu-primary"] > li > button,
  [id^="menu-primary"] > li > .sub-menu-toggle,
  [id^="menu-primary"] > li > .dropdown-toggle {
    display: none !important;
  }
  [id^="menu-primary"] > li.menu-item-has-children > a::after,
  [id^="menu-primary"] > li.menu-item-has-children > a::before {
    content: none !important;
    display: none !important;
  }
}

/* Task, 23 Oct (round 2): mobile menu parent pages only, stronger version.
   The theme's own mobile menu rules were outranking the first pass, so these
   use higher specificity. Hides every dropdown list, the chevrons, and the
   whole Freebies item. Phones only; desktop untouched. */
@media (max-width: 820px) {
  html body [id^="menu-primary"][id^="menu-primary"] li ul,
  html body [id^="menu-primary"][id^="menu-primary"] li .sub-menu,
  html body [id^="menu-primary"][id^="menu-primary"] > li:has(> a[href="#"]),
  html body [id^="menu-primary"][id^="menu-primary"] > li:has(a[href*="post-pizazzer"]),
  html body [id^="menu-primary"][id^="menu-primary"] > li > a svg,
  html body [id^="menu-primary"][id^="menu-primary"] > li > :is(button, .sub-menu-toggle, .dropdown-toggle, [class*="toggle"], [class*="caret"], [class*="chevron"], [class*="arrow"]) {
    display: none !important;
  }
  html body [id^="menu-primary"][id^="menu-primary"] > li:has(> ul) > a::after,
  html body [id^="menu-primary"][id^="menu-primary"] > li:has(> ul) > a::before,
  html body [id^="menu-primary"][id^="menu-primary"] > li:has(> ul)::after,
  html body [id^="menu-primary"][id^="menu-primary"] > li:has(> ul)::before {
    content: none !important;
    display: none !important;
  }
}

/* Task, 23 Oct (round 3): mobile menu parent pages only, targeted by each
   menu item's own WordPress class so the theme's mobile menu styles can't
   override it. Hidden on phones: the five case studies, the three services,
   and Freebies with Post Pizazzer and Content Ideas. Chevrons on Portfolio
   and Services hidden too. Phones only; desktop untouched. */
@media (max-width: 820px) {
  html body li.menu-item-588.menu-item-588, html body li.menu-item-589.menu-item-589,
  html body li.menu-item-590.menu-item-590, html body li.menu-item-591.menu-item-591,
  html body li.menu-item-592.menu-item-592, html body li.menu-item-594.menu-item-594,
  html body li.menu-item-595.menu-item-595, html body li.menu-item-596.menu-item-596,
  html body li.menu-item-597.menu-item-597, html body li.menu-item-598.menu-item-598,
  html body li.menu-item-599.menu-item-599,
  html body li.menu-item-587.menu-item-587 > :not(a),
  html body li.menu-item-593.menu-item-593 > :not(a),
  html body li.menu-item-587.menu-item-587 > a > :is(svg, [aria-hidden="true"]),
  html body li.menu-item-593.menu-item-593 > a > :is(svg, [aria-hidden="true"]) {
    display: none !important;
  }
  html body li.menu-item-587.menu-item-587::after, html body li.menu-item-587.menu-item-587::before,
  html body li.menu-item-587.menu-item-587 > a::after, html body li.menu-item-587.menu-item-587 > a::before,
  html body li.menu-item-593.menu-item-593::after, html body li.menu-item-593.menu-item-593::before,
  html body li.menu-item-593.menu-item-593 > a::after, html body li.menu-item-593.menu-item-593 > a::before {
    content: none !important;
    display: none !important;
  }
}

/* Task, 23 Oct: Home bento "Client Love" band. The two review cards bob up
   and down very subtly (4px), slow and out of step with each other. Uses the
   translate property so each card keeps its tilt. Still for reduced motion.
   Phones only (the cards only show on phones). */
@keyframes zm-review-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -4px; } }
@media (max-width: 820px) {
  #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"]::before {
    animation: zm-review-bob 4.2s ease-in-out infinite;
  }
  #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] > div:nth-child(2)::before {
    animation: zm-review-bob 4.8s ease-in-out infinite;
    animation-delay: -1.6s;
  }
}
@media (max-width: 820px) and (prefers-reduced-motion: reduce) {
  #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"]::before,
  #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"] > div:nth-child(2)::before {
    animation: none !important;
  }
}

/* Task, 23 Oct (round 4): the theme's own rules use ID selectors, which
   outrank class-based overrides. These repeat the mobile menu and review
   card bob rules with :not(#zz...) added, which gives them ID-level weight
   without matching anything new. Phones only; desktop untouched. */
@media (max-width: 820px) {
  li.menu-item-588:not(#zz1):not(#zz2):not(#zz3), li.menu-item-589:not(#zz1):not(#zz2):not(#zz3),
  li.menu-item-590:not(#zz1):not(#zz2):not(#zz3), li.menu-item-591:not(#zz1):not(#zz2):not(#zz3),
  li.menu-item-592:not(#zz1):not(#zz2):not(#zz3), li.menu-item-594:not(#zz1):not(#zz2):not(#zz3),
  li.menu-item-595:not(#zz1):not(#zz2):not(#zz3), li.menu-item-596:not(#zz1):not(#zz2):not(#zz3),
  li.menu-item-597:not(#zz1):not(#zz2):not(#zz3), li.menu-item-598:not(#zz1):not(#zz2):not(#zz3),
  li.menu-item-599:not(#zz1):not(#zz2):not(#zz3),
  li.menu-item-587:not(#zz1):not(#zz2):not(#zz3) > :not(a),
  li.menu-item-593:not(#zz1):not(#zz2):not(#zz3) > :not(a) {
    display: none !important;
  }
  li.menu-item-587:not(#zz1):not(#zz2):not(#zz3)::after, li.menu-item-587:not(#zz1):not(#zz2):not(#zz3)::before,
  li.menu-item-587:not(#zz1):not(#zz2):not(#zz3) > a::after, li.menu-item-587:not(#zz1):not(#zz2):not(#zz3) > a::before,
  li.menu-item-593:not(#zz1):not(#zz2):not(#zz3)::after, li.menu-item-593:not(#zz1):not(#zz2):not(#zz3)::before,
  li.menu-item-593:not(#zz1):not(#zz2):not(#zz3) > a::after, li.menu-item-593:not(#zz1):not(#zz2):not(#zz3) > a::before {
    content: none !important;
    display: none !important;
  }
  #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"]:not(#zz1):not(#zz2):not(#zz3)::before {
    animation: zm-review-bob 4.2s ease-in-out infinite !important;
  }
  #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"]:not(#zz1):not(#zz2):not(#zz3) > div:nth-child(2)::before {
    animation: zm-review-bob 4.8s ease-in-out -1.6s infinite !important;
  }
}
@media (max-width: 820px) and (prefers-reduced-motion: reduce) {
  #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"]:not(#zz1):not(#zz2):not(#zz3)::before,
  #zm-content section[data-screen-label="Proof bento"] [data-zm-x~="zm-x23"]:not(#zz1):not(#zz2):not(#zz3) > div:nth-child(2)::before {
    animation: none !important;
  }
}

/* Task, 23 Oct: Graphic Design on phones. WCEU caption moves down 20px so it
   has room below the Wapuu. Phones only. */
@media (max-width: 820px) {
  #zm-content section[data-screen-label="Design day"] div[style*="max-width: 44ch"]:not(#zz1):not(#zz2) {
    margin-top: 20px !important;
  }
}

/* Blog post template: hide Jetpack share/like/related (the template has its own) */
.zmp-prose .sharedaddy,.zmp-prose .sd-sharing-enabled,.zmp-prose .sd-like,.zmp-prose .jetpack-likes-widget-wrapper,.zmp-prose .jp-relatedposts,.zmp-prose #jp-relatedposts{display:none!important}
.zmp-toc__link[href="#share-this"],.zmp-toc__link[href="#like-this"],.zmp-toc__link[href="#related"]{display:none!important}

/* Header nav: keep the pill's shadow from being cut off by the section below + a little more space */
.zm-header{position:relative;z-index:20;padding-bottom:12px}

/* Blog posts: keep the author photo straight */
.zmp-authorcard__badge,.zmp-avatar{transform:none!important}

/* Blog posts: remove the author block from the top */
.zmp-head .zmp-author{display:none!important}

/* Blog posts (mobile): show the author photo in the written-by card */
@media (max-width:860px){
.zmp-authorcard__badge{display:none!important}
.zmp-authorcard::before{content:"";display:block;flex:none;width:64px;height:64px;border-radius:16px;background:#1877BD url("/wp-content/uploads/2026/08/about-zachery.jpg") center 20%/cover no-repeat}
}

/* Blog posts (mobile): show the whole featured image, no crop or zoom */
@media (max-width:860px){
.zmp-hero:has(img){height:auto!important;aspect-ratio:auto!important;background-image:none!important;background-color:transparent!important}
.zmp-hero:has(img) img{position:static!important;display:block;width:100%!important;height:auto!important;object-fit:contain!important}
}

/* Category pills: no red (Oct 2026). Social Media blue, Design green, Behind the Scenes yellow, LinkedIn grey */
.zm-tag a[href*="/category/social-media"],.zmp-tag--social-media{background:#E3F0FA!important;color:#145F97!important}
.zm-tag a[href*="/category/linkedin"],.zmp-tag--linkedin{background:#EDF1F5!important;color:#46546A!important}
.zm-blog .category-social-media .zm-media,.zmp-media--social-media{background-color:#1877BD!important}

/* Mobile reviews: faint grid on the white review card to match the blue ones (Oct 2026) */
@media (max-width: 820px) {
  .zm-reviews-mobile > div:not(.zm-grid-on-blue) {
    background-color: #fff !important;
    background-image: linear-gradient(rgba(24,119,189,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(24,119,189,.07) 1px, transparent 1px) !important;
    background-size: 24px 24px !important;
    background-position: -1px -1px !important;
  }
}

/* Mobile reviews grid: stronger lines + higher specificity (Oct 2026) */
@media (max-width: 820px) {
  body .zm-reviews-mobile > div:not(.zm-grid-on-blue)[style] {
    background-color: #fff !important;
    background-image: linear-gradient(rgba(24,119,189,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(24,119,189,.13) 1px, transparent 1px) !important;
    background-size: 24px 24px !important;
    background-position: -1px -1px !important;
  }
}

/* Mobile reviews: drop the divider above the reviewer so it doesn't fight the grid lines (Oct 2026) */
@media (max-width: 820px) {
  body .zm-reviews-mobile > div > div[style*="border-top"] { border-top: 0 !important; }
}

/* Mobile reviews: short accent bar as an intentional divider; softer grid on white card (Oct 2026) */
@media (max-width: 820px) {
  body .zm-reviews-mobile > div > div[style*="border-top"] { position: relative !important; }
  body .zm-reviews-mobile > div > div[style*="border-top"]::before {
    content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 4px; border-radius: 4px; background: #1877BD;
  }
  body .zm-reviews-mobile > .zm-grid-on-blue > div[style*="border-top"]::before { background: #fff; }
  body .zm-reviews-mobile > div:not(.zm-grid-on-blue)[style] {
    background-image: linear-gradient(rgba(24,119,189,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(24,119,189,.09) 1px, transparent 1px) !important;
  }
}

/* Policy pages (Privacy, Accessibility): more breathing room above the title on mobile (Oct 2026) */
@media (max-width: 820px) {
  body [data-zm-page] section.zm-policy { padding-top: 44px !important; }
}

/* Policy pages: beat the theme's section[style*=max-width:760px]{padding-top:0} on mobile (tested Oct 2026) */
@media (max-width: 820px) {
  body section.zm-policy[style*="max-width: 760px"] { padding-top: 44px !important; }
}

/* About page: What You Get Working With Me — roomier checklist, section pulled up on mobile (Oct 31 2026) */
html body section[data-screen-label="What you get"] .zm-about-split > div:first-child { gap: 22px !important; }
html body section[data-screen-label="What you get"] .zm-about-split > div:first-child > a { margin-top: 8px !important; }
@media (max-width: 820px) {
  html body section[data-screen-label="What you get"] { padding-top: 20px !important; }
}

/* About page: Results band as stat tiles, mobile only (Oct 31 2026) */
@media (max-width: 820px) {
  html body section[data-screen-label="What you get"] { padding-bottom: 16px !important; }
  html body section[data-screen-label="Results"] { margin-top: 32px !important; padding: 44px 18px 48px !important; }
  html body section[data-screen-label="Results"] h2 { font-size: 21px !important; line-height: 1.25 !important; text-wrap: balance; }
  html body section[data-screen-label="Results"] > p { font-size: 14px !important; max-width: 30ch !important; }
  html body section[data-screen-label="Results"] .zm-about-stats { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; width: 100%; max-width: 420px; margin-top: 18px !important; }
  html body section[data-screen-label="Results"] .zm-about-stats > div { min-width: 0 !important; align-items: flex-start !important; gap: 0 !important; background: rgba(255, 255, 255, 0.13); border-radius: 10px; padding: 16px 14px; box-sizing: border-box; }
  html body section[data-screen-label="Results"] .zm-about-stats > div > div:first-child { font-size: 30px !important; }
  html body section[data-screen-label="Results"] .zm-about-stats > div > div:first-child::after { content: ""; display: block; width: 28px; height: 4px; border-radius: 2px; margin: 10px 0 8px; background: #fff; }
  html body section[data-screen-label="Results"] .zm-about-stats > div:nth-child(1) > div:first-child::after { background: #01C063; }
  html body section[data-screen-label="Results"] .zm-about-stats > div:nth-child(2) > div:first-child::after { background: #FFDE59; }
  html body section[data-screen-label="Results"] .zm-about-stats > div:nth-child(3) > div:first-child::after { background: #FE5E5E; }
  html body section[data-screen-label="Results"] .zm-about-stats > div > div:last-child { text-align: left !important; font-size: 13px !important; opacity: 1 !important; }
  html body section[data-screen-label="Results"] .zm-about-stats br { display: none; }
  html body section[data-screen-label="Bento"] { padding-top: 40px !important; }
}

/* About page: fun facts bento as two-column tiles with custom icons, mobile only (Oct 31 2026) */
@media (max-width: 820px) {
  html body section[data-screen-label="Bento"] { padding: 40px 18px 72px !important; }
  html body section[data-screen-label="Bento"] .zm-about-bento { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div, html body section[data-screen-label="Bento"] .zm-about-bento > div:has(#about-cats-tile) { display: flex !important; grid-column: span 1 !important; min-height: 0 !important; padding: 18px 16px 20px !important; gap: 6px !important; border-radius: 16px !important; overflow: visible !important; transform: none !important; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div::before { content: ""; display: block; width: 62px; height: 62px; margin: 0 0 4px -4px; background: center / contain no-repeat; flex: 0 0 auto; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div > div, html body section[data-screen-label="Bento"] .zm-about-bento > div > img { display: none !important; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div h3 { font-size: 15px !important; line-height: 1.3 !important; font-weight: 600 !important; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div p { font-size: 13.5px !important; line-height: 1.5 !important; opacity: .95; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(3) { background: #1877BD !important; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(6) { order: 10; grid-column: 1 / -1 !important; display: grid !important; grid-template-columns: 62px minmax(0, 1fr); column-gap: 16px; row-gap: 4px; align-items: center; align-content: center; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(6)::before { grid-row: 1 / span 2; margin: 0; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(6) h3, html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(6) p { grid-column: 2; }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(1)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cline x1='30' y1='6' x2='44' y2='32' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='3.2'/%3E%3Cline x1='38' y1='4' x2='47' y2='30' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='3.2'/%3E%0A%3Cpath d='M14 30c4-5 10-7 18-7s14 2 18 7z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Ccircle cx='25' cy='25' r='3' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%0A%3Cpath d='M8 30h48c0 13-10 22-24 22S8 43 8 30z' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Cpath d='M11 38h42' stroke='%23FE5E5E' stroke-width='4' stroke-linecap='round'/%3E%0A%3Cpath d='M22 52v5h20v-5' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%3C/g%3E%3Cpath transform='translate(8 9) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(2)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cpath d='M20 30l12 30 12-30z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Cpath d='M24 36l14 10M22 31l18 13M40 36l-14 10M42 31l-18 13' stroke='%231B4261' stroke-width='1.6' opacity='.55'/%3E%0A%3Cpath d='M17 31c-4-1-6-5-4-9 1-3 5-4 7-3 0-7 6-12 12-12s12 5 12 12c2-1 6 0 7 3 2 4 0 8-4 9z' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Ccircle cx='25' cy='21' r='2' fill='%231B4261'/%3E%3Ccircle cx='33' cy='16' r='1.8' fill='%231B4261'/%3E%3Ccircle cx='38' cy='24' r='2.2' fill='%231B4261'/%3E%3Ccircle cx='29' cy='27' r='1.5' fill='%231B4261'/%3E%3Ccircle cx='44' cy='20' r='1.4' fill='%231B4261'/%3E%3C/g%3E%3Cpath transform='translate(64 9) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(3)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cpath d='M32 8C17 8 6 18 6 31c0 12 10 20 20 20 5 0 6-3 5-6s0-6 4-6h8c8 0 15-5 15-13C58 15 46 8 32 8z' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Ccircle cx='19' cy='25' r='4.5' fill='%2301C063' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%3Ccircle cx='31' cy='18' r='4.5' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%3Ccircle cx='44' cy='21' r='4.5' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%3Ccircle cx='18' cy='39' r='4.5' fill='%231877BD' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%3C/g%3E%3Cpath transform='translate(64 9) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(4)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cline x1='36' y1='20' x2='46' y2='4' stroke='%23FE5E5E' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M36 20L46 4' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' fill='none' stroke-width='1'/%3E%0A%3Cpath d='M14 18h30l-4 38H18z' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Cpath d='M16 28h26l-3 26H19z' fill='%23FFB8B8'/%3E%0A%3Cpath d='M14 18h30l-4 38H18z' fill='none' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Crect x='21' y='34' width='6' height='6' rx='1.5' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='1.8'/%3E%3Crect x='30' y='42' width='6' height='6' rx='1.5' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='1.8'/%3E%0A%3Ccircle cx='45' cy='19' r='9' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%3Cpath d='M45 12v14M38.5 15.5l13 7M38.5 22.5l13-7' stroke='%231B4261' stroke-width='1.4' opacity='.6'/%3E%3C/g%3E%3Cpath transform='translate(8 9) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(5)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cpath d='M30 52c-11 0-18-6-18-15 0-6 2-10 3-13l-1-12 9 6c2-1 5-1 7-1s5 0 7 1l9-6-1 12c1 3 3 7 3 13 0 9-7 15-18 15z' transform='translate(-6 4)' fill='%23D6E6F3' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Cpath d='M30 52c-11 0-18-6-18-15 0-6 2-10 3-13l-1-12 9 6c2-1 5-1 7-1s5 0 7 1l9-6-1 12c1 3 3 7 3 13 0 9-7 15-18 15z' transform='translate(14 8) scale(.82)' fill='%23FFC27A' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='3.1'/%3E%0A%3Ccircle cx='18' cy='39' r='1.9' fill='%231B4261'/%3E%3Ccircle cx='30' cy='39' r='1.9' fill='%231B4261'/%3E%3Cpath d='M22 44l2 2 2-2' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='1.8'/%3E%0A%3Ccircle cx='35.5' cy='43' r='1.6' fill='%231B4261'/%3E%3Ccircle cx='45.5' cy='43' r='1.6' fill='%231B4261'/%3E%3Cpath d='M39 47l1.6 1.6 1.6-1.6' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='1.6'/%3E%3C/g%3E%3Cpath transform='translate(64 9) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(6)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Crect x='16' y='6' width='32' height='54' rx='7' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Crect x='27' y='10' width='10' height='3' rx='1.5' fill='%231B4261'/%3E%0A%3Ccircle cx='32' cy='32' r='10' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%3Cpath d='M29 27l8 5-8 5z' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%0A%3Cpath d='M56 30c-4-3-5.5-5-4-7 1-1.4 3-1.3 4 .5 1-1.8 3-1.9 4-.5 1.5 2 0 4-4 7z' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='1.8' transform='translate(-2 -6)'/%3E%0A%3Crect x='22' y='47' width='20' height='3.5' rx='1.75' fill='%23BFDDF3'/%3E%3C/g%3E%3Cpath transform='translate(8 9) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(7)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cpath d='M6 46l14-6 12 6 14-6 12 6v12l-14-4-12 4-12-4-14 4z' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Cpath d='M20 40v16M32 46v8M46 40v16' stroke='%231B4261' stroke-width='1.6' opacity='.5'/%3E%0A%3Cpath d='M32 50c-9-10-14-17-14-24a14 14 0 0 1 28 0c0 7-5 14-14 24z' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Ccircle cx='32' cy='26' r='5.5' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.2'/%3E%3C/g%3E%3Cpath transform='translate(64 9) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
}

/* About page: more breathing room around fun facts, mobile only (Oct 31 2026) */
@media (max-width: 820px) {
  html body section[data-screen-label="Bento"] { padding-top: 64px !important; padding-bottom: 100px !important; }
}

/* About page: sparkle tips no longer clipped, matching cats icon, mobile only (Oct 31 2026) */
@media (max-width: 820px) {
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(2)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cpath d='M20 30l12 30 12-30z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Cpath d='M24 36l14 10M22 31l18 13M40 36l-14 10M42 31l-18 13' stroke='%231B4261' stroke-width='1.6' opacity='.55'/%3E%0A%3Cpath d='M17 31c-4-1-6-5-4-9 1-3 5-4 7-3 0-7 6-12 12-12s12 5 12 12c2-1 6 0 7 3 2 4 0 8-4 9z' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Ccircle cx='25' cy='21' r='2' fill='%231B4261'/%3E%3Ccircle cx='33' cy='16' r='1.8' fill='%231B4261'/%3E%3Ccircle cx='38' cy='24' r='2.2' fill='%231B4261'/%3E%3Ccircle cx='29' cy='27' r='1.5' fill='%231B4261'/%3E%3Ccircle cx='44' cy='20' r='1.4' fill='%231B4261'/%3E%3C/g%3E%3Cpath transform='translate(61.5 10) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(3)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cpath d='M32 8C17 8 6 18 6 31c0 12 10 20 20 20 5 0 6-3 5-6s0-6 4-6h8c8 0 15-5 15-13C58 15 46 8 32 8z' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Ccircle cx='19' cy='25' r='4.5' fill='%2301C063' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%3Ccircle cx='31' cy='18' r='4.5' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%3Ccircle cx='44' cy='21' r='4.5' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%3Ccircle cx='18' cy='39' r='4.5' fill='%231877BD' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2'/%3E%3C/g%3E%3Cpath transform='translate(61.5 10) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(5)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cg transform='translate(-2 10) scale(.8)'%3E%3Cpath d='M30 52c-11 0-18-6-18-15 0-6 2-10 3-13l-1-12 9 6c2-1 5-1 7-1s5 0 7 1l9-6-1 12c1 3 3 7 3 13 0 9-7 15-18 15z' fill='%23D6E6F3' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='3.25'/%3E%3Ccircle cx='24' cy='35' r='2.3' fill='%231B4261'/%3E%3Ccircle cx='36' cy='35' r='2.3' fill='%231B4261'/%3E%0A%3Ccircle cx='24.8' cy='34.2' r='.7' fill='%23fff'/%3E%3Ccircle cx='36.8' cy='34.2' r='.7' fill='%23fff'/%3E%0A%3Cpath d='M27.8 40.5h4.4L30 42.8z' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='1.6'/%3E%0A%3Cpath d='M30 42.8c0 2-1.6 3-3.2 2.4M30 42.8c0 2 1.6 3 3.2 2.4' fill='none' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='1.6'/%3E%0A%3Ccircle cx='20.5' cy='40.5' r='2.2' fill='%23FE5E5E' opacity='.35'/%3E%3Ccircle cx='39.5' cy='40.5' r='2.2' fill='%23FE5E5E' opacity='.35'/%3E%3C/g%3E%3Cg transform='translate(22 13) scale(.8)'%3E%3Cpath d='M30 52c-11 0-18-6-18-15 0-6 2-10 3-13l-1-12 9 6c2-1 5-1 7-1s5 0 7 1l9-6-1 12c1 3 3 7 3 13 0 9-7 15-18 15z' fill='%23FFC27A' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='3.25'/%3E%3Ccircle cx='24' cy='35' r='2.3' fill='%231B4261'/%3E%3Ccircle cx='36' cy='35' r='2.3' fill='%231B4261'/%3E%0A%3Ccircle cx='24.8' cy='34.2' r='.7' fill='%23fff'/%3E%3Ccircle cx='36.8' cy='34.2' r='.7' fill='%23fff'/%3E%0A%3Cpath d='M27.8 40.5h4.4L30 42.8z' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='1.6'/%3E%0A%3Cpath d='M30 42.8c0 2-1.6 3-3.2 2.4M30 42.8c0 2 1.6 3 3.2 2.4' fill='none' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='1.6'/%3E%0A%3Ccircle cx='20.5' cy='40.5' r='2.2' fill='%23FE5E5E' opacity='.35'/%3E%3Ccircle cx='39.5' cy='40.5' r='2.2' fill='%23FE5E5E' opacity='.35'/%3E%3C/g%3E%3C/g%3E%3Cpath transform='translate(61.5 10) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
  html body section[data-screen-label="Bento"] .zm-about-bento > div:nth-child(7)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-6 -6 76 76'%3E%3Ccircle cx='32' cy='32' r='31' fill='%23F6F9FE' stroke='%231B4261' stroke-width='2.6'/%3E%3Cg transform='translate(32 33) scale(.8) translate(-32 -32)'%3E%3Cpath d='M6 46l14-6 12 6 14-6 12 6v12l-14-4-12 4-12-4-14 4z' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Cpath d='M20 40v16M32 46v8M46 40v16' stroke='%231B4261' stroke-width='1.6' opacity='.5'/%3E%0A%3Cpath d='M32 50c-9-10-14-17-14-24a14 14 0 0 1 28 0c0 7-5 14-14 24z' fill='%23FE5E5E' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.6'/%3E%0A%3Ccircle cx='32' cy='26' r='5.5' fill='%23fff' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.2'/%3E%3C/g%3E%3Cpath transform='translate(61.5 10) scale(1)' d='M0-7l2 5 5 2-5 2-2 5-2-5-5-2 5-2z' fill='%23FFDE59' stroke='%231B4261' stroke-linejoin='round' stroke-linecap='round' stroke-width='2.00'/%3E%3C/svg%3E"); }
}

/* About page: restore line breaks in stat labels so words don't run together, mobile only (Oct 31 2026) */
@media (max-width: 820px) {
  html body section[data-screen-label="Results"] .zm-about-stats br { display: inline; }
}

/* About page: nudge What You Get section up, mobile only (Oct 31 2026) */
@media (max-width: 820px) {
  html body section[data-screen-label="What you get"] { padding-top: 0 !important; }
}

/* About page: center What You Get between the pain cards and the cats photo, mobile only (Oct 31 2026) */
@media (max-width: 820px) {
  html body section[data-screen-label="What you get"] { margin-top: -82px !important; }
}

/* About page: even 88px rhythm between sections, mobile only (Oct 31 2026) */
@media (max-width: 820px) {
  html body section[data-screen-label="What you get"] { margin-top: -65px !important; padding-bottom: 0 !important; }
  html body section[data-screen-label="What you get"] .zm-about-split { gap: 88px !important; }
  html body section[data-screen-label="Results"] { margin-top: 88px !important; }
  html body section[data-screen-label="Bento"] { padding-top: 88px !important; padding-bottom: 88px !important; }
}

/* Gravity Forms: brand blue for buttons, checkboxes and focus rings, all forms (Oct 31 2026) */
html body .gform_wrapper, html body .gform-theme--foundation, html body .gform-theme--orbital {
  --gf-color-primary: #1877BD;
  --gf-color-primary-rgb: 24, 119, 189;
  --gf-color-primary-darker: #16619E;
  --gf-color-primary-lighter: #EDF7FF;
  --gf-ctrl-btn-bg-color-primary: #1877BD;
  --gf-ctrl-btn-bg-color-hover-primary: #16619E;
  --gf-ctrl-btn-border-color-primary: #1877BD;
}
html body .gform_wrapper .gform_button, html body .gform_wrapper input[type="submit"], html body .gform_wrapper .gform-button, html body .gform_wrapper button.gfield_choice_all_toggle {
  background-color: #1877BD !important;
  border-color: #1877BD !important;
  color: #fff !important;
}
html body .gform_wrapper .gform_button:hover, html body .gform_wrapper input[type="submit"]:hover, html body .gform_wrapper .gform-button:hover, html body .gform_wrapper button.gfield_choice_all_toggle:hover {
  background-color: #16619E !important;
  border-color: #16619E !important;
}

/* Home: desktop hero photo swapped for a placeholder (Oct 31 2026) */
html body [data-zm-page="home"] img[src*="hero-zachery"] { display: none !important; }
html body [data-zm-page="home"] [data-zm-x~="zm-x13"] { display: flex !important; align-items: center; justify-content: center; background: #EDF7FF !important; }
html body [data-zm-page="home"] [data-zm-x~="zm-x13"]::after { content: "Placeholder"; font: 600 22px/1.2 Inter, system-ui, sans-serif; color: #1877BD; letter-spacing: 0.01em; }
/* Oct 31 2026: one button style site-wide, matching the homepage hero button (blue, navy outline, offset navy shadow), plus the hover pulse on every button. */
html body a:is(.scp1,.zm-nav-cta,.zm-mobile-cta,.nl-btn), html body .gform_wrapper :is(.gform_button,input[type="submit"],.gform-button), html body #zm-hero2 a[href="/portfolio/"] { background:#1877BD !important; color:#fff !important; border:3px solid #1B4261 !important; border-radius:14px !important; font-weight:800 !important; box-shadow:4px 4px 0 #1B4261; }
html body a:is(.scp2,.scp3,.scp4,.zm-review-btn), html body a.cta-pulse-light { background:#fff !important; color:#1B4261 !important; border:3px solid #1B4261 !important; border-radius:14px !important; font-weight:800 !important; box-shadow:4px 4px 0 #1B4261; }
@keyframes zm-btn-pulse-v2 { 0% { transform:scale(1); box-shadow:4px 4px 0 #1B4261, 0 0 0 0 rgba(24,119,189,.45); } 50% { transform:scale(1.045); } 100% { transform:scale(1.02); box-shadow:4px 4px 0 #1B4261, 0 0 0 12px rgba(24,119,189,0); } }
@media (prefers-reduced-motion: no-preference) { html body a:is(.scp1,.scp2,.scp3,.scp4,.zm-nav-cta,.zm-mobile-cta,.nl-btn,.zm-review-btn,.cta-pulse,.cta-pulse-light):hover, html body #zm-hero2 a[href="/portfolio/"]:hover, html body .gform_wrapper :is(.gform_button,input[type="submit"],.gform-button):hover { animation: zm-btn-pulse-v2 .45s ease-out forwards !important; } }

/* Oct 31 2026: footer Book a Call / Newsletter buttons match the site button style. */
html body footer.zm-footer .zm-footer__btns a { background:#fff !important; color:#1B4261 !important; border:3px solid #1B4261 !important; border-radius:14px !important; font-weight:800 !important; box-shadow:4px 4px 0 #1B4261; }
@media (prefers-reduced-motion: no-preference) { html body footer.zm-footer .zm-footer__btns a:hover { animation: zm-btn-pulse-v2 .45s ease-out forwards !important; } }

/* Oct 31 2026: nav Let's Chat button sits a bit further right of the nav bar (desktop). */
@media (min-width: 821px) { html body .zm-header .zm-navbar { position: relative !important; } html body .zm-header .zm-nav-cta { position: absolute !important; left: 100% !important; top: 0 !important; bottom: 0 !important; margin-left: 48px !important; white-space: nowrap; } }

/* Oct 31 2026: blue photo frames tilt a few degrees left of the photo, like the old Wix site. */
#zm-content [data-zm-x~="zm-x18"] { transform: translate(6px, 8px) rotate(-3deg) !important; }
:is(#was-hero, #focuswp-hero, #bertha-hero, #stellarwp-hero, .was-hero-mobile, .focuswp-hero-mobile, .bertha-hero-mobile, .stellarwp-hero-mobile) { border-color: transparent !important; }
:is(.was-hero-wrap, .focuswp-hero-wrap, .bertha-hero-wrap, .stellarwp-hero-wrap) { position: relative; }
:is(.was-hero-wrap, .focuswp-hero-wrap, .bertha-hero-wrap, .stellarwp-hero-wrap)::after { content: ""; position: absolute; top: 0; right: 0; width: 320px; height: 400px; border: 2px solid var(--zm-blue, #1877BD); border-radius: 5px; box-sizing: border-box; transform: rotate(-3deg); pointer-events: none; z-index: 2; }
@media (max-width: 820px) { :is(.was-hero-wrap, .focuswp-hero-wrap, .bertha-hero-wrap, .stellarwp-hero-wrap)::after { left: 0; right: 0; width: auto; height: 200px; } }

/* Oct 31 2026: keep the homepage About photo (grass) visible. */
html body #zm-content section[data-screen-label="About"] img { display: block !important; opacity: 1 !important; visibility: visible !important; content: normal !important; }

/* Task: move lying-in-the-grass hero photo down 7px on mobile */
@media (max-width: 820px) {
  [data-zm-page="home"] section[data-screen-label="Hero mobile"] img[src*="hero-m-3"] { top: 271px !important; }
}

/* Task, 1 Nov: desktop home hero "See My Work" button back to the original solid blue button (no navy outline, no offset shadow, standard 10px corners) with the hover pulse. Remove this block to return to the 31 Oct style. */
#zm-hero2 a[href="/portfolio/"] {
  background: var(--zm-blue, #1877BD) !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 10px !important;
  font-weight: 500 !important;
}
#zm-hero2 a[href="/portfolio/"]:hover {
  animation: zm-btn-pulse 450ms ease-out forwards;
}
@media (prefers-reduced-motion: reduce) {
  #zm-hero2 a[href="/portfolio/"]:hover { animation: none; }
}

/* Task, 1 Nov: every button back to the original style (flat, no stroke, no offset shadow), overriding the 31 Oct "one button style" block above. Solid blue buttons, outline buttons, white buttons on blue, footer buttons, and the hover pulse. Delete this block to return to the 31 Oct look. */
html body a:is(.scp1,.zm-nav-cta,.zm-mobile-cta,.nl-btn), html body .gform_wrapper :is(.gform_button,input[type="submit"],.gform-button), html body #zm-hero2 a[href="/portfolio/"] { background:#1877BD !important; color:#fff !important; border:0 !important; border-radius:10px !important; font-weight:500 !important; box-shadow:none !important; }
html body a:is(.scp2,.scp3,.scp4) { background:transparent !important; color:#1877BD !important; border:2px solid #1877BD !important; border-radius:10px !important; font-weight:600 !important; box-shadow:none !important; }
html body a:is(.zm-review-btn,.cta-pulse-light) { background:#fff !important; color:#1877BD !important; border:0 !important; border-radius:10px !important; font-weight:500 !important; box-shadow:none !important; }
html body .zm-grid-on-blue a:is(.scp2,.scp3,.scp4) { background:transparent !important; color:#fff !important; border:2px solid #fff !important; }
html body .zm-grid-on-blue a.scp1 { background:#fff !important; color:#1877BD !important; }
html body footer.zm-footer .zm-footer__btns a { background:#fff !important; color:#1877BD !important; border:0 !important; border-radius:4px !important; font-weight:500 !important; box-shadow:none !important; }
@media (prefers-reduced-motion: no-preference) {
  html body a:is(.scp1,.scp2,.scp3,.scp4,.zm-nav-cta,.zm-mobile-cta,.nl-btn,.zm-review-btn,.cta-pulse,.cta-pulse-light):hover, html body #zm-hero2 a[href="/portfolio/"]:hover, html body .gform_wrapper :is(.gform_button,input[type="submit"],.gform-button):hover { animation: zm-btn-pulse .45s ease-out forwards !important; }
  html body .zm-grid-on-blue a:hover, html body a:is(.zm-review-btn,.cta-pulse-light):hover { animation: zm-btn-pulse-light .45s ease-out forwards !important; }
  html body footer.zm-footer .zm-footer__btns a:hover { animation: zm-btn-pulse-soft .45s ease-out forwards !important; }
}

/* Task, 1 Nov: hover pulse back on EVERY button. The ring is drawn with an outline, because the flat-button block above sets box-shadow: none !important, which overrides any box-shadow animation. Same motion as before: quick grow plus a ring that fades out. Blue ring on light backgrounds, white ring on blue bands, softer in the footer. */
@keyframes zm-btn-ring { 0% { transform: scale(1); outline: 0 solid rgba(24,119,189,.45); } 50% { transform: scale(1.045); } 100% { transform: scale(1.02); outline: 12px solid rgba(24,119,189,0); } }
@keyframes zm-btn-ring-light { 0% { transform: scale(1); outline: 0 solid rgba(255,255,255,.55); } 50% { transform: scale(1.045); } 100% { transform: scale(1.02); outline: 12px solid rgba(255,255,255,0); } }
@keyframes zm-btn-ring-soft { 0% { transform: scale(1); outline: 0 solid rgba(255,255,255,.4); } 50% { transform: scale(1.02); } 100% { transform: scale(1.01); outline: 7px solid rgba(255,255,255,0); } }
@media (prefers-reduced-motion: no-preference) {
  html body a:is(.scp1,.scp2,.scp3,.scp4,.zm-nav-cta,.zm-mobile-cta,.nl-btn,.zm-review-btn,.cta-pulse,.cta-pulse-light):hover, html body #zm-hero2 a[href="/portfolio/"]:hover, html body .gform_wrapper :is(.gform_button,input[type="submit"],.gform-button):hover { animation: zm-btn-ring .45s ease-out forwards !important; }
  html body .zm-grid-on-blue a:hover, html body a:is(.zm-review-btn,.cta-pulse-light):hover { animation: zm-btn-ring-light .45s ease-out forwards !important; }
  html body footer.zm-footer .zm-footer__btns a:hover { animation: zm-btn-ring-soft .45s ease-out forwards !important; }
}

/* Task, 1 Nov: home page headings on one lighter scale. Weight 600 everywhere. Desktop hero H1 stays the big statement (48px) but drops from 800 to 600 to match mobile. Feeds band heading and card titles follow the site type scale (H2 24px, H3 18px) instead of their own 44px / 22px at 800. Delete this block to return to the previous weights. */
html body #zm-hero2 h1 { font-weight: 600 !important; }
html body #zm-content .zfc-band h2.zfc-title { font-size: 24px !important; font-weight: 600 !important; }
html body #zm-content .zfc-band h3.zfc-name { font-size: 18px !important; font-weight: 600 !important; }
html body [data-zm-page="home"] div[data-zm-x~="zm-x19"] { font-weight: 600 !important; }

/* Task, 1 Nov: desktop home hero subtext renders at least 16px. The whole hero stage is scaled down by script (0.82 x screen width / 1440), and the site type scale also forces this paragraph to 16px before that scaling, so it was showing around 11-13px. Sizes here are stepped so the rendered text stays 16px or more at every desktop width, and the line gets a little more room. Delete this block to return to the previous size. */
@media (min-width: 1440px) { html body #zm-content #zm-hero2 p { font-size: 20px !important; max-width: 560px !important; } }
@media (min-width: 1280px) and (max-width: 1439px) { html body #zm-content #zm-hero2 p { font-size: 22px !important; max-width: 600px !important; } }
@media (min-width: 1100px) and (max-width: 1279px) { html body #zm-content #zm-hero2 p { font-size: 26px !important; max-width: 640px !important; } }
@media (min-width: 960px) and (max-width: 1099px) { html body #zm-content #zm-hero2 p { font-size: 30px !important; max-width: 660px !important; } }
@media (min-width: 821px) and (max-width: 959px) { html body #zm-content #zm-hero2 p { font-size: 35px !important; max-width: 680px !important; } }

/* Task, 1 Nov: desktop home hero subtext renders at 18px or more (replaces the 16px steps above). Same stepping, because the hero stage is scaled down by script. Only this one paragraph, only on the home page. Delete this block to return to the 16px version. */
@media (min-width: 1440px) { html body #zm-content #zm-hero2 p { font-size: 22px !important; max-width: 600px !important; } }
@media (min-width: 1280px) and (max-width: 1439px) { html body #zm-content #zm-hero2 p { font-size: 25px !important; max-width: 640px !important; } }
@media (min-width: 1100px) and (max-width: 1279px) { html body #zm-content #zm-hero2 p { font-size: 29px !important; max-width: 660px !important; } }
@media (min-width: 960px) and (max-width: 1099px) { html body #zm-content #zm-hero2 p { font-size: 33px !important; max-width: 680px !important; } }
@media (min-width: 821px) and (max-width: 959px) { html body #zm-content #zm-hero2 p { font-size: 39px !important; max-width: 680px !important; } }