/* Catchment responsive overrides — inline styles carry desktop; these adapt tablet/mobile */

/* iOS Safari inflates text inside any block much wider than the viewport
   ("automatic text size adjustment"). The app mock is a 1276px design shown in
   a ~390px viewport, which is exactly that case: on iPhone the mock's type came
   out larger than authored, so the header stats wrapped and the rows overflowed
   the shell's fixed height and clipped. Desktop engines do not do this, which
   is why it only ever showed on a phone. Opt out globally - the layout already
   sets its own sizes. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
div[data-screen-label="Product screenshot"], div[data-screen-label="Product screenshot"] * { -webkit-text-size-adjust: 100% !important; text-size-adjust: 100% !important; }

@media (max-width: 1120px) {
  div[style*="max-width: 1278px"] { padding-left: 40px !important; padding-right: 40px !important; }
  div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  div[style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  div[style*="grid-template-columns: minmax"] { grid-template-columns: 1fr !important; }
  div[data-screen-label="Product screenshot"] div[style*="repeat(4, 1fr)"] { grid-template-columns: repeat(4, 1fr) !important; }
  div[data-screen-label="Product screenshot"] div[style*="repeat(3, 1fr)"] { grid-template-columns: repeat(3, 1fr) !important; }
  div[style*="margin: 0px -64px"] { margin-left: -40px !important; margin-right: -40px !important; padding-left: 40px !important; padding-right: 40px !important; }
}
@media (max-width: 880px) {
  .nav-links { display: none !important; }
  .nav-burger { display: inline-flex !important; }
}
/* mobile: header actions collapse into the burger only */
@media (max-width: 700px) {
  header[data-screen-label="Header"] > div { padding-left: 20px !important; padding-right: 20px !important; gap: 12px !important; }
  .nav-actions > a { display: none !important; }
  .nav-actions { padding: 3px !important; }
}
@media (min-width: 881px) {
  .nav-mobile { display: none !important; }
}
@media (max-width: 720px) {
  *, *::before, *::after { box-sizing: border-box; }
  body { overflow-x: hidden; }
  div[style*="display: flex"][style*="justify-content: space-between"] { flex-wrap: wrap !important; }
  [style*="white-space: nowrap"] { white-space: normal !important; }
  header [style*="white-space: nowrap"] { white-space: nowrap !important; }
  div[style*="max-width: 1278px"] { padding-left: 20px !important; padding-right: 20px !important; }
  div[style*="grid-template-columns: repeat("] { grid-template-columns: 1fr !important; }
  div[style*="padding: 96px 64px"] { padding-top: 60px !important; padding-bottom: 68px !important; }
  div[style*="padding: 120px 64px 136px"] { padding-top: 76px !important; padding-bottom: 88px !important; }
  div[style*="padding: 92px 64px"] { padding-top: 44px !important; }
  h1[style*="clamp(54px"] { font-size: clamp(36px, 10.5vw, 54px) !important; letter-spacing: -0.01em !important; }
  div[style*="display: flex"][style*="gap: 12px"] { flex-wrap: wrap !important; }
  div[style*="min-width: 380px"] { min-width: 0 !important; width: 100%; }
  div[style*="grid-template-columns: 1.6fr 1fr 1fr 1fr"], div[style*="grid-template-columns: minmax(0px, 1.6fr)"] { grid-template-columns: repeat(2, 1fr) !important; row-gap: 36px !important; }
  div[style*="aspect-ratio: 2.35 / 1"] { aspect-ratio: 3 / 2 !important; min-height: 0 !important; }
  div[style*="margin: 0px -64px"] { margin-left: -20px !important; margin-right: -20px !important; padding-left: 20px !important; padding-right: 20px !important; }
  div[data-screen-label="Product screenshot"] { overflow-x: auto !important; }
  div[data-screen-label="Product screenshot"] > div[style*="position: relative"] { min-width: 860px; }
  div[data-screen-label="Product screenshot"] div[style*="repeat("] { grid-template-columns: repeat(4, 1fr) !important; }
  div[data-screen-label="Product screenshot"] div[style*="repeat(3, 1fr)"] { grid-template-columns: repeat(3, 1fr) !important; }
  .logo-marquee img { height: 52px !important; margin-right: 36px !important; }
  div[style*="padding: 60px 64px"] { padding: 36px 24px !important; }
}

/* Landing v2: platform sticky stack + circular testimonials */
@media (max-width: 720px) {
  #platform div[style*="position: sticky"] { position: static !important; min-height: 0 !important; }
  #customers div[style*="perspective: 1000px"] { height: 300px !important; }
  #customers div[style*="min-height: 240px"] { min-height: 0 !important; }
}

/* eyebrow pips: dark outer layer + pulse */
.pip { width: 4.5px !important; height: 4.5px !important; box-shadow: 0 0 0 3.35px rgba(175,239,199,0.55); animation: pipPulse 2.6s cubic-bezier(0.2,0,0.2,1) infinite; }
@keyframes pipPulse {
  0% { box-shadow: 0 0 0 3.35px rgba(175,239,199,0.55), 0 0 0 3.35px rgba(0,255,103,0.45); }
  70% { box-shadow: 0 0 0 3.35px rgba(175,239,199,0.55), 0 0 0 9px rgba(0,255,103,0); }
  100% { box-shadow: 0 0 0 3.35px rgba(175,239,199,0.55), 0 0 0 9px rgba(0,255,103,0); }
}
@media (prefers-reduced-motion: reduce) { .pip { animation: none; } }

[data-vp="mobile"] div[data-screen-label="Product screenshot"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] { overflow: visible !important; padding-left: 20px !important; padding-right: 20px !important; }


body[data-vp="mobile"] section div[data-screen-label="Product screenshot"][style*="max-width: 1278px"] { padding-bottom: 40px !important; }
@keyframes chipRotate { from { transform: translateX(0); } to { transform: translateX(calc(-100% + 310px)); } }

  white-space: nowrap !important; width: auto !important; font-size: 13px !important; padding: 8px 15px !important;

@media (prefers-reduced-motion: reduce) {
}

/* hero type up a step */
body[data-vp="mobile"] section[data-screen-label="Hero"] p[style*="margin: 0px 0px 36px"] { font-size: 18px !important; line-height: 1.5 !important; }

/* re-applied: section rhythm, logo rows, footer symbol, platform cards */
body[data-vp="mobile"] section div[style*="max-width: 1278px"] { padding-top: 18px !important; padding-bottom: 20px !important; }
body[data-vp="tablet"] section div[style*="max-width: 1278px"] { padding-top: 44px !important; padding-bottom: 48px !important; }

[data-vp="mobile"] div[data-screen-label="Logo wall"] div[style*="margin-top: 12px"] { margin-top: 2px !important; }
[data-vp="mobile"] div[data-screen-label="Logo wall"] .logo-marquee img { height: 42px !important; margin-right: 30px !important; }
[data-vp="tablet"] div[data-screen-label="Logo wall"] div[style*="margin-top: 12px"] { margin-top: 6px !important; }

body[data-vp="mobile"] footer img[style*="clamp(84px, 10.5vw, 144px)"] { height: 58px !important; }

/* module cards match the Why Catchment card: 20px outer inset, 26/20 internal */
body[data-vp="mobile"] #platform > div[style*="max-width: 1278px"] { padding-left: 20px !important; padding-right: 20px !important; }
body[data-vp="mobile"] #platform div[style*="min-height: 440px"][style*="border-radius: 22px"] { padding: 26px 20px !important; margin-top: 16px !important; min-height: 0 !important; }
body[data-vp="tablet"] #platform div[style*="min-height: 440px"][style*="border-radius: 22px"] { padding: 34px 32px !important; margin-top: 24px !important; min-height: 0 !important; }

