/* Fonts are hosted on cxindex.com. Jost and Archivo, SIL Open Font License, see /assets/fonts. */
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/jost-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/jost-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/jost-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/jost-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/jost-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/jost-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/jost-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/archivo-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/archivo-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/archivo-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/archivo-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/archivo-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/archivo-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/archivo-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/archivo-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* CX Index base styles: tokens, header, footer, homepage composition, newsletter, FAQ */

:root{
  --ink:#0B2846;--ink-mid:#44565F;--ink-soft:#7A8B95;
  --green:#0E9C74;--mint:#34D399;--pink:#FF0081;--yellow:#FFC93C;
  --panel:#F1F5F7;--line:#E1E9ED;--rule:6px;--max:1280px;
  --fut:"Futura PT","Futura Now Text","Futura Std","Futura","Jost","Poppins",Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--ink-mid);font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
@media (min-width:1600px){.wrap{max-width:1520px;padding:0 40px}}
h1,h2,h3,h4{color:var(--ink);margin:0;font-family:var(--fut);letter-spacing:-.018em;line-height:1.03;font-weight:600}

/* wireframe annotations */
.door{position:absolute;top:12px;right:12px;font-family:var(--fut);font-size:.72rem;font-weight:600;
  background:var(--ink);color:#fff;padding:4px 9px;letter-spacing:.01em;z-index:2}
.on-dark .door{background:#fff;color:var(--ink)}
.ph{border:2px dashed #B8C6CF;background:repeating-linear-gradient(45deg,#F7F9FA,#F7F9FA 10px,#EFF3F5 10px,#EFF3F5 20px);
  display:flex;align-items:center;justify-content:center;text-align:center;color:var(--ink-soft);font-size:.82rem;padding:14px}
.fill{color:var(--ink-soft);font-style:italic}

/* header */
.site-head{border-bottom:var(--rule) solid var(--ink);background:#fff;position:sticky;top:0;z-index:30}
.head-in{display:flex;align-items:center;gap:26px;height:74px}
/* header runs full width so the logo sits on the left edge, aligned with the composition below */
.site-head .wrap{max-width:none;padding:0 34px}
.brand img{width:132px}
.nav{margin-left:auto;display:flex;align-items:center;gap:22px}
.nav a{font-family:var(--fut);text-decoration:none;font-size:.96rem;font-weight:500;color:var(--ink);position:relative}
.nav a:hover{color:var(--green)}
.nav .has::after{content:"";display:inline-block;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-left:7px;position:relative;top:-3px}
.btn{font-family:var(--fut);display:inline-block;text-decoration:none;font-weight:600;font-size:1rem;padding:14px 24px;border:3px solid var(--ink);background:var(--ink);color:#fff;cursor:pointer}
.btn:hover{background:var(--green);border-color:var(--green)}
.btn.line{background:transparent;color:var(--ink)}
.btn.line:hover{background:var(--ink);color:#fff}
.btn.sm{padding:10px 18px;font-size:.92rem;border-width:2px}
/* Nav dropdowns. Opens on hover and on keyboard focus. The top link still goes to its overview page. */
.nav .dd{position:relative;display:flex;align-items:center}
.nav .dd-menu{position:absolute;top:100%;left:-18px;padding-top:14px;min-width:240px;display:none;z-index:50}
.nav .dd-menu::before{content:"";position:absolute;inset:14px 0 0 0;background:#fff;border:1px solid var(--line);box-shadow:0 12px 28px rgba(11,40,70,.12);z-index:-1}
.nav .dd:hover .dd-menu,.nav .dd:focus-within .dd-menu{display:block}
.nav .dd:hover>.has::after,.nav .dd:focus-within>.has::after{transform:rotate(225deg);top:1px}
.nav .dd-menu a{display:block;padding:9px 18px;font-size:.92rem;white-space:nowrap}
.nav .dd-menu a:first-child{margin-top:8px}
.nav .dd-menu a:last-child{margin-bottom:8px}
.nav .dd-menu a[aria-current]{color:var(--green)}
.nav .dd-menu a.sep{border-top:1px solid var(--line);margin-top:6px;padding-top:12px}
.nav a.btn{color:#fff}

/* composition */
.field{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--rule);background:var(--ink);border:var(--rule) solid var(--ink);
  grid-template-areas:
    "hl hl hl hl hl hl hl gen gen gen gen gen"
    "hl hl hl hl hl hl hl gen gen gen gen gen"
    "hl hl hl hl hl hl hl s1 s1 s1 s2 s3"
    "prod prod prod prod prod prod prod rev rev rev rev rev"
    "prod prod prod prod prod prod prod sec sec sec sec sec"
    "cust cust cust cust cust sect sect sect sect spd spd spd";}
.blk{position:relative;background:#fff;padding:34px 30px;display:flex;flex-direction:column;min-width:0}
.blk h2{font-size:1.55rem;max-width:18ch}
.blk h3{font-size:1.22rem;max-width:20ch}
.blk p{margin:12px 0 0;font-size:.96rem}
.more{margin-top:auto;padding-top:22px;font-size:.9rem;font-weight:700}
.more a{text-decoration:none;border-bottom:3px solid var(--green);padding-bottom:2px;color:var(--ink)}
.more a:hover{border-bottom-color:transparent}

.b-hl{grid-area:hl;padding:56px 46px 46px;justify-content:center}
.b-gen{grid-area:gen;background:var(--green);color:#DBF3EB}
.b-gen h2{max-width:20ch}
.b-gen h2{color:#fff}
.b-gen .more a{color:#fff;border-bottom-color:#fff}
.b-s1{grid-area:s1;background:var(--mint);padding:0;min-height:88px}
.b-s2{grid-area:s2;background:var(--panel);padding:0}
.b-s3{grid-area:s3;background:var(--pink);padding:0}
.b-prod{grid-area:prod}
.b-rev{grid-area:rev;background:var(--ink);color:#B9CEDE}
.b-rev h3{color:#fff}
.b-rev .more a{color:var(--mint);border-bottom-color:var(--mint)}
.b-sec{grid-area:sec;background:var(--panel)}
.b-cust{grid-area:cust}
.b-sect{grid-area:sect;background:var(--panel)}
.b-spd{grid-area:spd;border-top:0}
.b-spd::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--yellow)}
.ask{margin-top:18px;border:2px solid var(--line)}
.ask .q{margin:0;padding:14px 16px;font-family:var(--fut);font-weight:500;font-size:.98rem;color:var(--ink);line-height:1.35;background:var(--panel);border-left:5px solid var(--green)}
.engines{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line);border-top:2px solid var(--line)}
.engines span{background:#fff;padding:12px 6px;text-align:center;font-family:var(--fut);font-weight:600;font-size:.95rem;color:var(--ink)}
.ask .qnote{margin:0;padding:10px 16px 12px;font-size:.78rem;color:var(--ink-soft);border-top:2px solid var(--line)}
.aeo-kick{font-family:var(--fut);font-weight:600;font-size:.84rem;color:var(--green);margin:0 0 10px}

.kick{font-family:var(--fut);font-size:.9rem;font-weight:600;color:var(--green);margin:0 0 18px;display:flex;align-items:center;gap:10px}
.kick i{width:12px;height:12px;background:var(--pink);display:block}
h1{font-size:clamp(2.3rem,4.8vw,4.2rem);max-width:15ch}
.lede{font-size:1.1rem;margin:20px 0 0;max-width:52ch}
.acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.proof{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:4px;background:var(--line);margin-top:30px;max-width:560px}
.proof > div{background:#fff;padding:12px 14px;display:flex;flex-direction:column;justify-content:center}
.proof b{font-family:var(--fut);font-weight:600;font-size:1.45rem;color:var(--ink);line-height:1}
.proof span{font-size:.76rem;color:var(--ink-soft);margin-top:5px;line-height:1.3}
.p-gartner{flex-direction:row!important;align-items:center;gap:12px}
.p-gartner img{width:86px;height:auto}
.p-gartner span{margin-top:0;font-size:.8rem;color:var(--ink-mid)}
.p-gartner b{font-size:1.25rem;display:block}

.also{margin-top:18px}
.also p{margin:0 0 8px;font-family:var(--fut);font-weight:600;font-size:.8rem;color:#DBF3EB}
.also div{display:flex;flex-wrap:wrap;gap:4px}
.also span{font-family:var(--fut);font-weight:600;font-size:.86rem;color:var(--ink);background:#fff;padding:7px 11px}
.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;background:rgba(255,255,255,.35);margin-top:20px}
.nums div{background:var(--green);padding:14px 12px}
.nums b{display:block;font-family:var(--fut);font-size:2rem;font-weight:600;color:#fff;line-height:1}
.nums span{display:block;font-size:.76rem;color:#DBF3EB;margin-top:6px;line-height:1.3}

.shot{margin-top:18px;flex:1;min-height:250px}
.shot-img{margin-top:20px;border:2px solid var(--line);background:#F7F8FA;padding:10px}
.shot-img img{width:100%;height:auto;display:block}

.creds{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;background:var(--line);margin-top:16px}
.creds div{background:#fff;padding:12px}
.creds b{display:block;font-family:var(--fut);font-size:1.05rem;font-weight:600;color:var(--ink)}
.creds span{display:block;font-size:.74rem;color:var(--ink-soft);margin-top:3px;line-height:1.3}

.logos{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:var(--line);margin-top:16px}
.logos div{background:#fff;height:66px;display:flex;align-items:center;justify-content:center;padding:7px 12px;position:relative}
.logos img.col{position:absolute;opacity:0;transition:opacity .18s}
.logos div:hover img.col{opacity:1}
.logos div:hover img.mono{opacity:0}
.logos img.mono{transition:opacity .18s}
@media (hover:none){.logos img.col{display:none}}
.logos img{max-width:100%;height:auto;object-fit:contain}
.cases{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:14px}
.cases a{display:block;text-decoration:none;background:var(--ink);padding:14px 16px 15px}
.cases a:nth-child(2){background:var(--green)}
.cases a:hover{background:#0f3763}
.cases a:nth-child(2):hover{background:#0c8765}
.cases b{display:block;font-family:var(--fut);font-weight:600;font-size:1.5rem;color:#fff;line-height:1}
.cases span{display:block;font-size:.78rem;color:#C9D8E4;margin-top:4px}
.cases a:nth-child(2) span{color:#DBF3EB}
.cases em{display:block;font-style:normal;font-family:var(--fut);font-weight:600;font-size:.84rem;color:#fff;margin-top:10px;padding-top:8px;border-top:1px solid rgba(255,255,255,.3)}
.studies{margin:14px 0 0;padding:0;list-style:none}
.studies li{border-top:2px solid var(--line);padding:9px 0;font-size:.9rem;display:flex;justify-content:space-between;gap:10px}
.studies li span{color:var(--ink-soft);font-size:.8rem}

.beyond{display:block;text-decoration:none;background:var(--ink);padding:16px 18px;margin-top:4px}
.beyond:hover{background:#0f3763}
.beyond b{display:block;font-family:var(--fut);font-weight:600;font-size:1.1rem;color:#fff}
.beyond span{display:block;font-size:.84rem;color:#C9D8E4;margin-top:6px;line-height:1.45}
.beyond em,.gpi em{display:block;font-style:normal;font-family:var(--fut);font-weight:600;font-size:.82rem;margin-top:10px;padding-top:8px}
.beyond em{color:var(--mint);border-top:1px solid rgba(255,255,255,.25)}
.gpi{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;align-items:center;text-decoration:none;background:#fff;border:2px solid var(--line);padding:14px 18px;margin-top:4px}
.gpi:hover{border-color:var(--green)}
.gpi img{width:96px;height:auto}
.gpi b{display:block;font-family:var(--fut);font-weight:600;font-size:1.6rem;color:var(--ink);line-height:1}
.gpi span{display:block;font-size:.8rem;color:var(--ink-soft);margin-top:4px;line-height:1.35}
.gpi em{grid-column:1 / -1;color:var(--ink);border-top:2px solid var(--line)}
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;background:var(--line);margin-top:16px}
.tiles a{background:#fff;padding:12px 12px 14px;text-decoration:none;display:block;border-top:4px solid var(--ink)}
.tiles a:nth-child(2){border-top-color:var(--green)}
.tiles a:nth-child(3){border-top-color:var(--mint)}
.tiles a:nth-child(5){border-top-color:var(--green)}
.tiles a:nth-child(6){border-top-color:var(--mint)}
.tiles a:hover{background:var(--panel)}
.tiles b{display:block;font-family:var(--fut);font-weight:600;color:var(--ink);font-size:.98rem}
.tiles span{display:block;font-size:.74rem;color:var(--ink-soft);margin-top:3px}

/* sections below */
section.band-sec{padding:76px 0}
.sec-head{max-width:62ch;margin-bottom:34px}
.sec-head h2{font-size:clamp(1.8rem,3vw,2.4rem);max-width:22ch}
.sec-head p{margin:14px 0 0;font-size:1.05rem}
.eyebrow{font-family:var(--fut);font-size:.82rem;font-weight:600;color:var(--green);margin:0 0 10px}

.row3{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:var(--rule);background:var(--ink);border:var(--rule) solid var(--ink)}
.row3 > div,.row3 > a{background:#fff;padding:28px 26px;position:relative;text-decoration:none;display:block}
.row3 h3{font-size:1.1rem}
.row3 p{margin:10px 0 0;font-size:.94rem}

.res{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--rule);background:var(--ink);border:var(--rule) solid var(--ink)}
.res a{background:#fff;padding:0;text-decoration:none;display:flex;flex-direction:column;position:relative}
.res a:hover{background:var(--panel)}
.res .cov{height:130px;background:var(--ink);position:relative}
.res .cov::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;
  background:linear-gradient(90deg,var(--green) 0 58%,var(--mint) 58% 86%,var(--pink) 86% 95%,var(--yellow) 95%)}
.res .cov.cs{background:var(--green)}
.res .cov span{position:absolute;left:18px;top:18px;font-family:var(--fut);color:#fff;font-weight:600;font-size:1.05rem;max-width:18ch;line-height:1.1}
.res .meta{padding:16px 18px 20px}
.res .meta b{display:block;font-family:var(--fut);color:var(--ink);font-size:.98rem;font-weight:600}
.res .meta span{font-size:.82rem;color:var(--ink-soft)}

.partners{background:var(--ink);color:#B9CEDE;padding:72px 0}
.partners h2{color:#fff;font-size:clamp(1.8rem,3vw,2.4rem);max-width:20ch}
.pgrid{display:grid;grid-template-columns:1.05fr 1fr;gap:52px;align-items:start}
.plist{display:grid;gap:var(--rule);background:rgba(255,255,255,.38);border:var(--rule) solid rgba(255,255,255,.38)}
.plist div{background:#0D2E50;padding:22px 24px;position:relative}
.plist h3{color:#fff;font-size:1.02rem}
.plist p{margin:7px 0 0;font-size:.9rem;color:#A9C2D6}
.btn.onink{background:var(--green);border-color:var(--green);color:#fff}
.btn.onink:hover{background:#fff;border-color:#fff;color:var(--ink)}
.btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn.ghost:hover{background:#fff;color:var(--ink)}

/* demo form, built as a composition */
.demo{padding:76px 0;border-top:var(--rule) solid var(--ink)}
.dgrid{display:grid;grid-template-columns:.9fr 1.1fr;gap:52px;align-items:start}
.form{display:grid;grid-template-columns:1fr 1fr;gap:var(--rule);background:var(--ink);border:var(--rule) solid var(--ink);position:relative}
.form .f{background:#fff;padding:12px 16px 14px}
.form .f.full{grid-column:1 / -1}
.form label{display:block;font-family:var(--fut);font-size:.8rem;font-weight:600;color:var(--ink);margin-bottom:6px}
.form input,.form select,.form textarea{width:100%;border:0;border-bottom:2px solid var(--line);font:inherit;font-size:1rem;color:var(--ink);padding:6px 0;background:transparent;border-radius:0}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-bottom-color:var(--green)}
.form textarea{resize:vertical;min-height:70px}
.form .submit{grid-column:1 / -1;background:var(--pink);color:#fff;border:0;font-family:var(--fut);font-weight:600;font-size:1.05rem;padding:18px;cursor:pointer;text-align:left}
.form .submit:hover{background:var(--ink)}
.small{font-size:.82rem;color:var(--ink-soft);margin-top:14px}

.gains{list-style:none;margin:14px 0 0;padding:0}
.gains li{position:relative;padding:9px 0 9px 20px;border-top:1px solid rgba(255,255,255,.16);font-size:.9rem;line-height:1.45;color:#B9CEDE}
.gains li:first-child{border-top:0;padding-top:2px}
.gains li::before{content:"";position:absolute;left:0;top:15px;width:8px;height:8px;background:var(--mint)}
.gains li:first-child::before{top:8px}
.gains b{color:#fff;font-weight:600}
/* Canary: yellow is Canary's colour */
.nav a.nav-canary em{font-style:normal;font-size:.64rem;font-weight:700;background:var(--yellow);color:var(--ink);padding:2px 6px;margin-left:6px;position:relative;top:-2px}
.announce{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;background:var(--yellow);color:var(--ink);font-family:var(--fut);font-weight:600;font-size:.95rem;padding:11px 20px;text-decoration:none;border-bottom:var(--rule) solid var(--ink)}
.announce .nb{background:var(--ink);color:var(--yellow);padding:3px 9px;font-size:.76rem}
.announce u{text-decoration:none;border-bottom:2px solid var(--ink)}
.announce:hover u{border-bottom-color:transparent}
.cn{border-top:0;background:var(--ink)}
.cn-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--rule);background:var(--ink);border:var(--rule) solid var(--ink);border-top:0;
  grid-template-areas:"cm cm cm cm cm cm cm c1 c1 c1 c1 c1" "cm cm cm cm cm cm cm c2 c2 c2 c2 c2" "cm cm cm cm cm cm cm c3 c3 c3 c3 c3"}
.cn-main{grid-area:cm;background:var(--yellow);padding:50px 46px 44px;position:relative;display:flex;flex-direction:column;justify-content:center}
.cn-tag{font-family:var(--fut);font-weight:600;font-size:.8rem;background:var(--ink);color:var(--yellow);padding:4px 10px;align-self:flex-start;margin:0 0 18px}
.cn-main h2{font-size:clamp(2rem,3.6vw,3.2rem);max-width:15ch;color:var(--ink)}
.cn-main p{margin:18px 0 0;max-width:50ch;font-size:1.08rem;color:#243845}
.cn-main .btn.line{border-color:var(--ink);color:var(--ink);background:transparent}
.cn-main .btn.line:hover{background:var(--ink);color:#fff}
.cn-sig{grid-area:cs;background:#fff;padding:30px 28px;display:flex;flex-direction:column;justify-content:center;position:relative}
.sig{border:3px solid var(--ink);border-left:10px solid var(--yellow);padding:18px 20px;background:#fff}
.sig-top{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-family:var(--fut);font-weight:600;font-size:.82rem;color:var(--ink)}
.sig-top i{width:10px;height:10px;background:var(--yellow);border:2px solid var(--ink);display:block}
.sig-top span{margin-left:auto;font-weight:500;color:var(--ink-soft);font-size:.74rem}
.sig h3{font-size:1.12rem;max-width:26ch}
.sig dl{margin:12px 0 0;display:grid;gap:8px}
.sig dt{font-family:var(--fut);font-weight:600;font-size:.76rem;color:var(--green)}
.sig dd{margin:2px 0 0;font-size:.88rem;line-height:1.45}
.signote{font-size:.76rem;color:var(--ink-soft);margin:10px 0 0}
.cn-step{background:#fff;padding:24px 28px 26px;position:relative;display:flex;flex-direction:column;justify-content:center}
.cn-step b{display:block;font-family:var(--fut);font-weight:600;font-size:1.2rem;color:var(--ink)}
.cn-step p{margin:8px 0 0;font-size:.94rem}
.cn-step .n{font-family:var(--fut);font-weight:600;font-size:.78rem;color:var(--ink);background:var(--yellow);padding:2px 8px;display:inline-block;margin-bottom:10px;align-self:flex-start}
.c1{grid-area:c1}.c2{grid-area:c2}.c3{grid-area:c3;background:var(--ink)}.c3 b{color:#fff}.c3 p{color:#B9CEDE}
.duo{padding:76px 0;border-top:var(--rule) solid var(--ink)}
.duo-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:start}
.duo h2{font-size:clamp(1.7rem,2.6vw,2.2rem);max-width:20ch}
.duo .sub{margin:12px 0 22px;max-width:50ch}
.stack{display:grid;gap:var(--rule);background:var(--ink);border:var(--rule) solid var(--ink)}
.stack div{background:#fff;padding:20px 22px}
.stack div:last-child{background:var(--panel);border-left:6px solid var(--ink)}
.stack h3{font-size:1.06rem}
.stack p{margin:6px 0 0;font-size:.93rem}
.rlist{display:grid;gap:var(--rule);background:var(--ink);border:var(--rule) solid var(--ink)}
.rlist a{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;background:#fff;padding:16px 18px;text-decoration:none}
.rlist a:hover{background:var(--panel)}
.rlist i{grid-row:span 2;width:44px;height:56px;background:var(--ink);border-bottom:6px solid var(--green);display:block}
.rlist a:nth-child(3) i{border-bottom-color:var(--mint)}
.rlist b{font-family:var(--fut);font-weight:600;color:var(--ink);font-size:1rem}
.rlist span{font-size:.8rem;color:var(--ink-soft)}
@media (max-width:1080px){
  .cn-grid{grid-template-columns:1fr;grid-template-areas:"cm" "c1" "c2" "c3"}
  .duo-grid{grid-template-columns:1fr;gap:40px}
  .nav{gap:16px}
}
@media (max-width:760px){.cn-grid{grid-template-columns:1fr;grid-template-areas:"cm" "c1" "c2" "c3"}.cn-main{padding:38px 24px}}

/* newsletter: The Awkward Question */
.nl{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--rule);background:var(--ink);border:var(--rule) solid var(--ink)}
.nl-main{grid-column:span 9;background:var(--green);padding:36px 34px;color:#DBF3EB}
.nl-main h3{color:#fff;font-size:clamp(1.5rem,2.4vw,2rem);max-width:20ch}
.nl-main p{margin:10px 0 0;max-width:52ch;font-size:.98rem}
.nl-form{display:flex;gap:0;margin-top:20px;max-width:520px;border:3px solid #fff}
.nl-form input{flex:1;min-width:0;border:0;padding:14px 16px;font:inherit;font-size:1rem;color:var(--ink);background:#fff;border-radius:0}
.nl-form input:focus{outline:3px solid var(--ink);outline-offset:-3px}
.nl-form button{border:0;background:var(--ink);color:#fff;font-family:var(--fut);font-weight:600;font-size:1rem;padding:0 22px;cursor:pointer}
.nl-form button:hover{background:var(--pink)}
.nl-small{font-size:.8rem;margin-top:10px;color:#C4EBDD}
.nl-done{font-family:var(--fut);font-weight:600;color:#fff;margin-top:18px}
.nl-side{grid-column:span 3;display:grid;grid-template-rows:1fr 2fr;gap:var(--rule)}
.nl-side span:first-child{background:var(--pink)}.nl-side span:last-child{background:var(--mint)}
.blogrow{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--rule);background:var(--ink);border:var(--rule) solid var(--ink);margin-bottom:var(--rule)}
.blogrow a{background:#fff;padding:22px 22px 24px;text-decoration:none;display:flex;flex-direction:column}
.blogrow a:hover{background:var(--panel)}
.blogrow .cat{font-family:var(--fut);font-weight:600;font-size:.78rem;color:var(--green)}
.blogrow b{font-family:var(--fut);font-weight:600;color:var(--ink);font-size:1.12rem;line-height:1.2;margin-top:8px}
.blogrow .rd{margin-top:auto;padding-top:14px;font-size:.8rem;color:var(--ink-soft)}
.fnl{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:center;padding-bottom:30px;margin-bottom:34px;border-bottom:2px solid var(--line)}
.fnl > *{min-width:0}
.nl-form input{width:100%}
.fnl h4{font-size:1.1rem;margin:0}
.fnl p{margin:6px 0 0;font-size:.88rem}
.fnl .nl-form{border-color:var(--ink);margin-top:0;max-width:none}
@media (max-width:1080px){.nl-main{grid-column:span 12}.nl-side{display:none}.blogrow{grid-template-columns:1fr}.fnl{grid-template-columns:1fr}}

/* footer, doubling as the sitemap */
footer{background:var(--panel);border-top:var(--rule) solid var(--ink);padding:52px 0 36px}
.fgrid{display:grid;grid-template-columns:1.3fr repeat(6,1fr);gap:26px}
.fgrid img{width:130px;margin-bottom:14px}
.fgrid h4{font-size:.84rem;margin:0 0 12px}
.fgrid ul{list-style:none;margin:0;padding:0}
.fgrid li{margin-bottom:8px}
.fgrid a{font-size:.86rem;text-decoration:none;color:var(--ink-mid)}
.fgrid a:hover{color:var(--green)}
.fbar{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:36px;padding-top:20px;border-top:2px solid var(--line);font-size:.8rem;color:var(--ink-soft)}

@media (min-width:1500px){
  .field{grid-template-areas:
    "hl hl hl hl hl hl gen gen gen gen gen gen"
    "hl hl hl hl hl hl gen gen gen gen gen gen"
    "hl hl hl hl hl hl s1 s1 s1 s1 s2 s3"
    "prod prod prod prod prod prod prod rev rev rev rev rev"
    "prod prod prod prod prod prod prod sec sec sec sec sec"
    "cust cust cust cust cust sect sect sect sect spd spd spd";}
  .b-hl{padding:64px 60px 56px}
  h1{font-size:clamp(4.4rem,4.3vw,5.6rem);max-width:14ch}
  .lede{font-size:1.22rem;max-width:56ch}
  .proof{max-width:680px}
  .proof b{font-size:1.7rem}
  .blk h2{font-size:1.85rem}
  .b-gen p{font-size:1.04rem}
}
@media (max-width:1080px){
  .field{grid-template-columns:repeat(6,1fr);grid-template-areas:
    "hl hl hl hl hl hl" "gen gen gen gen gen gen" "s1 s1 s1 s1 s2 s3"
    "prod prod prod prod prod prod" "rev rev rev sec sec sec"
    "cust cust cust sect sect sect" "spd spd spd spd spd spd";}
  .pgrid,.dgrid{grid-template-columns:1fr;gap:32px}
  .row3,.res{grid-template-columns:1fr}
  .fgrid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:760px){
  .proof{grid-template-columns:1fr 1fr}.p-gartner{grid-column:1 / -1}
  :root{--rule:4px}
  .nav a:not(.btn),.nav .dd{display:none}
  .field{grid-template-columns:1fr;grid-template-areas:"hl" "gen" "prod" "rev" "sec" "cust" "sect" "spd" "s1";}
  .b-s2,.b-s3{display:none}
  .blk{padding:28px 22px}.b-hl{padding:40px 22px}
  .tiles{grid-template-columns:1fr 1fr}
  .form{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* FAQ, shared. The same questions are marked up as FAQPage structured data. */
.faq{padding:70px 0;border-top:var(--rule) solid var(--ink);background:#fff}
.faq-list{border:var(--rule) solid var(--ink);background:#fff}
.faq details{border-top:2px solid var(--line)}
.faq details:first-child{border-top:0}
.faq summary{font-family:var(--fut);font-weight:600;color:var(--ink);font-size:1.08rem;padding:18px 56px 18px 22px;cursor:pointer;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:22px;top:14px;font-size:1.5rem;color:var(--green);transition:transform .15s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0;padding:0 22px 20px;max-width:78ch;font-size:.98rem}

/* Mobile menu. Built by site.js from the desktop menu, so the two never drift apart. */
.mnav-btn{display:none;width:44px;height:44px;border:2px solid var(--ink);background:#fff;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;padding:0}
.mnav-btn span{display:block;width:20px;height:2px;background:var(--ink);position:relative}
.mnav-btn span::before,.mnav-btn span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:var(--ink)}
.mnav-btn span::before{top:-6px}.mnav-btn span::after{top:6px}
.mnav{position:fixed;inset:0;z-index:100;background:#fff;display:none;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px)}
.mnav.open{display:flex}
.mnav-top{display:flex;align-items:center;justify-content:space-between;height:74px;padding:0 20px;border-bottom:var(--rule) solid var(--ink);flex:0 0 auto}
.mnav-top img{width:120px}
.mnav-close{width:44px;height:44px;border:2px solid var(--ink);background:#fff;font-size:1.6rem;line-height:1;color:var(--ink);cursor:pointer}
.mnav-list{padding:8px 20px 24px}
.mnav-list > a,.mnav-list summary{display:flex;align-items:center;justify-content:space-between;min-height:54px;border-bottom:2px solid var(--line);font-family:var(--fut);font-weight:600;font-size:1.12rem;color:var(--ink);text-decoration:none;cursor:pointer;list-style:none}
.mnav-list summary::-webkit-details-marker{display:none}
.mnav-list summary::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin:0 6px 4px 0;transition:transform .15s}
.mnav-list details[open] summary::after{transform:rotate(225deg);margin-bottom:-4px}
.mnav-list details[open] summary{color:var(--green)}
.mnav-sub{padding:6px 0 12px 14px;border-left:4px solid var(--green);margin:10px 0 6px}
.mnav-sub a{display:block;padding:10px 0;font-size:1rem;color:var(--ink-mid);text-decoration:none}
.mnav-sub a[aria-current]{color:var(--green);font-weight:600}
.mnav-list a[aria-current="page"]{color:var(--green)}
.mnav-list .nav-canary em{font-style:normal;font-size:.64rem;font-weight:700;background:var(--yellow);color:var(--ink);padding:2px 6px;margin-left:8px}
.mnav-small{display:flex;gap:18px;flex-wrap:wrap;padding:18px 0 4px}
.mnav-small a{font-size:.95rem;color:var(--ink-mid)}
.mnav-cta{margin:auto 20px 20px;text-align:center;justify-content:center}
body.mnav-lock{overflow:hidden}
@media (max-width:760px){
  .mnav-btn{display:flex}
  .site-head .wrap{padding:0 16px}
  .head-in{gap:12px}
}