/* GENERATED from the candidate design standalone: runtime hover rules, page CSS, then Button component CSS */


    html, body { overflow-x: clip; max-width: 100%; }
    body { background: var(--bg); }
    .txo-site a { color: var(--blue); text-decoration: none; }
    .txo-site a:hover { color: var(--blue-700); }
    .txo-site p a:hover, .txo-site li a:hover, .txo-site td a:hover { text-decoration: underline; text-underline-offset: 3px; }
    .txo-site #dc-root { min-height: 100dvh; display: flex; flex-direction: column; }
    .txo-site { align-items: stretch !important; min-height: 100vh; display: flex; flex-direction: column; }
    .txo-site > * { flex-shrink: 0; }
    .txo-site > main { flex: 1 0 auto; }
    .txo-site main, .txo-site header, .txo-site footer { min-width: 0 !important; width: 100% !important; box-sizing: border-box; align-self: stretch !important; }

    /* logo lockup */
    .txo-site .nav-logo { display: flex; align-items: center; gap: 3px; font-size: 19px; font-weight: 800; letter-spacing: -.03em; color: var(--ink); white-space: nowrap; }
    .txo-site .nav-logo .xo { display: inline-grid; place-items: center; width: 30px; height: 24px; background: var(--blue); color: #fff; border-radius: 6px; font-size: 13px; font-weight: 800; letter-spacing: -.04em; }

    /* public header */
    .txo-site .pubhdr { position: fixed; top: 0; left: 0; right: 0; z-index: 90; background: var(--card); border-bottom: 1px solid var(--line); box-shadow: var(--shadow-sm); }
    .txo-site .pubhdr-in { display: flex; align-items: center; gap: 22px; padding: 13px 24px; }
    .txo-site .pubhdr-logo { display: inline-flex; align-items: center; flex: 0 0 auto; text-decoration: none; }
    .txo-site .pubhdr-logo:hover { text-decoration: none; }
    .txo-site .pubhdr-logo .nav-logo { font-size: 20px; }
    .txo-site #c-close::after { content: ''; position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(21,24,30,.20) 0%, rgba(21,24,30,.13) 55%, rgba(21,24,30,.22) 100%); pointer-events: none; }
    .txo-site .txo-close-bg { position: absolute; inset: 0; z-index: 0; background-image: url("/static/images/website/ds/116b8ac384e5.jpg"); background-size: cover; background-position: center 42%; background-attachment: fixed; opacity: .42; filter: grayscale(1) contrast(1.04); }
    @media (prefers-reduced-motion: reduce) { .txo-site .txo-close-bg { background-attachment: scroll; } }
    @media (max-width: 680px) {
      .txo-site .txo-close-bg { background-attachment: scroll !important; background-position: center 38% !important; }
      .txo-site #c-close { padding-top: 54px !important; padding-bottom: 54px !important; gap: 10px !important; }
      .txo-site #c-close > span:first-of-type { font-size: 25px !important; }
      .txo-site #c-close > span:nth-of-type(2) { font-size: 14.5px !important; }
    }
    .txo-site .txo-live { padding-left: max(28px, calc(50vw - 800px)) !important; padding-right: max(28px, calc(50vw - 800px)) !important; padding-top: 74px !important; padding-bottom: 74px !important; gap: 34px !important; }
    .txo-site .txo-live .txo-strip > div { padding: 32px 26px !important; }
    .txo-site .txo-live .txo-cats { --cg: 12px; }
    .txo-site .txo-live > div:first-child, .txo-site .txo-live > div:last-of-type, .txo-site .txo-live > a { width: 100%; max-width: 1344px; margin-left: auto; margin-right: auto; box-sizing: border-box; }
    .txo-site .txo-cats { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; margin: 14px 0 20px; }
    .txo-site .txo-cat { display: block; text-decoration: none; background: #fff; border: 1px solid var(--line); border-radius: var(--r); box-shadow: 0 1px 2px rgba(21,24,30,.06); cursor: pointer; transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease; }
    .txo-site .txo-cat:hover { transform: translateY(-2px); border-color: var(--blue-line); background: #FCFDFF; box-shadow: var(--shadow); text-decoration: none; }
    .txo-site .txo-cat:hover .txo-cat-lab { color: var(--blue); }
    .txo-site .txo-cat:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
    .txo-site .txo-cat-in { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 10px; height: 126px; padding: 16px 8px 14px; box-sizing: border-box; }
    .txo-site .txo-cat-tile { display: grid; place-items: center; width: 54px; height: 54px; flex-shrink: 0; border-radius: 14px; background: var(--field); border: 1px solid var(--line); transition: background .16s ease, border-color .16s ease; }
    .txo-site .txo-cat:hover .txo-cat-tile { background: var(--blue-tint); border-color: var(--blue-line); }
    .txo-site .txo-cat-art { width: 27px; height: 27px; display: block; }
    .txo-site .txo-cat svg { stroke: var(--blue); stroke-width: 1.7; }
    .txo-site .txo-cat-lab { margin: 0; display: flex; align-items: flex-start; justify-content: center; min-height: 34px; font-size: 13px; font-weight: 700; line-height: 1.3; color: var(--ink); text-align: center; text-wrap: balance; transition: color .16s ease; }
    .txo-site .txo-cat-go { display: none; }
    @media (max-width: 1080px) {
      .txo-site .txo-cats { display: flex !important; flex-wrap: wrap; justify-content: center !important; }
      .txo-site .txo-cats > .txo-cat { flex: 0 1 calc(25% - var(--cg) * 0.75) !important; min-width: 0 !important; }
      .txo-site .txo-cat-in { padding: 13px 8px !important; gap: 9px !important; }
      .txo-site .txo-cat-tile { width: 46px !important; height: 46px !important; }
      .txo-site .txo-cat-lab { font-size: 12.5px !important; min-height: 32px !important; }
    }
    @media (max-width: 680px) { .txo-site .txo-cats > .txo-cat { flex: 0 1 calc(50% - var(--cg) * 0.5); } }
    @media (max-width: 1080px) { .txo-site .txo-live { padding-left: 30px !important; padding-right: 30px !important; } }
      .txo-site .txo-strip > span[style*="width: 1px"] { display: none !important; }
    .txo-site .pubhdr-nav { display: flex; align-items: center; gap: 6px; margin-left: 10px; flex: 1; }
    .txo-site .pubhdr-link { position: relative; z-index: 1; display: inline-flex; flex-direction: column; align-items: center; font-size: 13.5px; font-weight: 600; color: var(--muted); padding: 8px 12px; border-radius: 9px; white-space: nowrap; text-decoration: none; transition: color .16s; }
    /* reserves the bold width, so selecting a link never shifts its neighbours */
    .txo-site .pubhdr-link::after { content: attr(data-label); font-weight: 700; height: 0; visibility: hidden; overflow: hidden; pointer-events: none; }
    .txo-site .pubhdr-link[aria-current="page"] { color: var(--ink); font-weight: 700; }
    .txo-site .pubhdr-link:hover { color: var(--ink); text-decoration: none; }
    /* the moving bar: created by headerNav, sits on the header's bottom border */
    .txo-site .pubhdr-ul { position: absolute; left: 0; bottom: -1px; width: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--blue); opacity: 0; pointer-events: none; z-index: 2; }
    /* the phone menu marks the page you are on */
    .txo-site .txo-mnav-panel a[aria-current="page"] { background: var(--blue-tint); color: var(--blue) !important; font-weight: 700 !important; }
    .txo-site .pubhdr-login { flex: 0 0 auto; display: inline-flex; text-decoration: none; }
    .txo-site .pubhdr-login-btn { display: inline-flex; align-items: center; height: 38px; padding: 0 18px; background: var(--blue); color: #fff; font-size: 13.5px; font-weight: 700; border-radius: 10px; transition: background .16s; }
    .txo-site .pubhdr-login:hover { text-decoration: none; }
    .txo-site .pubhdr-login-btn:hover { background: var(--blue-700); }
    .txo-site .txo-mnav { position: relative; display: none; margin-left: auto; }
    .txo-site .txo-mnav summary::-webkit-details-marker { display: none; }
    .txo-site .txo-mnav summary::marker { content: ''; }
    @media (max-width: 900px) { .txo-site .pubhdr-nav { display: none; } .txo-site .pubhdr-login { display: none; } .txo-site .pubhdr-ul { display: none; } .txo-site .txo-mnav { display: block; } }
    @media (max-width: 680px) { .txo-site .pubhdr-in { padding: 11px 20px; } }

    /* full-bleed band */
    .txo-site .txo-band { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); padding: 60px calc(50vw - 50%); }
    .txo-site .txo-band-white { background: #fff; }

    /* flat domain-style button */
    .txo-site .txo-sub { white-space: nowrap; min-height: 56px; overflow: hidden; max-width: none; }
    @media (max-width: 780px) { .txo-site .txo-sub { white-space: normal; min-height: 0; } }
    .txo-site .txo-flat { appearance: none; position: relative; padding: 0; display: block; text-decoration: none; border: none; outline: none; background-color: #f4f5f6; border-radius: 20px; cursor: pointer; font: inherit; color: inherit; }
    .txo-site .txo-flat:hover { text-decoration: none; }
    .txo-site .txo-flat-in { position: relative; display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 48px; padding: 0 22px; box-shadow: inset 0px -4px 0px #dddddd, 0px -4px 0px #f4f5f6; border-radius: 20px; background: #f4f5f6; box-sizing: border-box; }
    .txo-site .txo-flat-lab { font-size: 14.5px; font-weight: 700; color: #000000; line-height: 1.2; white-space: nowrap; }
    .txo-site .txo-flat[data-on="1"] { border-color: var(--blue); }
    .txo-site .txo-flat[data-on="1"] .txo-flat-in { background: var(--blue-tint); box-shadow: inset 0px -4px 0px var(--blue-line), 0px -4px 0px var(--blue-tint); }
    .txo-site .txo-flat[data-on="1"] .txo-flat-lab { color: var(--blue); }


    .txo-site #c-hero .txo-hcta { justify-content: center; }
    .txo-site .txo-caret { display: inline-block; width: 2px; height: 1em; margin-left: 3px; vertical-align: -2px; background: var(--blue); animation: txoCaret 1s step-end infinite; }
    @keyframes txoCaret { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
    @media (prefers-reduced-motion: reduce) { .txo-site .txo-caret { animation: none; } }
    .txo-site section[data-screen-label="Hero"] { position: relative; }
    .txo-site section[data-screen-label="Hero"] > *:not(.txo-hero-wash) { position: relative; z-index: 1; }
    .txo-site .txo-hero-illo { grid-column: 2; grid-row: 1; position: relative; z-index: 1; align-self: end; justify-self: end; width: 100%; max-width: 500px; aspect-ratio: 1; pointer-events: none; margin-bottom: -67px; }
    .txo-site .txo-hero-illo svg { display: block; width: 100%; height: 100%; }
    .txo-site .txo-relax-art { width: 100%; aspect-ratio: 1; max-height: 560px; justify-self: end; margin-top: -72px; margin-bottom: -48px; pointer-events: none; }
    .txo-site .txo-relax-art svg { display: block; width: 100%; height: 100%; }
    @media (max-width: 1000px) and (min-width: 761px) { .txo-site .txo-relax { grid-template-columns: minmax(0, 1fr) 360px !important; gap: 28px !important; } .txo-site .txo-relax-art { max-height: 360px; margin-top: -46px; margin-bottom: -31px; } }
    @media (max-width: 760px) { .txo-site .txo-relax { grid-template-columns: 1fr !important; gap: 24px !important; } .txo-site .txo-relax-art { max-width: 440px; justify-self: center; order: -1; margin-top: -57px; margin-bottom: -38px; } }
    @media (max-width: 1000px) {
      .txo-site #c-hero { grid-template-columns: 1fr !important; justify-items: center; text-align: center; gap: 8px !important; min-height: 0 !important; }
      .txo-site .txo-herotext { grid-column: 1 !important; grid-row: auto !important; order: -1; align-items: center !important; text-align: center !important; }
      .txo-site .txo-herotext h1 { max-width: 20ch !important; }
      .txo-site .txo-hero-illo { grid-column: 1 !important; grid-row: auto !important; max-width: 380px; justify-self: center; margin-bottom: -51px; }
    }
    @media (max-width: 680px) { .txo-site .txo-hero-illo { max-width: 300px; margin-bottom: -40px; } }
    .txo-site .txo-herotext { grid-column: 1; grid-row: 1; }
    .txo-site .txo-hero-wash { position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); right: calc(50% - 50vw); z-index: 0; pointer-events: none; background: radial-gradient(62% 78% at 50% 4%, var(--blue-tint) 0%, rgba(238,243,255,.55) 42%, rgba(238,243,255,0) 78%); }
    @media (max-width: 1180px) { .txo-site .txo-strip { flex-wrap: wrap !important; row-gap: 14px; } .txo-site .txo-strip > div { flex: 1 1 42% !important; } }
    @media (max-width: 1080px) {
      .txo-site .txo-strip { flex-wrap: nowrap !important; }
      .txo-site .txo-strip > div { flex: 1 1 0 !important; padding: 18px 8px !important; gap: 6px !important; }
      .txo-site .txo-strip > div > sc-if > span, .txo-site .txo-strip > div span[style*="font-size: 44px"] { font-size: 26px !important; }
      .txo-site .txo-strip > div > span:last-child { font-size: 11.5px !important; }
      .txo-site .txo-strip > span[style*="width: 1px"] { display: block !important; }
    }
    @media (max-width: 680px) {
      .txo-site .txo-live { padding-left: 20px !important; padding-right: 20px !important; padding-top: 44px !important; padding-bottom: 44px !important; gap: 22px !important; }
      .txo-site .txo-live .txo-strip > div { padding: 16px 10px !important; }
      .txo-site .txo-marquee { padding: 16px 0 !important; }
      .txo-site .txo-marquee:hover .txo-marquee-track { animation-play-state: running !important; }
      .txo-site .txo-marquee-track img { filter: none !important; opacity: 1 !important; }
      .txo-site .txo-cats { justify-content: center !important; }
      .txo-site .txo-cats > .txo-cat { flex: 0 1 calc(50% - var(--cg) * 0.5) !important; }
      .txo-site .txo-cat-in { padding: 12px 10px !important; gap: 9px !important; }
      .txo-site .txo-cat-tile { width: 42px !important; height: 42px !important; }
      .txo-site .txo-cat-lab { font-size: 12.5px !important; min-height: 30px !important; }
      .txo-site .txo-strip { flex-wrap: wrap !important; row-gap: 8px; }
      .txo-site .txo-strip > span[style*="width: 1px"] { display: none !important; }
      .txo-site .txo-strip > div { flex: 1 1 44% !important; padding: 16px 10px !important; }
      .txo-site .txo-strip > div span[style*="font-size: 44px"] { font-size: 27px !important; }
    }
    @media (max-width: 680px) { .txo-site section#c-hero { padding-bottom: 76px !important; } }

    /* open roles block — case-study rail pattern */

    /* role tiles */

    /* steps */
    .txo-site .txo-step { display: flex; flex-direction: column; gap: 10px; padding: 26px 28px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); }

    /* logo marquee */
    @keyframes txo-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    .txo-site .txo-marquee { position: relative; overflow-x: auto; scrollbar-width: none; }
    .txo-site .txo-marquee::-webkit-scrollbar { display: none; }
    .txo-site .txo-marquee-track { display: flex; align-items: center; gap: 52px; width: max-content; height: 62px; animation: txo-marquee 40s linear infinite; }
    .txo-site .txo-marquee-track img { display: block; mix-blend-mode: multiply; }
    .txo-site .txo-marquee::before, .txo-site .txo-marquee::after { content: ''; position: absolute; top: 0; bottom: 0; width: 130px; z-index: 2; pointer-events: none; }
    .txo-site .txo-marquee::before { left: 0; background: linear-gradient(90deg, #fff 12%, rgba(255,255,255,0)); }
    .txo-site .txo-marquee::after { right: 0; background: linear-gradient(270deg, #fff 12%, rgba(255,255,255,0)); }
    .txo-site .txo-marquee:hover .txo-marquee-track { animation-play-state: paused; }
    @media (prefers-reduced-motion: reduce) { .txo-site .txo-marquee-track { animation: none; } }


    /* mobile sticky action */
    .txo-site .txo-mcta { display: none !important; position: fixed; bottom: 0; left: 0; right: 0; z-index: 70; background: rgba(255,255,255,.97); border-top: 1px solid var(--line); padding: 10px 16px; align-items: center; gap: 12px; }

    @media (max-width: 1080px) {
      .txo-site main { padding-left: 28px !important; padding-right: 28px !important; --main-gap: 72px; }
      .txo-site main h1 { font-size: 36px !important; }
      .txo-site main h2 { font-size: 27px !important; }
    }
    @media (max-width: 680px) {
      .txo-site .txo-resolve { grid-template-columns: 1fr !important; gap: 20px !important; }
      .txo-site .txo-resolve > div:first-of-type { position: static !important; }
      .txo-site .txo-split { grid-template-columns: 1fr !important; }
      .txo-site .txo-steps { grid-template-columns: 1fr !important; row-gap: 14px; }
      .txo-site .txo-steps > span[aria-hidden="true"] { transform: rotate(90deg); }
      .txo-site .txo-hcta { flex-direction: column !important; align-items: stretch !important; }
      .txo-site .txo-hcta > * { width: 100%; }
      .txo-site .txo-close { flex-direction: column !important; align-items: center !important; gap: 16px !important; }
      .txo-site .txo-marquee::before, .txo-site .txo-marquee::after { width: 60px; }
      .txo-site header > div, .txo-site footer > div { padding-left: 20px !important; padding-right: 20px !important; }
      .txo-site main { padding-left: 20px !important; padding-right: 20px !important; --main-gap: 56px; padding-bottom: 18px !important; }
      .txo-site main h1 { font-size: 30px !important; }
      .txo-site main h2 { font-size: 24px !important; }
      .txo-site .txo-mcta { display: flex !important; }
      /* the wrong-audience block sat at the top of the space before the
         footer, with all of it underneath. Same space, block in the middle:
         114px above (56 of section gap + 58) and 114 below (18 + the
         footer's own 96) */
      .txo-site main > section:last-of-type { margin-top: 58px; }
      /* seven domain cards, two to a row: the last one takes the whole row
         instead of sitting alone in the middle with a gap either side; every
         card keeps the same height */
      .txo-site .txo-cats { display: grid !important; grid-template-columns: 1fr 1fr; align-items: stretch; }
      .txo-site .txo-cats > .txo-cat { flex: none !important; width: auto !important; }
      .txo-site .txo-cats > .txo-cat:last-child { grid-column: 1 / -1; }
      /* and the icon and label sit in the middle of the card, not at the top */
      .txo-site .txo-cats .txo-cat-in { justify-content: center !important; }
      /* the two mid-page actions run the full column, like this page's others */
      .txo-site .txo-live > a { display: block; }
      .txo-site .txo-live > a .txo-btn { width: 100%; justify-content: center; }
      .txo-site .txo-relax > div > a { align-self: stretch; }
      .txo-site .txo-relax > div > a .txo-btn { width: 100%; justify-content: center; }
      /* the action bar is always there, so the footer ends above it - as its
         own padding, not a margin: a margin showed the page behind it as a
         grey strip between the footer and the bar */
      .txo-site footer { padding-bottom: 72px !important; margin-bottom: 0 !important; }
    }
      @media (max-width: 1080px) { .txo-site .txo-foot { grid-template-columns: repeat(3, 1fr) !important; gap: 26px !important; } }
    @media (max-width: 680px) { .txo-site .txo-foot { grid-template-columns: 1fr !important; } }
    /* ---- candidate mobile: hero subline holds one line, FAQ CTA sits under the accordion ---- */
    @media (max-width: 680px) {
      .txo-site .txo-sub { white-space: nowrap !important; font-size: 16px !important; min-height: 0 !important; overflow: visible !important; }
      .txo-site .txo-resolve { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 16px !important; }
      .txo-site .txo-resolve > div:nth-child(2) { display: contents !important; }
      .txo-site .txo-resolve > div:nth-child(2) > span:first-of-type { order: 1 !important; }
      .txo-site .txo-resolve > div:nth-child(2) > h2 { order: 2 !important; }
      .txo-site .txo-resolve > div:nth-child(2) > p { order: 3 !important; }
      .txo-site .txo-resolve > div:nth-child(3) { order: 4 !important; }
      .txo-site .txo-resolve > div:nth-child(2) > .c-tikhead { display: block !important; order: 5 !important; margin-top: 2px !important; }
      .txo-site .txo-resolve > div:nth-child(2) > span:last-of-type { order: 6 !important; align-self: stretch !important; }
      /* the link between the two is inline-flex, so it has to stretch as well -
         without this the button below was 100% of a 140px link */
      .txo-site .txo-resolve > div:nth-child(2) > span:last-of-type > a { flex: 1 1 auto !important; display: flex !important; }
      .txo-site .txo-resolve > div:nth-child(2) > span:last-of-type .txo-btn { width: 100% !important; justify-content: center !important; }
    }
    @media (max-width: 400px) { .txo-site .txo-sub { font-size: 15px !important; } }
    /* headline breaks after "job" on desktop; wraps naturally on mobile */
    @media (min-width: 681px) { .txo-site .c-hbrk { display: block; } }
    @media (max-width: 680px) { .txo-site .txo-relax > div > p { font-size: 14.5px !important; line-height: 1.55 !important; } }

/* components/core/Button.jsx (txo-button-css) */

.txo-site .txo-btn{font-family:var(--sans);font-weight:700;font-size:13px;border-radius:var(--r-control);
  padding:9px 15px;border:1px solid transparent;display:inline-flex;align-items:center;gap:8px;
  white-space:nowrap;cursor:pointer;transition:transform .08s var(--ease),background .15s var(--ease),border-color .15s var(--ease);line-height:1;}
.txo-site .txo-btn:active{transform:translateY(1px);}
.txo-site .txo-btn:disabled{opacity:.5;cursor:default;pointer-events:none;}
.txo-site .txo-btn svg{width:15px;height:15px;}
.txo-site .txo-btn--sm{padding:6px 11px;font-size:12.5px;}
.txo-site .txo-btn--lg{padding:11px 19px;font-size:14px;}
.txo-site .txo-btn--primary{background:var(--blue);color:#fff;box-shadow:var(--shadow-primary);}
.txo-site .txo-btn--primary:hover{background:var(--blue-700);}
.txo-site .txo-btn--ghost{background:#fff;color:var(--ink-2);border-color:var(--line);}
.txo-site .txo-btn--ghost:hover{background:var(--bg);border-color:#DADEE6;}
.txo-site .txo-btn--ghost svg{color:var(--muted);}
.txo-site .txo-btn--subtle{background:var(--field);color:var(--ink-2);border-color:var(--line);}
.txo-site .txo-btn--subtle:hover{background:var(--blue-tint);color:var(--blue);border-color:var(--blue-line);}
.txo-site .txo-btn__badge{font-size:11px;font-weight:800;border-radius:999px;padding:1px 7px;background:var(--blue-tint);color:var(--blue);}
.txo-site .txo-btn--has-marker{position:relative;}
.txo-site .txo-btn__marker{position:absolute;top:-5px;right:-5px;width:11px;height:11px;border-radius:50%;background:var(--red);border:2px solid #fff;}