/* nothing inside the mock wraps */
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="justify-content: space-between"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="justify-content: space-between"] { flex-wrap: nowrap !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] [style*="white-space: nowrap"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] [style*="white-space: nowrap"] { white-space: nowrap !important; }

/* hero keeps the larger type after the re-apply */
body[data-vp="mobile"] section[data-screen-label="Hero"] h1[style*="clamp(54px"] { font-size: 50px !important; line-height: 1.03 !important; }
body[data-vp="mobile"] section div[data-screen-label="Logo wall"][style*="max-width: 1278px"] { padding: 40px 20px 60px !important; }
body[data-vp="mobile"] section div[data-screen-label="Product screenshot"][style*="max-width: 1278px"] { padding-bottom: 40px !important; }
body[data-vp="tablet"] section div[data-screen-label="Logo wall"][style*="max-width: 1278px"] { padding: 56px 40px 28px !important; }

/* every other page's hero: same rhythm as the landing */
body[data-vp="mobile"] section div[style*="padding: 156px 64px 96px"],
body[data-vp="mobile"] section div[style*="padding: 156px 64px 72px"],
body[data-vp="mobile"] section div[style*="padding: 156px 64px 88px"],
body[data-vp="mobile"] section div[style*="padding: 148px 64px 88px"],
body[data-vp="mobile"] section div[style*="padding: 104px 64px"] { padding: 118px 20px 40px !important; }
body[data-vp="tablet"] section div[style*="padding: 156px 64px 96px"],
body[data-vp="tablet"] section div[style*="padding: 156px 64px 72px"],
body[data-vp="tablet"] section div[style*="padding: 156px 64px 88px"],
body[data-vp="tablet"] section div[style*="padding: 148px 64px 88px"] { padding: 132px 40px 56px !important; }

body[data-vp="mobile"] section[data-screen-label="Hero"] h1[style*="clamp(38px, 4vw, 60px)"] { font-size: 38px !important; line-height: 1.05 !important; }
body[data-vp="mobile"] section[data-screen-label="Hero"] h1[style*="clamp(54px"] { font-size: 50px !important; line-height: 1.03 !important; }
body[data-vp="mobile"] section[data-screen-label="Hero"] p[style*="font-size: 20px"] { font-size: 17px !important; line-height: 1.55 !important; margin-top: 18px !important; }
body[data-vp="mobile"] section[data-screen-label="Hero"] div[style*="margin-top: 34px"] { margin-top: 24px !important; }
body[data-vp="tablet"] section[data-screen-label="Hero"] p[style*="font-size: 20px"] { font-size: 18px !important; }

/* dark hero eyebrow rows keep their hairline inset on every page */
body[data-vp="mobile"] section div[style*="border-left: 1px solid rgba(255,252,252,0.14)"] { padding-left: 20px !important; padding-right: 20px !important; }

/* ---- every app mock on every page (module pages use a 24px radius shell + 620px inner) ---- */



body[data-vp="mobile"] section div[data-screen-label="Product screenshot"] { padding-bottom: 34px !important; overflow: visible !important; }
body[data-vp="tablet"] section div[data-screen-label="Product screenshot"] { padding-bottom: 44px !important; overflow: visible !important; }

/* ---- fixed-height blocks that only make sense at desktop width ---- */
[data-vp="mobile"] div[style*="height: 380px"] { height: auto !important; min-height: 0 !important; }
[data-vp="mobile"] div[style*="height: 400px"]:not([style*="perspective"]) { height: 240px !important; }
[data-vp="mobile"] div[style*="height: 320px"]:not([style*="min-height: 320px"]) { height: 210px !important; }
[data-vp="mobile"] div[style*="height: 210px"] { height: 170px !important; }
[data-vp="tablet"] div[style*="height: 400px"] { height: 320px !important; }

/* ---- About team cards stay a swipeable row, just smaller ---- */
[data-vp="mobile"] a[style*="width: 264px"][style*="height: 330px"] { width: 214px !important; height: 268px !important; }

/* ---- two-column body sections collapse cleanly everywhere ---- */
[data-vp="mobile"] div[style*="grid-template-columns: minmax"] { grid-template-columns: 1fr !important; }
[data-vp="mobile"] div[style*="gap: 72px"], [data-vp="mobile"] div[style*="gap: 64px"], [data-vp="mobile"] div[style*="gap: 56px"], [data-vp="mobile"] div[style*="gap: 48px"] { gap: 26px !important; }
[data-vp="tablet"] div[style*="gap: 72px"] { gap: 40px !important; }

/* ---- dashboard widget cards on the module pages ---- */
[data-vp="mobile"] div[style*="min-height: 620px"] { min-height: 620px !important; }
[data-vp="mobile"] div[style*="border-radius: 18px"][style*="box-shadow: 0px 18px 44px"] { padding: 20px 18px !important; }

/* ---- app mocks: zoom shrinks the layout box, so no dead space is left behind.
   The fallback factors below were tuned to the review frame's fixed 390px and
   834px widths; panel-anim.js overrides --dash-zoom from the real container so
   the mock fills its padding on any device. margin:auto keeps it centred if
   that script never runs. ---- */
[data-vp="mobile"] div[data-screen-label="Product screenshot"] > div[style*="border-radius: 22px"],
[data-vp="mobile"] div[data-screen-label="Product screenshot"] > div[style*="border-radius: 24px"] { min-width: 0 !important; width: 1276px !important; zoom: var(--dash-zoom, 0.2743) !important; margin-left: auto !important; margin-right: auto !important; transform: none !important; margin-bottom: 0 !important; }
[data-vp="tablet"] div[data-screen-label="Product screenshot"] > div[style*="border-radius: 22px"],
[data-vp="tablet"] div[data-screen-label="Product screenshot"] > div[style*="border-radius: 24px"] { min-width: 0 !important; width: 1276px !important; zoom: var(--dash-zoom, 0.5909) !important; margin-left: auto !important; margin-right: auto !important; transform: none !important; margin-bottom: 0 !important; }

/* ---- the mobile drawer was hidden by the real viewport's min-width: 881px rule ---- */
[data-vp="mobile"] .nav-mobile, [data-vp="tablet"] .nav-mobile { display: block !important; }

/* ---- one section rhythm for the whole site ---- */
body[data-vp="mobile"] section div[style*="max-width: 1278px"] { padding-top: 28px !important; padding-bottom: 30px !important; }
body[data-vp="tablet"] section div[style*="max-width: 1278px"] { padding-top: 48px !important; padding-bottom: 52px !important; }

/* ---- hero containers on every page beat the generic section rhythm ---- */
body[data-vp="mobile"] section[data-screen-label="Hero"] > div[style*="max-width: 1278px"]:not([data-screen-label]) { padding-top: 120px !important; padding-bottom: 24px !important; }
body[data-vp="tablet"] section[data-screen-label="Hero"] > div[style*="max-width: 1278px"]:not([data-screen-label]) { padding-top: 132px !important; padding-bottom: 56px !important; }
body[data-vp="mobile"] section[data-screen-label="Hero"] > div[style*="padding: 92px 64px 0px"] { padding-top: 138px !important; padding-bottom: 0 !important; }

