@charset "utf-8";
/* 
seanx2.com, seanx2.my
hi@seanx2.com
for confiant.com
11/2022
*/

/*=========================
  brand colors
=========================*/
:root {
  --cf-red: #ef1e4a; /* rgb(239,30,74) */
  --cf-blue: #150d45; /* rgb(21,13,69) */
  --cf-grape: #6748ff;
  --cf-gray: #d8d8d8;
  --cf-copy: #363636;
}

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * Add the correct box sizing in Firefox.
 */

hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Remove the inheritance of text transform in Edge and Firefox.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers.
 */

legend {
  padding: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}
/*=========================
  useful globals
=========================*/
* {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility; }
  *:after, *:before {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility; }

.clear { *zoom: 1; }
  .clear:before { content: ' '; display: table; }
  .clear:after { content: ' '; display: table; clear: both; }
  
html {
  font-size: 16px;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizelegibility;
  font-family: sans-serif; 
}
  @media only screen and (min-width: 767px) {
    html { font-size: 18px; } 
  }
  @media only screen and (min-width: 1023px) {
    html { font-size: 20px; } 
  }
  

h1, h2, h3, h4, h5, h6 {
  font-family: 'Manrope', sans-serif; line-height: 1.1; font-weight: 800; margin: 0; padding: 0; color: #fff; letter-spacing: -1px;
}
h1 { font-size: 3rem; }
h2 { font-size: 2.35rem; }
h3 { font-size: 1.17em; }
h4 { font-size: 1em; }
h5 { font-size: 0.83em; }
h6 { font-size: 0.67em; }

/* shared */
ul, li { list-style: none; margin: 0; padding: 0; }