/* ---- one card inset for the whole site ---- */
[data-vp="mobile"] div[style*="padding: 60px 64px"],
[data-vp="mobile"] div[style*="padding: 48px 56px"],
[data-vp="mobile"] div[style*="padding: 48px 52px"],
[data-vp="mobile"] div[style*="padding: 44px 48px"],
[data-vp="mobile"] div[style*="padding: 30px 32px"],
[data-vp="mobile"] div[style*="padding: 26px 28px"],
[data-vp="mobile"] div[style*="padding: 32px"]:not([style*="clamp(32px"]) { padding: 22px 20px !important; }
[data-vp="tablet"] div[style*="padding: 60px 64px"],
[data-vp="tablet"] div[style*="padding: 48px 56px"],
[data-vp="tablet"] div[style*="padding: 48px 52px"],
[data-vp="tablet"] div[style*="padding: 44px 48px"] { padding: 32px 30px !important; }

/* mock container inside a hero keeps its own tight rhythm */
body[data-vp="mobile"] section[data-screen-label="Hero"] > div[data-screen-label="Product screenshot"] { padding-top: 4px !important; padding-bottom: 34px !important; }
body[data-vp="tablet"] section[data-screen-label="Hero"] > div[data-screen-label="Product screenshot"] { padding-top: 8px !important; padding-bottom: 44px !important; }

/* chips packed tight, no edge fade */

/* mocks are faithful miniatures: nothing inside them reflows */
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 1.45fr 1fr"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 1.45fr 1fr"] { grid-template-columns: 1.45fr 1fr !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 1.4fr 1fr"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 1.4fr 1fr"] { grid-template-columns: 1.4fr 1fr !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 1.5fr 0.7fr 0.8fr 1.1fr"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 1.5fr 0.7fr 0.8fr 1.1fr"] { grid-template-columns: 1.5fr 0.7fr 0.8fr 1.1fr !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 128px 1fr 44px"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 128px 1fr 44px"] { grid-template-columns: 128px 1fr 44px !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 16px 1fr"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 16px 1fr"] { grid-template-columns: 16px 1fr !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 1fr 1fr"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 1fr 1fr"] { grid-template-columns: 1fr 1fr !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 2fr 0.7fr 0.7fr 0.8fr 1.2fr 64px"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: 2fr 0.7fr 0.7fr 0.8fr 1.2fr 64px"] { grid-template-columns: 2fr 0.7fr 0.7fr 0.8fr 1.2fr 64px !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr)"] { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 0.9fr) minmax(0px, 1.4fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 0.9fr) minmax(0px, 1.4fr)"] { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr)"] { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.05fr) minmax(0px, 0.95fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.05fr) minmax(0px, 0.95fr)"] { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr)"] { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.05fr) minmax(0px, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.05fr) minmax(0px, 1fr)"] { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr)"] { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 1fr)"] { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)"] { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 1fr) minmax(0px, 1fr) minmax(0px, 1fr) minmax(0px, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 1fr) minmax(0px, 1fr) minmax(0px, 1fr) minmax(0px, 1fr)"] { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr)"] { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.1fr) minmax(0px, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.1fr) minmax(0px, 1fr)"] { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr)"] { grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.1fr) minmax(300px, 0.9fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.1fr) minmax(300px, 0.9fr)"] { grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.1fr) minmax(300px, 440px)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.1fr) minmax(300px, 440px)"] { grid-template-columns: minmax(0, 1.1fr) minmax(300px, 440px) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.1fr) minmax(300px, 440px)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.1fr) minmax(300px, 440px)"] { grid-template-columns: minmax(0, 1.1fr) minmax(300px, 440px) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr)"] { grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.2fr) minmax(280px, 0.8fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.2fr) minmax(280px, 0.8fr)"] { grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.72fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.72fr)"] { grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.72fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.4fr) minmax(320px, 0.72fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.4fr) minmax(320px, 0.72fr)"] { grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.72fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.62fr) minmax(300px, 0.9fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1.62fr) minmax(300px, 0.9fr)"] { grid-template-columns: minmax(0, 1.62fr) minmax(300px, 0.9fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.62fr) minmax(300px, 0.9fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1.62fr) minmax(300px, 0.9fr)"] { grid-template-columns: minmax(0, 1.62fr) minmax(300px, 0.9fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr)"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(0px, 1.05fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(0px, 1.05fr)"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr)"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(0px, 1.15fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(0px, 1.15fr)"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(0, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(0, 1fr)"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr)"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(280px, 420px)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(280px, 420px)"] { grid-template-columns: minmax(0, 1fr) minmax(280px, 420px) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(280px, 420px)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(280px, 420px)"] { grid-template-columns: minmax(0, 1fr) minmax(280px, 420px) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(300px, 460px)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(300px, 460px)"] { grid-template-columns: minmax(0, 1fr) minmax(300px, 460px) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(300px, 460px)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(300px, 460px)"] { grid-template-columns: minmax(0, 1fr) minmax(300px, 460px) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(300px, 520px)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(300px, 520px)"] { grid-template-columns: minmax(0, 1fr) minmax(300px, 520px) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(300px, 520px)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(300px, 520px)"] { grid-template-columns: minmax(0, 1fr) minmax(300px, 520px) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr)"] { grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(320px, 0.9fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(320px, 0.9fr)"] { grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(260px, 0.8fr) 1.4fr"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(260px, 0.8fr) 1.4fr"] { grid-template-columns: minmax(260px, 0.8fr) 1.4fr !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr)"] { grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(280px, 0.8fr) minmax(0px, 1.2fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(280px, 0.8fr) minmax(0px, 1.2fr)"] { grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.1fr)"] { grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(300px, 0.9fr) minmax(0px, 1.1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(300px, 0.9fr) minmax(0px, 1.1fr)"] { grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(300px, 520px) minmax(0, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(300px, 520px) minmax(0, 1fr)"] { grid-template-columns: minmax(300px, 520px) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(300px, 520px) minmax(0px, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: minmax(300px, 520px) minmax(0px, 1fr)"] { grid-template-columns: minmax(300px, 520px) minmax(0, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(2, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(2, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(3, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: repeat(3, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(3, minmax(0, 1fr))"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(3, minmax(0, 1fr))"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(3, minmax(0px, 1fr))"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(3, minmax(0px, 1fr))"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(4, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(4, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(5, 1fr)"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(5, 1fr)"] { grid-template-columns: repeat(5, 1fr) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fill, minmax(300px, 1fr))"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fill, minmax(300px, 1fr))"] { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fill, minmax(320px, 1fr))"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fill, minmax(320px, 1fr))"] { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fit, minmax(260px, 1fr))"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fit, minmax(260px, 1fr))"] { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fit, minmax(280px, 1fr))"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fit, minmax(280px, 1fr))"] { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fit, minmax(340px, 1fr))"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="grid-template-columns: repeat(auto-fit, minmax(340px, 1fr))"] { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)) !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] [style*="white-space: nowrap"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] [style*="white-space: nowrap"] { white-space: nowrap !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="display: flex"][style*="justify-content: space-between"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="display: flex"][style*="justify-content: space-between"] { flex-wrap: nowrap !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="height: 380px"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="height: 380px"] { height: 380px !important; }
/* Module mocks are authored 620px tall against the landing page mock's 812,
   so on a phone they scaled to the same width but came up visibly shorter.
   Their content actually runs to 922px and was being cropped at 620, so
   taking them to 812 matches the landing page and shows more of the
   dashboard rather than padding it out with empty space. */
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="min-height: 620px"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="min-height: 620px"] { width: 1276px !important; height: 812px !important; min-height: 812px !important; max-height: 812px !important; overflow: hidden !important; }
[data-vp="mobile"] div[data-screen-label="Product screenshot"] div[style*="height: 812px"], [data-vp="tablet"] div[data-screen-label="Product screenshot"] div[style*="height: 812px"] { width: 1276px !important; height: 812px !important; max-height: 812px !important; overflow: hidden !important; }

/* drawer: it sits inside the pointer-events:none header, so links need re-enabling, plus room at the base */
[data-vp="mobile"] .nav-mobile, [data-vp="tablet"] .nav-mobile { pointer-events: auto !important; }
[data-vp="mobile"] .nav-mobile a, [data-vp="tablet"] .nav-mobile a { pointer-events: auto !important; }

/* cards carry their padding on inner columns, not the card itself - normalise those too */
body[data-vp="mobile"] header div.nav-mobile > div[style*="margin-top: 18px"] { margin-top: 20px !important; margin-bottom: 0 !important; }

/* vh resolves against the real window, not the frame - pin it per device */
[data-vp="mobile"] .nav-mobile { max-height: 764px !important; }
[data-vp="tablet"] .nav-mobile { max-height: 1032px !important; }
[data-vp="mobile"] div[style*="scroll-margin-top: calc(50vh"] { scroll-margin-top: 32px !important; }
[data-vp="tablet"] div[style*="scroll-margin-top: calc(50vh"] { scroll-margin-top: 120px !important; }

/* customer story: stack the card under the image instead of overlapping it */
[data-vp="mobile"] figure[style*="margin: -190px"] { margin: 14px 0 0 !important; width: 100% !important; padding: 24px 22px 22px !important; border-radius: 18px !important; }
[data-vp="tablet"] figure[style*="margin: -190px"] { margin: -90px 0 0 auto !important; width: min(560px, 92%) !important; padding: 30px 32px 28px !important; }
[data-vp="mobile"] div[style*="aspect-ratio: 2.35 / 1"] { aspect-ratio: 16 / 10 !important; min-height: 0 !important; }
[data-vp="tablet"] div[style*="aspect-ratio: 2.35 / 1"] { aspect-ratio: 2 / 1 !important; min-height: 0 !important; }
[data-vp="mobile"] div[style*="top: 22px"][style*="left: 22px"] { top: 12px !important; left: 12px !important; font-size: 12px !important; padding: 7px 14px !important; }

/* subscribe placeholder was browser-default faded on dark green */
footer input::placeholder { color: rgba(255,252,252,0.62); opacity: 1; }
footer input::-webkit-input-placeholder { color: rgba(255,252,252,0.62); opacity: 1; }

/* policy pills: identical row and column spacing, tight caps */

/* cards that pad themselves must not also pad their columns */

/* policy pills: rows drift in opposite directions, like the logo rows */



/* projects carousel: stage holds the cards, cards sized for the frame */
[data-vp="mobile"] div[style*="height: 460px"][style*="perspective"] { height: 412px !important; }
[data-vp="mobile"] figure[style*="clamp(280px, 30vw, 380px)"] { width: 250px !important; height: 340px !important; }
/* customers: 88px gap above the portrait stack, 420px stage */
[data-vp="mobile"] section[data-screen-label="Customers"] div[style*="margin-top: 88px"] { margin-top: 30px !important; }
[data-vp="mobile"] section[data-screen-label="Customers"] div[style*="height: 420px"][style*="perspective"] { height: 300px !important; }
[data-vp="tablet"] section[data-screen-label="Customers"] div[style*="margin-top: 88px"] { margin-top: 48px !important; }

/* policy pills: three independent rows; each pill its own width, uniform 8px gaps */
@keyframes chipDriftL { from { transform: translateX(0); } to { transform: translateX(-110px); } }
@keyframes chipDriftR { from { transform: translateX(-110px); } to { transform: translateX(0); } }
[data-vp="mobile"] .chip-rows { display: flex !important; flex-direction: column !important; gap: 8px !important; margin-top: 22px !important; overflow: hidden !important; margin-left: -20px !important; margin-right: -20px !important; padding: 0 20px !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%); }
[data-vp="mobile"] .chip-row { display: flex !important; gap: 8px !important; width: max-content !important; }
[data-vp="mobile"] .chip-row > span { white-space: nowrap !important; font-size: 13px !important; padding: 7px 14px !important; }
[data-vp="mobile"] .chip-row:nth-child(1) { animation: chipDriftL 21s cubic-bezier(0.4,0,0.6,1) infinite alternate; }
[data-vp="mobile"] .chip-row:nth-child(2) { animation: chipDriftR 21s cubic-bezier(0.4,0,0.6,1) infinite alternate; }
[data-vp="mobile"] .chip-row:nth-child(3) { animation: chipDriftL 25s cubic-bezier(0.4,0,0.6,1) infinite alternate; }
@media (prefers-reduced-motion: reduce) { [data-vp="mobile"] .chip-row { animation: none !important; } }


/* Device-mode rules stop at the app-mock shell: it is a zoomed miniature and must never reflow */
/* device-mode rules (formerly @scope-wrapped; the wrapper never applied in Chrome preview) */

/* Review-only viewport switcher: mirrors the media queries above for the top-bar device toggle */
  [data-vp="tablet"] div[style*="max-width: 1278px"] { padding-left: 40px !important; padding-right: 40px !important; }
  [data-vp="tablet"] div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  [data-vp="tablet"] div[style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  [data-vp="tablet"] div[style*="grid-template-columns: minmax"] { grid-template-columns: 1fr !important; }
      [data-vp="tablet"] div[style*="margin: 0px -64px"] { margin-left: -40px !important; margin-right: -40px !important; padding-left: 40px !important; padding-right: 40px !important; }
  [data-vp="tablet"] .nav-links { display: none !important; }
  [data-vp="tablet"] .nav-burger { display: inline-flex !important; }
  [data-vp="mobile"] div[style*="max-width: 1278px"] { padding-left: 40px !important; padding-right: 40px !important; }
  [data-vp="mobile"] div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  [data-vp="mobile"] div[style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  [data-vp="mobile"] div[style*="grid-template-columns: minmax"] { grid-template-columns: 1fr !important; }
      [data-vp="mobile"] div[style*="margin: 0px -64px"] { margin-left: -40px !important; margin-right: -40px !important; padding-left: 40px !important; padding-right: 40px !important; }
  [data-vp="mobile"] .nav-links { display: none !important; }
  [data-vp="mobile"] .nav-burger { display: inline-flex !important; }
  [data-vp="mobile"] header[data-screen-label="Header"] > div { padding-left: 20px !important; padding-right: 20px !important; gap: 12px !important; }
  [data-vp="mobile"] .nav-actions > a { display: none !important; }
  [data-vp="mobile"] .nav-actions { padding: 3px !important; }
  [data-vp="mobile"] *, [data-vp="mobile"] *::before, [data-vp="mobile"] *::after { box-sizing: border-box; }
  body[data-vp="mobile"] { overflow-x: hidden; }
  [data-vp="mobile"] div[style*="display: flex"][style*="justify-content: space-between"] { flex-wrap: wrap !important; }
  [data-vp="mobile"] [style*="white-space: nowrap"] { white-space: normal !important; }
  [data-vp="mobile"] header [style*="white-space: nowrap"] { white-space: nowrap !important; }
  [data-vp="mobile"] div[style*="max-width: 1278px"] { padding-left: 20px !important; padding-right: 20px !important; }
  [data-vp="mobile"] div[style*="grid-template-columns: repeat("] { grid-template-columns: 1fr !important; }
  [data-vp="mobile"] div[style*="padding: 96px 64px"] { padding-top: 60px !important; padding-bottom: 68px !important; }
  [data-vp="mobile"] div[style*="padding: 120px 64px 136px"] { padding-top: 76px !important; padding-bottom: 88px !important; }
  [data-vp="mobile"] div[style*="padding: 92px 64px"] { padding-top: 44px !important; }
  [data-vp="mobile"] h1[style*="clamp(54px"] { font-size: 36px !important; letter-spacing: -0.01em !important; }
  [data-vp="mobile"] div[style*="display: flex"][style*="gap: 12px"] { flex-wrap: wrap !important; }
  [data-vp="mobile"] div[style*="min-width: 380px"] { min-width: 0 !important; width: 100%; }
  [data-vp="mobile"] div[style*="grid-template-columns: 1.6fr 1fr 1fr 1fr"], [data-vp="mobile"] div[style*="grid-template-columns: minmax(0px, 1.6fr)"] { grid-template-columns: repeat(2, 1fr) !important; row-gap: 36px !important; }
  [data-vp="mobile"] div[style*="aspect-ratio: 2.35 / 1"] { aspect-ratio: 3 / 2 !important; min-height: 0 !important; }
  [data-vp="mobile"] div[style*="margin: 0px -64px"] { margin-left: -20px !important; margin-right: -20px !important; padding-left: 20px !important; padding-right: 20px !important; }
          [data-vp="mobile"] .logo-marquee img { height: 52px !important; margin-right: 36px !important; }
  [data-vp="mobile"] div[style*="padding: 60px 64px"] { padding: 36px 24px !important; }
  
  [data-vp="mobile"] #customers div[style*="perspective: 1000px"] { height: 300px !important; }
  [data-vp="mobile"] #customers div[style*="min-height: 240px"] { min-height: 0 !important; }










/* device modes: mobile + tablet layout pass (vw units resolve against the real viewport, so every clamp is pinned here) */
[data-vp="mobile"] [style*="clamp(54px, 6.4vw, 96px)"] { font-size: 36px !important; }
[data-vp="tablet"] [style*="clamp(54px, 6.4vw, 96px)"] { font-size: 44px !important; }
[data-vp="mobile"] [style*="clamp(54px, 5.8vw, 96px)"] { font-size: 36px !important; }
[data-vp="tablet"] [style*="clamp(54px, 5.8vw, 96px)"] { font-size: 44px !important; }
[data-vp="mobile"] [style*="clamp(44px, 5vw, 72px)"] { font-size: 34px !important; }
[data-vp="tablet"] [style*="clamp(44px, 5vw, 72px)"] { font-size: 38px !important; }
[data-vp="mobile"] [style*="clamp(38px, 4vw, 60px)"] { font-size: 32px !important; }
[data-vp="tablet"] [style*="clamp(38px, 4vw, 60px)"] { font-size: 34px !important; }
[data-vp="mobile"] [style*="clamp(38px, 3.6vw, 54px)"] { font-size: 32px !important; }
[data-vp="tablet"] [style*="clamp(38px, 3.6vw, 54px)"] { font-size: 34px !important; }
[data-vp="mobile"] [style*="clamp(36px, 4vw, 58px)"] { font-size: 32px !important; }
[data-vp="tablet"] [style*="clamp(36px, 4vw, 58px)"] { font-size: 33px !important; }
[data-vp="mobile"] [style*="clamp(34px, 3.6vw, 52px)"] { font-size: 30px !important; }
[data-vp="tablet"] [style*="clamp(34px, 3.6vw, 52px)"] { font-size: 32px !important; }
[data-vp="mobile"] [style*="clamp(34px, 3.4vw, 46px)"] { font-size: 30px !important; }
[data-vp="tablet"] [style*="clamp(34px, 3.4vw, 46px)"] { font-size: 32px !important; }
[data-vp="mobile"] [style*="clamp(32px, 3.4vw, 50px)"] { font-size: 28px !important; }
[data-vp="tablet"] [style*="clamp(32px, 3.4vw, 50px)"] { font-size: 30px !important; }
[data-vp="mobile"] [style*="clamp(32px, 3.2vw, 44px)"] { font-size: 28px !important; }
[data-vp="tablet"] [style*="clamp(32px, 3.2vw, 44px)"] { font-size: 30px !important; }
[data-vp="mobile"] [style*="clamp(30px, 3vw, 44px)"] { font-size: 26px !important; }
[data-vp="tablet"] [style*="clamp(30px, 3vw, 44px)"] { font-size: 28px !important; }
[data-vp="mobile"] [style*="clamp(30px, 3vw, 42px)"] { font-size: 26px !important; }
[data-vp="tablet"] [style*="clamp(30px, 3vw, 42px)"] { font-size: 28px !important; }
[data-vp="mobile"] [style*="clamp(30px, 3vw, 40px)"] { font-size: 26px !important; }
[data-vp="tablet"] [style*="clamp(30px, 3vw, 40px)"] { font-size: 28px !important; }
[data-vp="mobile"] [style*="clamp(28px, 3vw, 42px)"] { font-size: 25px !important; }
[data-vp="tablet"] [style*="clamp(28px, 3vw, 42px)"] { font-size: 26px !important; }
[data-vp="mobile"] [style*="clamp(28px, 2.8vw, 40px)"] { font-size: 25px !important; }
[data-vp="tablet"] [style*="clamp(28px, 2.8vw, 40px)"] { font-size: 26px !important; }
[data-vp="mobile"] [style*="clamp(28px, 2.8vw, 38px)"] { font-size: 25px !important; }
[data-vp="tablet"] [style*="clamp(28px, 2.8vw, 38px)"] { font-size: 26px !important; }
[data-vp="mobile"] [style*="clamp(26px, 2.6vw, 36px)"] { font-size: 23px !important; }
[data-vp="tablet"] [style*="clamp(26px, 2.6vw, 36px)"] { font-size: 25px !important; }
[data-vp="mobile"] [style*="clamp(26px, 2.6vw, 34px)"] { font-size: 23px !important; }
[data-vp="tablet"] [style*="clamp(26px, 2.6vw, 34px)"] { font-size: 25px !important; }
[data-vp="mobile"] [style*="clamp(26px, 2.4vw, 34px)"] { font-size: 23px !important; }
[data-vp="tablet"] [style*="clamp(26px, 2.4vw, 34px)"] { font-size: 25px !important; }
[data-vp="mobile"] [style*="clamp(24px, 2.2vw, 32px)"] { font-size: 21px !important; }
[data-vp="tablet"] [style*="clamp(24px, 2.2vw, 32px)"] { font-size: 23px !important; }
[data-vp="mobile"] [style*="clamp(22px, 2.3vw, 32px)"] { font-size: 20px !important; }
[data-vp="tablet"] [style*="clamp(22px, 2.3vw, 32px)"] { font-size: 21px !important; }
[data-vp="mobile"] [style*="clamp(22px, 2.2vw, 30px)"] { font-size: 20px !important; }
[data-vp="tablet"] [style*="clamp(22px, 2.2vw, 30px)"] { font-size: 21px !important; }
[data-vp="mobile"] [style*="clamp(22px, 2vw, 28px)"] { font-size: 20px !important; }
[data-vp="tablet"] [style*="clamp(22px, 2vw, 28px)"] { font-size: 21px !important; }
[data-vp="mobile"] [style*="clamp(21px, 2vw, 26px)"] { font-size: 19px !important; }
[data-vp="tablet"] [style*="clamp(21px, 2vw, 26px)"] { font-size: 20px !important; }
[data-vp="mobile"] [style*="clamp(20px, 2vw, 26px)"] { font-size: 19px !important; }
[data-vp="tablet"] [style*="clamp(20px, 2vw, 26px)"] { font-size: 20px !important; }
[data-vp="mobile"] [style*="clamp(19px, 1.7vw, 23px)"] { font-size: 17px !important; }
[data-vp="tablet"] [style*="clamp(19px, 1.7vw, 23px)"] { font-size: 18px !important; }
[data-vp="mobile"] [style*="clamp(18px, 1.7vw, 23px)"] { font-size: 17px !important; }
[data-vp="tablet"] [style*="clamp(18px, 1.7vw, 23px)"] { font-size: 18px !important; }

/* vw-based gaps, heights and widths */
[data-vp="mobile"] [style*="clamp(48px, 6vw, 92px)"] { gap: 32px !important; }
[data-vp="mobile"] [style*="clamp(40px, 5vw, 80px)"], [data-vp="mobile"] [style*="clamp(40px, 5vw, 72px)"], [data-vp="mobile"] [style*="clamp(32px, 5vw, 80px)"] { gap: 28px !important; }
[data-vp="mobile"] [style*="clamp(32px, 4vw, 64px)"] { gap: 26px !important; }
[data-vp="mobile"] [style*="clamp(28px, 4vw, 56px)"] { gap: 24px !important; }
[data-vp="mobile"] [style*="clamp(32px, 4vw, 60px) clamp(28px, 4vw, 56px)"] { padding: 28px 20px !important; }
[data-vp="mobile"] [style*="clamp(300px, 34vw, 440px)"] { height: 220px !important; }
[data-vp="mobile"] [style*="clamp(280px, 30vw, 380px)"] { width: 100% !important; }
[data-vp="tablet"] [style*="clamp(300px, 34vw, 440px)"] { height: 300px !important; }
[data-vp="tablet"] [style*="clamp(280px, 30vw, 380px)"] { width: 280px !important; }

/* section rhythm: side inset matches the header's 20px, vertical padding tightened */
body[data-vp="mobile"] section div[style*="max-width: 1278px"] { padding-left: 20px !important; padding-right: 20px !important; }
body[data-vp="mobile"] section div[style*="gap: 96px"] { gap: 28px !important; }
body[data-vp="mobile"] section div[style*="gap: 72px"] { gap: 32px !important; }
body[data-vp="tablet"] section div[style*="max-width: 1278px"] { padding-top: 44px !important; padding-bottom: 48px !important; }


/* app mock: reflow to a narrower canvas and scale it into the frame */

/* footer */
body[data-vp="mobile"] footer div[style*="max-width: 1278px"] { padding-left: 20px !important; padding-right: 20px !important; }
body[data-vp="mobile"] footer div[style*="padding: 64px 64px 48px"] { padding-top: 44px !important; padding-bottom: 32px !important; }
body[data-vp="mobile"] footer div[style*="padding: 56px 64px 44px"] { padding-top: 28px !important; padding-bottom: 24px !important; align-items: center !important; gap: 16px !important; }
body[data-vp="mobile"] footer img[style*="clamp(52px, 7vw, 96px)"] { height: 30px !important; max-width: 190px !important; }
body[data-vp="mobile"] footer img[style*="clamp(84px, 10.5vw, 144px)"] { height: 36px !important; }
body[data-vp="tablet"] footer img[style*="clamp(52px, 7vw, 96px)"] { height: 56px !important; max-width: 420px !important; }
body[data-vp="tablet"] footer img[style*="clamp(84px, 10.5vw, 144px)"] { height: 78px !important; }

/* nav + hero, mobile: matched to the live site's proportions */
body[data-vp="mobile"] header[data-screen-label="Header"] > div { padding: 16px 16px 0 !important; }
body[data-vp="mobile"] header a[style*="backdrop-filter"] { height: 52px !important; box-sizing: border-box !important; padding: 0 18px !important; border-radius: 16px !important; }
body[data-vp="mobile"] header a[style*="backdrop-filter"] img { height: 25px !important; }
body[data-vp="mobile"] header .nav-actions { min-height: 52px !important; box-sizing: border-box !important; border-radius: 16px !important; }
body[data-vp="mobile"] header .nav-burger { width: 42px !important; height: 42px !important; }

body[data-vp="mobile"] section[data-screen-label="Hero"] > div[style*="padding: 92px 64px 0px"] { padding: 138px 20px 0 !important; }
body[data-vp="mobile"] section[data-screen-label="Hero"] a[style*="margin-top: 76px"] { margin-top: 0 !important; padding: 11px 18px !important; font-size: 13.5px !important; }
body[data-vp="mobile"] section[data-screen-label="Hero"] div[style*="padding: 92px 0px 148px"] { padding: 30px 0 0 !important; gap: 18px !important; }
body[data-vp="mobile"] section[data-screen-label="Hero"] p[style*="margin: 0px 0px 36px"] { margin-bottom: 26px !important; font-size: 17px !important; line-height: 1.55 !important; }
body[data-vp="mobile"] section div[data-screen-label="Logo wall"][style*="max-width: 1278px"] { padding: 40px 20px 60px !important; }

/* Hero CTA. On desktop the orb sits inside the pill and slides out on hover.
   Touch has no hover, so mobile shows that opened state permanently - the pill
   keeps its own padding and the orb hangs off the right edge, still inside the
   anchor so it stays part of the tap target. Tablet keeps the orb tucked in. */
[data-vp="mobile"] .cta-float::after, [data-vp="tablet"] .cta-float::after { display: none !important; }

[data-vp="tablet"] .cta-float { padding: 15px 66px 15px 26px !important; justify-content: flex-start !important; }
[data-vp="tablet"] .cta-float .cta-orb { position: absolute !important; right: 8px !important; left: auto !important; top: 50% !important; width: 42px !important; height: 42px !important; border-radius: 99px !important; transform: translateY(-50%) !important; background: #EAFFF2 !important; box-shadow: none !important; }
[data-vp="tablet"] .cta-float:hover { padding-right: 66px !important; }

[data-vp="mobile"] .cta-float { padding: 15px 26px !important; justify-content: flex-start !important; }
[data-vp="mobile"] .cta-float .cta-orb { position: absolute !important; left: 100% !important; right: auto !important; margin-left: 12px !important; top: 50% !important; width: 46px !important; height: 46px !important; border-radius: 99px !important; transform: translateY(-50%) !important; background: #FFFCFC !important; box-shadow: none !important; }
[data-vp="mobile"] .cta-float:hover { padding-right: 26px !important; }
[data-vp="mobile"] .cta-float:hover .cta-orb, [data-vp="tablet"] .cta-float:hover .cta-orb { transform: translateY(-50%) !important; box-shadow: none !important; }

/* tablet nav + hero */
body[data-vp="tablet"] header[data-screen-label="Header"] > div { padding: 20px 24px 0 !important; }
body[data-vp="tablet"] header a[style*="backdrop-filter"] { height: 54px !important; box-sizing: border-box !important; padding: 0 20px !important; }
body[data-vp="tablet"] header .nav-actions { min-height: 54px !important; box-sizing: border-box !important; }
body[data-vp="tablet"] section[data-screen-label="Hero"] > div[style*="padding: 92px 64px 0px"] { padding-top: 122px !important; }
body[data-vp="tablet"] section[data-screen-label="Hero"] a[style*="margin-top: 76px"] { margin-top: 0 !important; }
body[data-vp="tablet"] section[data-screen-label="Hero"] div[style*="padding: 92px 0px 148px"] { padding: 40px 0 0 !important; gap: 28px !important; }
body[data-vp="tablet"] section div[data-screen-label="Logo wall"][style*="max-width: 1278px"] { padding: 56px 40px 28px !important; }

/* tap targets never below 44px */
[data-vp="mobile"] .nav-mobile a { min-height: 44px !important; display: flex !important; align-items: center !important; }

/* framework chips: brick rows that rotate inside the card, never past its padding */
[data-vp="mobile"] div[style*="border-radius: 26px"][style*="padding: 60px 64px"] { overflow: hidden !important; padding: 26px 20px !important; }
  display: grid !important; grid-auto-flow: column !important; grid-template-rows: repeat(3, auto) !important;

/* Built for complex projects: tighter copy rhythm on mobile */

/* The simulated device frame lived here. data-vp now follows the real
   window, so the body must not be pinned to a fake width. */

/* artwork stat rows (Target insights etc): tight rows, pill stays on the right */
[data-vp="mobile"] div[style*="display: grid"][style*="gap: 22px"]:has(> div > span[style*="border-radius: 99px"]) { gap: 13px !important; margin-top: 14px !important; }
[data-vp="mobile"] div[style*="display: grid"][style*="gap: 22px"]:has(> div > span[style*="border-radius: 99px"]) > div { flex-wrap: nowrap !important; padding-bottom: 10px !important; align-items: center !important; }
[data-vp="mobile"] div[style*="display: grid"][style*="gap: 22px"]:has(> div > span[style*="border-radius: 99px"]) > div > div { min-width: 0 !important; }
[data-vp="mobile"] div[style*="display: grid"][style*="gap: 22px"]:has(> div > span[style*="border-radius: 99px"]) > div > div > div:first-child { overflow: hidden !important; text-overflow: ellipsis !important; }
[data-vp="mobile"] div[style*="display: grid"][style*="gap: 22px"]:has(> div > span[style*="border-radius: 99px"]) > div > span { flex: none !important; }

/* projects carousel: caption sits just under the cards */
[data-vp="mobile"] div[style*="perspective"] + div[style*="margin-top: 36px"] { margin-top: 22px !important; }
/* Built for complex projects: stacked card - continuous radius, tight copy */
/* split into two rounded cards on mobile: photo card + copy card */

/* demo form card on mobile */
[data-vp="mobile"] div[style*="border-radius: 18px"][style*="padding: 36px"] { padding: 24px 20px !important; }

/* customer story (Project Proof): image and quote card share the full rail width */
[data-vp="mobile"] div[style*="aspect-ratio: 2.35 / 1"] { aspect-ratio: 16 / 10 !important; height: auto !important; min-height: 0 !important; width: 100% !important; }
[data-vp="mobile"] figure[style*="margin: -190px 0px 0px auto"] { margin: -30px 0 0 !important; width: 100% !important; padding: 24px 20px 22px !important; }
[data-vp="tablet"] figure[style*="margin: -190px 0px 0px auto"] { margin: -120px 0 0 auto !important; }

/* mock dash rows: always 4-across miniature, never wrap (beats the generic flex-wrap rules) */
div[data-screen-label="Product screenshot"] .dash-row[data-row], [data-vp] div[data-screen-label="Product screenshot"] .dash-row[data-row] { flex-wrap: nowrap !important; overflow-x: auto !important; min-width: 0 !important; align-self: stretch !important; }

/* The mock is a miniature of the desktop dashboard: same 1276px shell, same
   1160px rows, same 281px cards, only zoomed down. Left to itself the row
   grows past the shell and gets clipped, so pin it to the desktop width. */
[data-vp] div[data-screen-label="Product screenshot"] .dash-row[data-row] { width: 1160px !important; max-width: none !important; }

/* The <=720px media queries force flex-wrap on anything laid out as a flex row
   with space-between, which reflows the miniature's header stats onto two
   lines. Put them back to nowrap, leaving alone the one row inside the mock
   that asks to wrap in its own inline style. */
div[data-screen-label="Product screenshot"] div[style*="border-radius: 22px"] div[style*="display: flex"]:not([style*="flex-wrap"]),
div[data-screen-label="Product screenshot"] div[style*="border-radius: 24px"] div[style*="display: flex"]:not([style*="flex-wrap"]) { flex-wrap: nowrap !important; }
div[data-screen-label="Product screenshot"] .dash-row[data-row] > div, [data-vp] div[data-screen-label="Product screenshot"] .dash-row[data-row] > div { flex: 0 0 auto !important; }

/* iPad hero titles: halfway between desktop and mobile */
body[data-vp="tablet"] section[data-screen-label="Hero"] h1[style*="clamp(54px"] { font-size: 72px !important; line-height: 1.04 !important; }
body[data-vp="tablet"] section[data-screen-label="Hero"] h1[style*="clamp(38px, 4vw, 60px)"] { font-size: 49px !important; line-height: 1.06 !important; }

/* dash rows: exactly 4 cards per view at every size - identical composition to desktop */
div[data-screen-label="Product screenshot"] .dash-row[data-row] > div, [data-vp] div[data-screen-label="Product screenshot"] .dash-row[data-row] > div { flex: 0 0 calc((100% - 36px) / 4) !important; min-width: 0 !important; width: auto !important; }
/* One height for every dash card. Rows carry different furniture - Overview
   has a progress bar, Targets a status pill, Compliance both - so their
   natural heights differ by a dozen px and the rows read as misaligned. */
div[data-screen-label="Product screenshot"] .dash-row[data-row] > div, [data-vp] div[data-screen-label="Product screenshot"] .dash-row[data-row] > div { min-height: 112px !important; }

/* Built-for split cards (source now two rounded cards) */
[data-vp="mobile"] div[style*="repeat(auto-fit, minmax(340px, 1fr))"] { gap: 14px !important; }
[data-vp="mobile"] div[style*="repeat(auto-fit, minmax(340px, 1fr))"] > div[style*="padding: 0px"] > div { min-height: 250px !important; height: 250px !important; }

/* Built-for copy card: tight rhythm on mobile */
[data-vp="mobile"] div[style*="repeat(auto-fit, minmax(340px, 1fr))"] > div[style*="flex-direction: column"] { gap: 0px !important; }
[data-vp="mobile"] div[style*="repeat(auto-fit, minmax(340px, 1fr))"] > div p { font-size: 15px !important; line-height: 1.55 !important; }
[data-vp="mobile"] div[style*="repeat(auto-fit, minmax(340px, 1fr))"] > div h2 + p { margin-top: 12px !important; }
[data-vp="mobile"] div[style*="repeat(auto-fit, minmax(340px, 1fr))"] > div p + p { margin-top: 9px !important; }
[data-vp="mobile"] div[style*="repeat(auto-fit, minmax(340px, 1fr))"] > div a[style*="margin-top: 30px"] { margin-top: 18px !important; }

/* module problem-card copy columns: tighter inset on small screens */
[data-vp="mobile"] div[style*="border-radius: 22px"][style*="grid"] > div[style*="padding: 56px 52px"] { padding: 26px 20px !important; }
[data-vp="tablet"] div[style*="border-radius: 22px"][style*="grid"] > div[style*="padding: 56px 52px"] { padding: 38px 34px !important; }
[data-vp="mobile"] div[style*="border-radius: 22px"][style*="grid"] > div[style*="padding: 52px 48px"] { padding: 26px 20px !important; }
[data-vp="tablet"] div[style*="border-radius: 22px"][style*="grid"] > div[style*="padding: 52px 48px"] { padding: 38px 34px !important; }

/* Customers: quote above, image below, both full width of the frame inset */
[data-vp="mobile"] section[data-screen-label="Customers"] div[style*="grid-template-columns: minmax(0px, 1fr) minmax(0px, 1.05fr)"] { display: flex !important; flex-direction: column-reverse !important; gap: 22px !important; margin-top: 30px !important; }
[data-vp="mobile"] section[data-screen-label="Customers"] div[style*="perspective: 1000px"] { height: 340px !important; width: 100% !important; }
[data-vp="mobile"] section[data-screen-label="Customers"] div[style*="min-height: 240px"] { min-height: 0 !important; }
[data-vp="mobile"] section[data-screen-label="Customers"] blockquote { margin-top: 16px !important; font-size: 17px !important; line-height: 1.55 !important; }
[data-vp="mobile"] section[data-screen-label="Customers"] div[style*="margin-top: 36px"][style*="gap: 12px"] { margin-top: 20px !important; }
[data-vp="tablet"] section[data-screen-label="Customers"] div[style*="perspective: 1000px"] { height: 380px !important; }

/* eyebrow-to-heading gap: match the Why Catchment rhythm (22px) everywhere on mobile */
[data-vp="mobile"] div[style*="text-transform: uppercase"] + h2, [data-vp="mobile"] div[style*="letter-spacing: 0.08em"] + h2 { margin-top: 22px !important; }
[data-vp="tablet"] div[style*="text-transform: uppercase"] + h2, [data-vp="tablet"] div[style*="letter-spacing: 0.08em"] + h2 { margin-top: 24px !important; }

/* stacked module blocks always read copy first, art second */
[data-vp="mobile"] div[style*="padding: 80px 64px"][style*="display: grid"] > div[style*="min-height: 460px"] { order: 2; }

/* News: featured card stacks cleanly - full-width image under the copy, readable type */
[data-vp="mobile"] section[data-screen-label="Featured"] a[style*="grid-template-columns"] { display: flex !important; flex-direction: column !important; gap: 20px !important; padding: 24px 20px !important; }
[data-vp="mobile"] section[data-screen-label="Featured"] a[style*="grid-template-columns"] h2 { font-size: 26px !important; line-height: 1.15 !important; margin: 14px 0 10px !important; }
[data-vp="mobile"] section[data-screen-label="Featured"] a[style*="grid-template-columns"] p { font-size: 15px !important; line-height: 1.6 !important; margin-bottom: 16px !important; }
[data-vp="mobile"] section[data-screen-label="Featured"] a[style*="grid-template-columns"] div[style*="height: 300px"] { height: 210px !important; width: 100% !important; order: 2; }
[data-vp="mobile"] section[data-screen-label="Featured"] a[style*="grid-template-columns"] span[style*="gap: 16px"] { white-space: nowrap !important; }
[data-vp="tablet"] section[data-screen-label="Featured"] a[style*="grid-template-columns"] { padding: 32px 30px !important; }

/* Blog post header: same hero ramp as the rest of the site */
[data-vp="mobile"] section[data-screen-label="Post header"] > div { padding: 118px 20px 40px !important; }
[data-vp="mobile"] section[data-screen-label="Post header"] h1 { font-size: 32px !important; line-height: 1.12 !important; }
[data-vp="mobile"] section[data-screen-label="Post header"] p { font-size: 16px !important; line-height: 1.6 !important; }
[data-vp="tablet"] section[data-screen-label="Post header"] > div { padding: 132px 40px 56px !important; }

/* module cards keep the desktop sticky-collapse on mobile/tablet */
[data-vp="mobile"] #platform div[style*="position: sticky"] { position: sticky !important; }
[data-vp="mobile"] #platform div[style*="top: 100px"] { top: 84px !important; }
[data-vp="mobile"] #platform div[style*="top: 116px"] { top: 96px !important; }
[data-vp="mobile"] #platform div[style*="top: 132px"] { top: 108px !important; }

/* Catchment for: swipe row with arrows on mobile */
[data-vp="mobile"] .users-nav { display: flex !important; }
[data-vp="mobile"] .users-row { display: flex !important; overflow-x: auto !important; scroll-snap-type: x mandatory; scroll-padding-left: 20px; gap: 14px !important; margin: 0 -20px; padding: 0 20px 6px; scrollbar-width: none; }
[data-vp="mobile"] .users-row::-webkit-scrollbar { display: none; }
[data-vp="mobile"] .users-row > div { flex: 0 0 80% !important; scroll-snap-align: start; }

/* Metrics: 2x2 on mobile */
[data-vp="mobile"] section[data-screen-label="Metrics"] div[style*="repeat(4, 1fr)"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 26px 20px !important; }
[data-vp="mobile"] section[data-screen-label="Metrics"] div[style*="repeat(4, 1fr)"] > div > div:first-child { font-size: 34px !important; }

/* problem-card artwork: inset from the grey card on small screens */
[data-vp="mobile"] div[style*="min-height: 460px"][style*="padding: 44px 48px 44px 0"] { min-height: 0 !important; padding: 0 20px 26px !important; }
[data-vp="tablet"] div[style*="min-height: 460px"][style*="padding: 44px 48px 44px 0"] { padding: 34px 34px 34px 0 !important; }

/* footer link columns: 2x2 on mobile */
[data-vp="mobile"] footer div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 34px 20px !important; }

/* case studies stack copy-then-image on mobile */
[data-vp="mobile"] div[style*="padding: 88px 64px"][style*="display: grid"] > div:has(> img), [data-vp="mobile"] div[style*="padding: 88px 64px"][style*="display: grid"] > div:has(img) { order: 2; }

/* case-study image cards: image fills the shell, no inner inset */
[data-vp="mobile"] div[style*="border-radius: 22px"][style*="overflow: hidden"] > div[style*="height: 400px"] { padding: 0 !important; margin: 0 !important; }

/* module feature blocks stack copy first, artwork second on mobile */
[data-vp="mobile"] div[style*="padding: 80px 64px"][style*="display: grid"] > div[data-dashboard], [data-vp="mobile"] div[style*="padding: 80px 64px"][style*="display: grid"] > div:has([data-dashboard]) { order: 2; }

/* Security & Legal grids */
[data-vp="mobile"] section[data-screen-label="Security"] div[style*="repeat(3, minmax(0, 1fr))"], [data-vp="mobile"] section[data-screen-label="Legal"] div[style*="repeat(3, minmax(0, 1fr))"] { grid-template-columns: 1fr !important; gap: 14px !important; margin-top: 28px !important; }
[data-vp="tablet"] section[data-screen-label="Security"] div[style*="repeat(3, minmax(0, 1fr))"], [data-vp="tablet"] section[data-screen-label="Legal"] div[style*="repeat(3, minmax(0, 1fr))"] { grid-template-columns: repeat(2, 1fr) !important; }

/* case-study image cards fill their shell on tablet too */
[data-vp="tablet"] div[style*="border-radius: 22px"][style*="overflow: hidden"] > div[style*="height: 400px"] { padding: 0 !important; margin: 0 !important; height: 340px !important; }

/* Help Centre: hide row tag pills on mobile, keep top filter chips */
[data-vp="mobile"] details summary span[style*="text-transform: upp"][style*="border-radius: 99px"] { display: none !important; }

/* team marquee bleeds exactly to the frame edge, not past it */
[data-vp="mobile"] .team-wrap { margin-left: -20px !important; margin-right: -20px !important; }
[data-vp="tablet"] .team-wrap { margin-left: -40px !important; margin-right: -40px !important; }

/* About story rows: compact rhythm on mobile */
[data-vp="mobile"] section[data-screen-label="The story"] div[style*="padding: 56px 64px"] { padding: 30px 20px !important; margin: 0 -20px !important; gap: 14px !important; }
[data-vp="mobile"] section[data-screen-label="The story"] > div[style*="max-width: 1278px"] { padding-bottom: 10px !important; }
[data-vp="tablet"] section[data-screen-label="The story"] div[style*="padding: 56px 64px"] { padding: 40px 40px !important; margin: 0 -40px !important; gap: 20px !important; }

[data-vp="mobile"] section[data-screen-label="Quotes"] div[style*="repeat(2, minmax(0, 1fr))"] { grid-template-columns: 1fr !important; gap: 14px !important; }