/*=========================
  the basics
  lovingly provided 
  by h5bp
=========================*/
::-moz-selection { background: #b3d4fc; text-shadow: none; }
::selection { background: #b3d4fc; text-shadow: none; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
audio, canvas, iframe, img, svg, video { vertical-align: middle; }
fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; }

/*=========================
  fonts?
=========================*/
@font-face {
  font-family: 'IBM Plex Sans';
  src: url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/fonts/IBMPlexSans-Regular.woff2') format('woff2'),
       url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/fonts/IBMPlexSans-Regular.woff') format('woff');
  font-weight: 400; font-style: normal; font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Sans';
  src: url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/fonts/IBMPlexSans-Medium.woff2') format('woff2'),
       url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/fonts/IBMPlexSans-Medium.woff') format('woff');
  font-weight: 500; font-style: normal; font-display: swap; }

@font-face {
  font-family: 'Manrope';
  src: url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/fonts/Manrope-SemiBold.woff2') format('woff2'),
       url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/fonts/Manrope-SemiBold.woff') format('woff');
  font-weight: 600; font-style: normal; font-display: swap;
}

@font-face {
  font-family: 'Manrope';
  src: url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/fonts/Manrope-ExtraBold.woff2') format('woff2'),
       url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/fonts/Manrope-ExtraBold.woff') format('woff');
  font-weight: 800; font-style: normal; font-display: swap;
}

/*=========================
  my own shit  
=========================*/

/*=== building blocks ===*/
body { background: #fff; }
body, p { font: 400 1rem/1.8 'IBM Plex Sans', sans-serif; -webkit-font-smoothing: antialiased; color: #fff; }
a { text-decoration: none; color: var(--cf-red); font-weight: 800; }

.burrito { margin: 0 auto; width: 90%; display: table; }
.burrito-special { margin: 0 auto; width: 100%; display: table; }
  @media only screen and (min-width: 1023px) {
    .burrito,
    .burrito-special { width: 90%; } 
  }
  @media only screen and (min-width: 1260px) {
    .burrito,
    .burrito-special { width: 100%; max-width: 1140px; } 
	}
.boundless { width: 100%; margin: auto; }
.rel { position: relative; }
.hide { display: none !important; }
figure { margin: 0; }

@media only screen and (min-width: 767px) {
	body, p { font-size: .85rem; }
}

/*=== "shared" ===*/
.v2 .cta-btn { font: 800 .85rem/1 'Manrope', sans-serif; background: var(--cf-red); color: #fff; display: inline-block; text-align: center; padding: 14px 24px; text-decoration: none; transition: all .2s ease-in; border-radius: 4px; }
.v2 .cta-btn:hover { background: #fff; color: var(--cf-red); }
.v2 .cta-btn.rvs { background: #fff; color: var(--cf-blue); }
.v2 .cta-btn.outline { background: transparent; border: 1px solid var(--cf-red); padding: 12px 23px 13px; }
.v2 .cta-btn.rvs:hover { background: var(--cf-blue); color: #fff; }
.v2 .cta-btn.outline:hover { background: var(--cf-red); color: #fff; }

.v2 .gen { padding: 3rem 0; }
.v2 .gen h2 { line-height: 1.25; }
.v2 .gen h2 strong,
.v2 .brands h2 strong { font-weight: 800; color: var(--cf-red); }

@media only screen and (min-width: 767px) {
	.v2 .cta-btn { font-size: .75rem; padding: 12px 24px 13px; }
}

/*=== "shared" ===*/
.g-bar { margin: 0 0 1.15rem; }
.g-bar.empty { padding: 1.15rem 0 0; margin: 0; background: var(--cf-blue); }
.g-bar a { background: var(--cf-red); color: #fff; display: block; padding: 10px 2rem 11px; font-size: .85rem; line-height: 1; text-align: center; }
.g-bar a:hover { background: #fff; color: var(--cf-red); transition: all .2s ease-in; }

@media only screen and (min-width: 767px) {
  .g-bar a { font-size: .65rem; } 
}

/*=== logo ===*/
.v2 .header__skip { display: none; }
.v2 header h1 { display: block; z-index: 3; font-size: 1rem; }
.v2 h1 a img,
.v2 footer h2 a img { max-width: 125px; height: auto; }

/*=== navigation; desktop ===*/
.v2 header { font-size: .75rem; background: var(--cf-blue); padding: 0 0 1rem; width: 100vw; position: fixed; top: 0; z-index: 10; border-bottom: 1px solid var(--cf-blue); transition: top 0.6s ease-in-out; }
.v2 header.subtle { border-bottom: 1px solid #372d67; box-shadow: 0 0 25px 0 rgb(0 0 0 / 30%); top: 0; }
.v2 header.nav-up { top: -141px; }
.v2 header .burrito { display: grid; grid-template-columns: 125px 1fr; column-gap: 3rem; position: relative; }

.v2 nav { position: relative; vertical-align: top; }
.v2 nav.desktop { display: none; }
.v2 nav.desktop ul.cta { text-align: right; }
.v2 nav.desktop ul li { display: inline-block; margin: 1px 25px 3px 0; position: relative; }
.v2 nav.desktop ul li:last-child { margin: 0 0 3px; }
.v2 nav.desktop ul li a { display: block; position: relative; color: #fff; font-weight: 400; border-bottom: 2px solid var(--cf-blue); transition: border-bottom .2s ease-in; }
.v2 nav.desktop ul li a:hover,
.v2 nav.desktop ul li.active a { border-bottom: 2px solid var(--cf-red); }
.v2 nav.desktop ul li.hs-item-has-children a:hover { border-bottom: 2px solid var(--cf-blue); }
.v2 nav.desktop ul li a.cta-btn { font-weight: 800; border-bottom: 0; transition: all .2s ease-in; }
.v2 nav.desktop ul li a.cta-btn:hover { border-bottom: 0; }
.v2 nav.desktop ul li.hs-item-has-children > a:after { content: ''; width: 8px; height: 8px; border-bottom: 2px solid #fff; border-right: 2px solid #fff; display: inline-block; transform: rotate(45deg); position: relative; margin-left: 10px; top: -2px; }
.v2 nav.desktop ul + ul { text-align: right; }

.v2 nav.desktop ul li.hs-item-has-children ul { display: none; transition: all .2s ease-in; }
.v2 nav.desktop ul li.hs-item-has-children:hover ul { display: block; position: absolute; padding: 0; border: 2px solid var(--cf-red); background: var(--cf-red); transition: all .2s ease-in; }
.v2 nav.desktop ul li.hs-item-has-children ul li { display: block; margin: 0; }
.v2 nav.desktop ul li.hs-item-has-children ul li a { width: 180px; padding: 5px 15px; border-bottom: 0; transition: background .2s ease-in; border-bottom: 0; font-weight: 500; }
.v2 nav.desktop ul li.hs-item-has-children ul li a:hover { color: var(--cf-red); background: #fff; border-bottom: 0; }

@media only screen and (min-width: 767px) {
  .v2 header.nav-up { top: -138px; }
}

/*=== navigation; mobile ===*/
.v2 nav.mobile { margin: 0; position: absolute; top: 10px; right: 0; }

.v2 nav.mobile .trigger, 
.v2 nav.mobile .burger, 
.v2 nav.mobile .burger:before, 
.v2 nav.mobile .burger:after { position: absolute; top: 3px; right: 0; background: #fff; width: 25px; height: 2px; cursor: pointer; z-index: 10; }

.v2 nav.mobile .trigger { background: none; }
.v2 nav.mobile .burger:before { content: ''; top: 0; right: 0; transform-origin: center; transform: translate(0px, 6px); }
.v2 nav.mobile .burger:after { content: ''; top: 0; right: 0; transform-origin: center; transform: translate(0px, 12px); }

#m-toggle:checked + .trigger + .burger { background: var(--cf-red); transform: rotate(-45deg); }
#m-toggle:checked + .trigger + .burger:before { transform: scale(0); }
#m-toggle:checked + .trigger + .burger:after { background: var(--cf-red); transform: rotate(90deg); }

#m-toggle:checked + .trigger + .burger + .m-menu { animation: menu-open .5s ease both; }
#m-toggle:checked + .trigger ~ .m-menu li,
#m-toggle:checked + .trigger ~ .m-menu #hs_cos_wrapper_global-header_ ul li { display: block; }
.v2 nav.mobile [type="checkbox"]:not(:checked), .v2 nav.mobile [type='checkbox']:checked { width: 25px; height: 25px; margin: 0 0 0 10px; opacity: 0; cursor: pointer; }

.v2 nav.mobile .m-menu { position: fixed; margin: 0; padding: 8rem 0 0; background: var(--cf-blue); animation: menu-not-open .35s both; transition: .35s; right: 0; top: 0; text-align: left; }
.v2 nav.mobile .m-menu #hs_cos_wrapper_global-header_ ul li,
.v2 nav.mobile .m-menu ul.cta li { display: none; padding: 3px .25rem; text-align: left; }

.v2 nav.mobile .m-menu #hs_cos_wrapper_global-header_ ul li a { display: block; color: #fff; font-size: 1rem; line-height: 1; font-weight: 400; padding: 6px 20px; transition: all .2s ease-in; }
.v2 nav.mobile .m-menu #hs_cos_wrapper_global-header_ ul li li a { background: rgba(255,255,255,.05); margin: 0 20px; padding: 12px 20px; }
.v2 nav.mobile .m-menu #hs_cos_wrapper_global-header_ ul li.hs-item-has-children > a:after { content: ''; width: 8px; height: 8px; border-bottom: 2px solid #fff; border-right: 2px solid #fff; display: inline-block; transform: rotate(-45deg); position: relative; margin-left: 10px; top: -1px; }
.v2 nav.mobile .m-menu #hs_cos_wrapper_global-header_ ul li a:hover { color: var(--cf-red); font-weight: 500; }

.v2 nav.mobile .m-menu #hs_cos_wrapper_global-header_ ul li.hs-item-has-children > a.acc-active:after { transform: rotate(45deg); top: -3px; }

.v2 nav.mobile .m-menu #hs_cos_wrapper_global-header_ ul li.hs-item-has-children > a + .hs-menu-children-wrapper { display: none; }
.v2 nav.mobile .m-menu #hs_cos_wrapper_global-header_ ul li.hs-item-has-children > a.acc-active + .hs-menu-children-wrapper { display: block; }
.v2 nav.mobile .m-menu ul.cta li:first-child { margin: 3rem 20px 1px; }
.v2 nav.mobile .m-menu ul.cta li:last-child { margin: 0 20px 1.5rem; }
.v2 nav.mobile .m-menu ul.cta li a.cta-btn { width: 100%; }

@keyframes menu-open {
  0% { width: 2000px; height: 2000px; }
  100% { width: 100%; height: 100vh; } 
}

@keyframes menu-not-open {
  0% { width: 2000px; height: 2000px; }
}

@media only screen and (min-width: 1170px) {
	.v2 nav.desktop { display: grid; grid-template-columns: 70% 1fr; align-items: center; }
	.v2 nav.mobile { display: none; }
}

/*=== hero ===*/
.v2 .hero { background: var(--cf-blue); padding: 8rem 0 0; }
.v2 .hero h1 { animation: datFade ease-in-out 1s; padding: 2rem 0 0; }
.v2 .hero h1 + p { font-size: 1rem; padding: 0 0 1.5rem; }
.v2 .hero .cta-btn { padding: 15px 24px 16px; }
.v2 .hero .content { grid-area: content; }
.v2 .hero .media { grid-area: media; }
.v2 .hero .media img { animation: rightFade ease-in-out 1s; width: 100%; height: auto; }

@media only screen and (min-width: 767px) {
	.v2 .hero .split { grid-template-areas: 'content media'; align-items: center; }
  .v2 .hero h1 { padding: 0; width: 125%; }
  .v2 .hero .media { text-align: right; }
  .v2 .hero .media img { padding: .5rem 0; width: 85%; filter: brightness(1.15); }
}

/*=== brands ===*/
.v2 .brands { background: linear-gradient(180deg, #150d45 0%, #2E2072 100%); position: relative; padding: 5rem 0 2rem; overflow: }
.v2 .brands h2 { text-align: center; margin: 0 auto; padding: 0 1.5rem .5rem; font-weight: 600; letter-spacing: 0; font-size: 1.65rem; }
.v2 .brand-cloud { padding: 1rem 0 0; }
.v2 .brand-cloud ul { text-align: center; display: block; position: relative; }
/*.v2 .brand-cloud ul:hover { animation-play-state: paused; }*/
.v2 .brand-cloud ul li { display: inline-block; margin: 0 -4px 10px 0; height: 50px; width: 110px; vertical-align: middle; }
.v2 .brand-cloud ul li img { display: block;  position: relative; top: 50%; transform: translateY(-50%) scale(.75); text-align: center; margin: 0 auto; }
.v2 .brand-cloud ul li:nth-child(2) { width: 90px; }
.v2 .brand-cloud ul li:nth-child(4) { width: 130px; }
.v2 .brand-cloud ul li:nth-child(5) { width: 80px; }
.v2 .brand-cloud ul li:nth-child(6) { width: 100px; }
.v2 .brand-cloud ul li:nth-child(2) img { margin: 2px auto 0; }
.v2 .brand-cloud ul li:nth-child(3) img { margin: 5px auto 0; }

@media only screen and (min-width: 767px) { 
  .v2 .brand-cloud ul li { width: 120px; vertical-align: middle; }
  .v2 .brand-cloud ul li img { transform: translateY(-50%) scale(.85); }
  .v2 .brand-cloud ul li:nth-child(2) { width: 100px; }
  .v2 .brand-cloud ul li:nth-child(4) { width: 140px; }
  .v2 .brand-cloud ul li:nth-child(5) { width: 90px; }
  .v2 .brand-cloud ul li:nth-child(6) { width: 110px; }
}

@media only screen and (min-width: 1200px) {
  .v2 .brand-cloud ul li { height: 70px; width: 140px; margin: 0 -4px 0 0; }
  .v2 .brand-cloud ul li img { transform: translateY(-50%) scale(1); }
	.v2 .brand-cloud ul li:nth-child(2) { width: 120px; }
  .v2 .brand-cloud ul li:nth-child(4) { width: 160px; }
  .v2 .brand-cloud ul li:nth-child(5) { width: 110px; }
  .v2 .brand-cloud ul li:nth-child(6) { width: 130px; }
}

@keyframes scroll {
	0% { left: 100%; }
	100% { left: -100%; }
}

/*=== stats ===*/
.v2 .stats { padding: 4rem 0; }
.v2 .stats h2 { color: var(--cf-blue); text-align: center; }
.v2 .stats p { text-align: center; color: var(--cf-copy); padding: 0; }
.v2 .stats h3 { color: var(--cf-red); text-align: center; font-size: 2rem; line-height: 1; } 
.v2 .stats .numbers ul { text-align: center; padding: 30px 20px 0; }
.v2 .stats .numbers ul li { display: inline-block; margin: 0 -4px 0 0; width: 50%; min-height: 75px; padding: 0 10px 10px; vertical-align: top; }
.v2 .stats .numbers p { padding: 0 15px; line-height: 1.25; }

@media only screen and (min-width: 767px) {
	.v2 .stats h2,
	.v2 .stats p { text-align: left; }
	.v2 .stats p { padding: .5rem 0 0; }
	.v2 .stats .numbers ul { padding: 10px 20px 0; }
	.v2 .stats .numbers p { text-align: center; }
}

/*=== clients ===*/
.v2 .clients { background: linear-gradient(-135deg,transparent 34px,var(--cf-blue) 0); width: calc(100% - 40px); position: relative; z-index: 1; }
.v2 .clients::before { background: url(https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/images/icon-dots-right.png) left top no-repeat; background-size: cover; content: ''; height: 78px; width: 78px; position: absolute; bottom: 3rem; right: -23px; }
.v2 .clients .burrito { position: relative; }
.v2 .clients blockquote { margin: 0; padding: 0 3rem 0 1.5rem; }
.v2 .clients blockquote::before { background: url(https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/images/icon-quote.png) left top no-repeat; background-size: cover; content: ''; height: 95px; width: 118px; position: absolute; top: -10px; left: -23px; z-index: 1; }
.v2 .clients blockquote p { position: relative; z-index: 2; color: #fff; font: 600 1.65rem/1.25 'Manrope', sans-serif; }
.v2 .clients blockquote p strong { color: var(--cf-red); font-weight: 600; }
.v2 .clients blockquote footer.person { padding: 0; background: transparent; max-width: 300px; display: grid; grid-template-columns: 50px 1fr; column-gap: 15px; align-items: center; }
.v2 .clients blockquote footer.person > img { display: block; width: 100%; height: auto; }
.v2 .clients blockquote footer.person p { font: 400 1rem/1.25 'IBM Plex Sans', sans-serif; margin: 0; }
.v2 .clients blockquote footer.person .ppl-data img { display: block; max-height: 50px; width: auto; padding: 15px 0 0; }

.v2 .clients.opp { background: linear-gradient(135deg,transparent 34px,var(--cf-blue) 0); margin: 0 0 0 40px; }
.v2 .clients.opp::before { background: url(https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/images/icon-dots-bottom.png) left top no-repeat; background-size: cover; content: ''; height: 78px; width: 78px; position: absolute; bottom: -23px; right: 40px; }
.v2 .clients.opp blockquote { padding: 0 1.5rem 0 2rem; }
.v2 .clients.opp blockquote::before { left: calc(2rem - 45px); }

@media only screen and (min-width: 1170px) {
	.v2 .clients::before { height: 150px; width: 150px; bottom: 3rem; right: -45px; }
	.v2 .clients.opp::before { height: 150px; width: 150px; bottom: -45px; left: 45px; }
}

@media only screen and (min-width: 767px) {
	.v2 .clients { width: calc(100% - 80px); }
	.v2 .clients::before { height: 110px; width: 110px; bottom: 3rem; right: -32px; }
	.v2 .clients blockquote { padding: 0 7rem 0 1rem; }
	.v2 .clients blockquote footer.person p { font-size: .75rem; }
	.v2 .clients.opp { margin: 0 0 0 80px; }
	.v2 .clients.opp::before { height: 110px; width: 110px; bottom: -32px; left: 45px; }
	.v2 .clients.opp blockquote { padding: 0 0 0 8rem; }
	.v2 .clients.opp blockquote::before { left: calc(8rem - 30px); }
}
/*=== shared "product" ===*/
.v2 .product { background: #f3f3f3; padding: 8rem 0; margin: -4rem 0; }
.v2 .product.no-overlay { margin: 0 0 -4rem; padding: 3rem 0 6rem; }
.v2 .product.decal { background: #fff; background-image: none; padding: 4rem 0 0; margin: 0; }
.v2 .product.decal .media { grid-area: media; background: url(https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/images/bg-decal.png) left bottom no-repeat; background-size: 60%; padding: 0 5% 3rem; margin: 0 -5%; }
.v2 .product.decal .media img { display: block; width: 100%; }
.v2 .product.decal .content { grid-area: content; padding: 0 0 2rem; }
.v2 .product h3.caption { color: var(--cf-red); font: bold 1rem/1 'IBM Plex Sans', sans-serif; letter-spacing: 0; text-transform: uppercase; padding: 0 0 .75rem; }
.v2 .product h2 { color: var(--cf-blue); }
.v2 .product p { color: var(--cf-copy); }
.v2 .product p + p { padding: 1rem 0 0; }
.v2 .product .cta-btn:hover { background: var(--cf-blue); color: #fff; }
.v2 .product .mobile-only { display: block; margin: 0 auto; width: 80%; padding: 2rem 0; }
.v2 .product .desktop-only { display: none; }

.v2 .product .more-brands { padding: 3rem 0 0; text-align: center; display: block; position: relative; width: 100%; vertical-align: top; }
.v2 .product .more-brands li { display: inline-block; margin: 2px -1px 2px 2px; height: 86px; width: calc(33% - 6px); vertical-align: middle; border: 1px solid #7e8998; }
.v2 .product .more-brands li img { display: block;  position: relative; top: 50%; transform: translateY(-50%) scale(.65); text-align: center; margin: 0 auto; width: 100%; max-height: 50%; }

@media only screen and (min-width: 767px) {
	.v2 .product { padding: 10rem 0; margin: -6rem 0; }
	.v2 .product.no-overlay { margin: 0 0 -6rem; padding: 4rem 0 9rem; }
	.v2 .product.decal { background: url(https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/images/bg-decal.png) left bottom no-repeat; background-size: 30%; padding: 5rem 0 0; }
	.v2 .product.decal .media { background-image: none; margin: 0; padding: 0 0 4rem; }
	.v2 .product .split { column-gap: 60px; align-items: center; grid-template-areas: 'media content'; }
	.v2 .product h3.caption { font-size: .75rem; }
	.v2 .product .desktop-only { display: block; margin: 0 auto; width: 100%; }
	.v2 .product .mobile-only { display: none; }
	.v2 .product .full { padding: 1rem 0 0; }
  .v2 .product .more-brands li { margin: 5px 1px 5px 5px; width: calc(25% - 12px); }
	.v2 .product .more-brands li img { transform: translateY(-50%) scale(.85); width: auto; height: auto; }
	.v2 .product .more-brands li:nth-child(3) img { transform: translateY(-50%) scale(1) }
	.v2 .product .more-brands li:nth-child(4) img { transform: translateY(-50%) scale(1.2) }
}

@media only screen and (min-width: 970px) {
	.v2 .product .more-brands li { width: calc(20% - 12px); }
}

/*=== resources ===*/
.v2 .resources { padding: 0; }
.v2 .resources .card { position: relative; transition: transform .15s ease-in; padding: 3rem; }
.v2 .resources .card:hover { transform: scale(1.02); cursor: pointer; }
.v2 .resources .card::after { content: ''; position: absolute; width: 0; height: 0; border-top: 24px solid transparent; border-right: 24px solid #fff; border-bottom: 24px solid #fff; border-left: 24px solid transparent; right: -1px; bottom: -1px; }
.v2 .resources .card.maq { background: url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/25ws/maq-card-2024.webp') left top no-repeat; background-size: cover; }
.v2 .resources .card.matrix { background: url(https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/images/bg-matrix.jpg) left top no-repeat; background-size: cover; }
.v2 .resources .card + .card { margin: 1.5rem 0 0; }
.v2 .resources .card h3 { font-size: 1.65rem; letter-spacing: 0; }
.v2 .resources .card p + p { padding: 1rem 0 0; }
.v2 .resources .card.matrix a.cta-btn { background: #fff; color: var(--cf-red); }
.v2 .resources .card.matrix a.cta-btn:hover { color: #fff; background: var(--cf-blue); }

@media only screen and (min-width: 767px) {
	.v2 .resources .card { padding: 3rem; }
	.v2 .resources .card + .card { margin: 0; }
}
/*=== case studies ===*/
.v2 .case-studies { position: relative; overflow: hidden; }
.v2 .case-studies .burrito { text-align: center; padding: 3rem 3rem 0; }
.v2 .case-studies h2 { padding: 0 0 1.5rem; color: var(--cf-blue); letter-spacing: -1px; }
.v2 .case-studies blockquote { margin: 0; padding: 0 0 1.5rem; }
.v2 .case-studies blockquote p { font: 800 1rem/1.3 'Manrope', sans-serif; color: var(--cf-blue); }
.v2 .case-studies blockquote footer { background: transparent; padding: 0; }
.v2 .case-studies blockquote img { display: block; max-height: 28px; width: auto; margin: 2rem auto 2rem; }
.v2 .case-studies blockquote a.cta-btn:hover { background: var(--cf-blue); color: #fff; }

/*=== footer ===*/
footer { padding: 0 0 3rem; background: #121212; overflow-x: hidden; position: relative; }

footer .trial { background: radial-gradient( farthest-corner at 50% 90%, rgba(70,17,66,1) 0%, rgba(21,13,69,1) 65% ); position: relative; overflow: hidden; padding: 3rem 0; }
footer .trial::after { width: 600px; height: 600px; content:''; background-image: url(https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/raw_assets/public/confiant22/images/hex-decal.png); background-repeat: no-repeat; background-size: 100% auto; position: absolute; bottom: -240px; transform: rotate(180deg) translateX(-30%); z-index: 1; opacity: .7; }
footer .trial h1 { font-size: 1.65rem; line-height: 1.25; text-align: center; position: relative; z-index: 3; }
footer .trial h1 + p { margin: 1rem 0 0; text-align: center; position: relative; z-index: 3; }

.v2 footer .contact { padding: 3rem 0 0; }
.v2 footer .contact h2 { font-size: 1rem; }
.v2 footer .contact p { margin: 0; }
.v2 footer .contact h2 + p { padding: 1.5rem 0 1rem; }
.v2 footer .contact h2 + p + p { background: rgba(255,255,255,0.1); padding: 1.25rem 3rem .25rem 3rem; margin: 0 -3rem 0 -3rem; line-height: 1.4; }
.v2 footer form { background: rgba(255,255,255, .1); padding: .25rem 3rem 1.5rem 3rem; position: relative; margin: 0 -3rem 1rem -3rem; }
.v2 footer form input[type='email'] { background: transparent; border: 1px solid var(--cf-red); padding: 7px; width: 100%; color: #fff; font-size: 20px; line-height: 1; }
.v2 footer form input[type='email']::placeholder { color: rgba(255,255,255,.8); }
.v2 footer form input[type='submit'] { font: 800 .75rem/1 'Manrope', sans-serif; background: var(--cf-red); color: #fff; text-align: center; padding: 12px 24px 14px; text-decoration: none; transition: all .2s ease-in; border-radius: 4px; border: 0; margin: 1.5rem 0 0; }
.v2 footer form input[type='submit']:hover { background: #fff; color: var(--cf-red); }
.v2 footer #hs_form_target_global-footer_ .hs-recaptcha { display: none !important; }
/* HS error messages for footer form */
.v2 footer ul.hs-error-msgs li label,
.v2 footer .legal-consent-container ul.hs-error-msgs li label { padding: 5px 10px; color: #fff; background: #f00; display: inline-block; margin: 5px 0; font-size: .55rem; line-height: 1.2; }
.v2 footer .legal-consent-container { padding: 1rem 0 0; }
.v2 footer .legal-consent-container p { font-size: 12px; line-height: 1.4; color: #aaa; font-weight: 300; padding: .5rem 0 0; } 
.v2 footer .legal-consent-container p a,
.v2 footer .legal-consent-container p a:hover { color: #ef1e4a; font-weight: bold; }
.v2 footer .legal-consent-container .hs-form-booleancheckbox-display > span { margin-left: 25px; }
.v2 footer .legal-consent-container .hs-form-booleancheckbox-display > span p { margin-left: 0 !important; }
.v2 footer .legal-consent-container .hs-form-booleancheckbox-display > span p a { color: #ef1e4a; font-weight: 400; }
.v2 footer .legal-consent-container ul li label { font-size: 12px; line-height: 1.4px; color: #aaa; }
.v2 footer .legal-consent-container .hs-form-booleancheckbox-display input[type='checkbox'] { margin: 2px 0 0 !important; }
/* end HS error messages for footer form */
.v2 footer .submitted-message p { padding: 1.25rem 3rem; margin: 0 -3rem .5rem -3rem; background: rgba(255,255,255,0.05); line-height: 1.4; }

.v2 footer .sm-connect { text-align: center; margin: 0 auto; padding: 0 0 1rem; }
.v2 .sm-connect li { display: inline-block; margin: 0 -4px 0 0; padding: 0 15px 0 0; }
.v2 .sm-connect li a { display: block; }
.v2 .sm-connect li img { max-width: 24px; height: auto; }
.v2 .sm-connect li:nth-child(2) img { margin-top: -5px; }
.v2 footer .card { padding: 3rem 1.5rem 1.5rem; }
.v2 footer .card h3 { color: rgba(255,255,255,.6); letter-spacing: 0; }
.v2 footer .card ul { padding: 1rem 0 1.5rem; }
.v2 footer .card ul li { margin: 0 0 .25rem; }
.v2 footer .card ul li a { font-weight: 400; transition: .3s all ease-in; color: #fff; }
.v2 footer .card ul li a:hover { font-weight: bold; color: var(--cf-red); }
.v2 footer .f-split { display: grid; grid-template-columns: 1fr 1fr; }
.v2 footer .awards { border-top: 1px solid #333; padding: 1rem 0 0; }
.v2 footer .awards p { text-align: center; text-transform: uppercase; color: #fff; margin: 0 0 .5rem; }
.v2 footer .awards ul { text-align: center; vertical-align: middle; }
.v2 footer .awards li { display: inline-block; vertical-align: middle; margin: 0 -4px 0 0; padding: 0 5px 15px 6px; }
.v2 footer .awards li img { display: block; max-height: 80px; width: auto; opacity: .7; }

@media only screen and (min-width: 767px) {
  .v2 footer { font-size: .8rem; }
  .v2 footer .contact h2 + p + p { padding: 1.25rem 2rem .25rem 60rem; margin: 0 0 0 -60rem; }
  .v2 footer .submitted-message p { margin: 0 0 .5rem -60rem; padding: 1.25rem 2rem 2rem 60rem; }
  .v2 footer form { padding: .25rem 2rem 1.5rem 60rem; margin: 0 0 .5rem -60rem; }
  .v2 footer .legal-consent-container { width: 80%; }
  /*.v2 footer .sm-connect { text-align: right; margin: 0 auto 0 0; padding: 0 0 3rem; }
  .v2 footer .sm-connect li { padding: 0 5px 0 10px; }*/
  .v2 footer .sm-connect { text-align: left; margin: 0 0 0 auto; padding: 0 0 3rem; } /* temporary */
  .v2 footer .sm-connect li { padding: 0 15px 0 0; } /* temporary */
	.one-three,
  .one-three-skew,
  .two-three,
	.three-three,
	.split,
  .split-wide,
  .split-mini,
  .readjust { display: grid; }
	.one-three { grid-template-columns: 33% 1fr; column-gap: 80px; }
  .one-three-skew { grid-template-columns: 35% 1fr; column-gap: 80px; }
  .two-three { grid-template-columns: 60% 1fr; column-gap: 80px; }
	.three-three { grid-template-columns: 1fr 1fr 1fr; column-gap: 80px; }
	.split { grid-template-columns: 1fr 1fr; column-gap: 20px; }
  .split-wide { grid-template-columns: 1fr 1fr; column-gap: 80px; }
  .split-mini { grid-template-columns: 1fr 1fr; column-gap: 15px; }
  .readjust { grid-template-columns: 1fr 40%; column-gap: 3rem; }
}

/*=== modal; eff this ===*/
#request-trial { display: none; position: fixed; width: 100vw; height: 100vh; background: rgba(0,0,0,.8); top: 0; left: 0; z-index: 9999; overflow-y: auto; }
#request-trial .boo { display: block; position: relative; z-index: 10000; width: 90%; height: auto; background: linear-gradient(180deg,rgba(21,13,69,1) 0%,rgba(35,19,70,1) 100%); box-shadow: -5px 5px 200px rgb(239 30 74 / 45%), 5px -5px 200px rgb(103 72 255 / 45%); top: 5%; left: 5%; overflow-y: auto; margin-bottom: 200px; }
#request-trial .m-content { padding: 2.5rem 1.5rem 1.25rem; }
#request-trial .m-form { padding: 2rem 1.25rem 2rem; background: #fff; }
#request-trial .close { position: absolute; top: 10px; right: 20px; }
#request-trial .close button { background: transparent; color: rgba(239,30,74,1); font-weight: 800; font-size: 2rem; line-height: 1; padding: 0; border-radius: 0; border: 0; transition: all .3s ease-in-out; }
#request-trial .close button:hover { background: transparent; color: #f00; }

.m-content h3 { font-size: 1.65rem; line-height: 1.25; margin: 0; padding: 0 0 .5rem; letter-spacing: 0; }
.m-content p { color: #fff; font-size: .85rem; line-height: 1.6; margin: 0; }
.m-content p em { color: #ef1e4a; font-style: normal; font-weight: 600; }
.m-content ul,
.m-content li { padding: 0; margin: 0; list-style: none; }
.m-content ul { padding: 2rem 0 1rem; width: 100%; }
.m-content li { display: inline-block; margin: 0 -4px 0 0; max-width: 25%; }
.m-content li img { display: block; width: 100%; height: auto; }

.m-form form { padding: 0; }
.m-form label { display: block; text-transform: uppercase; font-size: 75%; line-height: 1; color: #666; padding: 0 0 5px; }
.m-form input[type='text'],
.m-form input[type='email'],
.m-form input[type='tel'],
.m-form select { display: block; padding: 8px 10px; color: #666; border: 1px solid #666; width: 100% !important; background: transparent; font: 400 0.75rem/1 'IBM Plex Sans', sans-serif; border-radius: 0; }
.m-form .hs-form-field { padding: 0 0 .75rem; margin: 0; }
.m-form .actions { margin: 1.5rem auto 0 0; text-align: center; }
.m-form input[type='submit'] { font-size: 0.85rem; line-height: 1; font-weight: 800; font-family: 'Manrope', sans-serif; font-style: normal; background: rgb(239,30,74,1); color: #fff; padding: 18px 36px 19px; border: 0; transition: all .3s ease-in-out; cursor: pointer; border-radius: 4px; }
.m-form form input[type='submit']:hover { background: var(--cf-blue); color: #fff; }
.m-form form input:focus { outline: none; }
.m-form fieldset { max-width: 100% !important; }
.m-form fieldset.form-columns-1 .input { margin: 0 !important; padding: 0; }
.m-form fieldset.form-columns-1 .input li.hs-form-radio { display: inline-block; padding: 0 25px 0 0; }
.m-form fieldset.form-columns-1 .input li.hs-form-radio label span { display: inline-block; font-size: 130%; padding: 0 0 0 5px; margin: 3px 0 0; line-height: 1; vertical-align: top; }
.m-form form fieldset.form-columns-2 .input { margin-right: 0 !important; }
.m-form form .form-columns-2 .hs-firstname.hs-form-field { padding: 0 4px 1rem 0; }
.m-form form .form-columns-2 .hs-lastname.hs-form-field { padding: 0 0 1rem 4px; }

.m-form ul.hs-error-msgs li,
.m-form .legal-consent-container ul li { background: none; padding: 0; margin: 0; }
.m-form .legal-consent-container ul li label { text-transform: none; }
.m-form ul.hs-error-msgs li label,
.m-form .legal-consent-container ul.hs-error-msgs li label { text-transform: none; padding: 5px 10px; color: #fff; background: #f00; display: inline-block; margin: 5px 0; font-size: .55rem; line-height: 1.2; }
.m-form form .inputs-list { line-height: 1; }

.m-form .legal-consent-container p { font-size: 12px; line-height: 1.4; color: #aaa; font-weight: 300; padding: .5rem 0 0; } 
.m-form .legal-consent-container p a,
.m-form .legal-consent-container p a:hover { color: #ef1e4a; font-weight: bold; }
.m-form .legal-consent-container .hs-form-booleancheckbox-display > span { margin-left: 20px; }
.m-form .legal-consent-container .hs-form-booleancheckbox-display > span p { margin-left: 0 !important; }
.m-form .legal-consent-container .hs-form-booleancheckbox-display > span p a { color: #ef1e4a; font-weight: 400; }

.m-form .legal-consent-container ul li label { font-size: 12px; line-height: 1.4px; color: #aaa; }
.m-form .legal-consent-container .hs-form-booleancheckbox-display input[type='checkbox'] { margin: 2px 0 0 !important; }
.m-form form .legal-consent-container .hs-form-field { padding: 0; }
.m-form form .hs-richtext { margin: 0 0 .5rem; }
.m-form form .hs-richtext p { margin: 0; }

.m-form #hs_form_target_rat-modal_.submitted-message { display: block; text-align: left; color: #fff; font-size: .75rem; line-height: 1.3; padding: 1rem; background: #6748ff; } 
.m-form #hs_form_target_global-trial-modal_ .submitted-message p { color: #222; line-height: 1.6; }

@media screen and (min-width: 900px) {
  #request-trial .boo { position: relative; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 870px; overflow: hidden; margin-bottom: 0; }
  #request-trial .boo::before { content: ''; position: absolute; bottom: 0; left: 0; background: url('https://5994026.fs1.hubspotusercontent-na1.net/hubfs/5994026/22/confiant-logo-mark-blend.png') -70px 70px no-repeat; width: 400px; height: 400px; background-size: 400px auto; opacity: .6; z-index: -1; }
  #request-trial .boo .wrap { display: grid; grid-template-columns: 55% 1fr; align-items: center; }
  #request-trial .m-content { padding: 2rem 1.5rem 2rem 1.75rem; }
  #request-trial .m-form { padding: 3rem 1.5rem; height: 100%; }
  .m-content blockquote { padding: 0 30px; }
}

@keyframes ogFade {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes datFade {
  0% { opacity: 0; transform: translateY(-30px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes rightFade {
  0% { opacity: 0; transform: translateX(30px); }
  100% { opacity: 1; transform: translateX(0); }
}

@keyframes slowmo {
	0% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}