html {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
}
body {
margin: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
display: block;
}
audio, canvas, progress, video {
vertical-align: baseline;
display: inline-block;
}
audio:not([controls]) {
height: 0;
display: none;
}
[hidden], template {
display: none;
}
a {
background-color: #0000;
}
a:active, a:hover {
outline: 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b, strong {
font-weight: bold;
}
dfn {
font-style: italic;
}
h1 {
margin: .67em 0;
font-size: 2em;
}
mark {
color: #000;
background: #ff0;
}
small {
font-size: 80%;
}
sub, sup {
vertical-align: baseline;
font-size: 75%;
line-height: 0;
position: relative;
}
sup {
top: -.5em;
}
sub {
bottom: -.25em;
}
img {
border: 0;
}
svg:not(:root) {
overflow: hidden;
}
hr {
box-sizing: content-box;
height: 0;
}
pre {
overflow: auto;
}
code, kbd, pre, samp {
font-family: monospace;
font-size: 1em;
}
button, input, optgroup, select, textarea {
color: inherit;
font: inherit;
margin: 0;
}
button {
overflow: visible;
}
button, select {
text-transform: none;
}
button, html input[type="button"], input[type="reset"] {
-webkit-appearance: button;
cursor: pointer;
}
button[disabled], html input[disabled] {
cursor: default;
}
button::-moz-focus-inner, input::-moz-focus-inner {
border: 0;
padding: 0;
}
input {
line-height: normal;
}
input[type="checkbox"], input[type="radio"] {
box-sizing: border-box;
padding: 0;
}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
input[type="search"] {
-webkit-appearance: none;
}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
legend {
border: 0;
padding: 0;
}
textarea {
overflow: auto;
}
optgroup {
font-weight: bold;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td, th {
padding: 0;
}
* {
box-sizing: border-box;
}
html {
height: 100%;
}
body {
color: #e7e2e2;
background-color: #fff;
min-height: 100%;
margin: 0;
font-family: Arial, sans-serif;
font-size: 14px;
line-height: 20px;
}
html.preloader-active,
html.preloader-active body {
overflow: hidden;
}
html.preloader-active .page-wrapper {
visibility: hidden;
}
.site-preloader {
display: none;
}
html.preloader-active .site-preloader {
position: fixed;
z-index: 20000;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
padding: 1.5rem;
background: #fff;
opacity: 1;
transition: opacity 350ms ease;
}
.site-preloader-content {
display: flex;
width: min(100%, 30rem);
flex-direction: column;
align-items: center;
gap: 1.5rem;
}
.site-preloader-image {
display: block;
width: min(100%, 7rem);
max-height: 7rem;
object-fit: contain;
}
.site-preloader-progress {
width: min(72%, 18rem);
height: 0.3rem;
overflow: hidden;
border: 1px solid rgba(255, 255, 255, 0.32);
border-radius: 999px;
background: #e5e7eb;
}
.site-preloader-progress-bar {
display: block;
width: 0;
height: 100%;
border-radius: inherit;
background: #00a8ff;
box-shadow: 0 0 10px rgba(0, 168, 255, 0.35);
transition: width 120ms linear;
}
html.preloader-finished .site-preloader {
opacity: 0;
}
@media (prefers-reduced-motion: reduce) {
html.preloader-active .site-preloader,
.site-preloader-progress-bar {
transition: none;
}
}
img {
vertical-align: middle;
max-width: 100%;
display: inline-block;
}
html.w-mod-touch * {
background-attachment: scroll !important;
}
.w-block {
display: block;
}
.w-inline-block {
max-width: 100%;
display: inline-block;
}
.w-clearfix:before, .w-clearfix:after {
content: " ";
grid-area: 1 / 1 / 2 / 2;
display: table;
}
.w-clearfix:after {
clear: both;
}
.w-hidden {
display: none;
}
.w-button {
color: #fff;
line-height: inherit;
cursor: pointer;
background-color: #3898ec;
border: 0;
border-radius: 0;
padding: 9px 15px;
text-decoration: none;
display: inline-block;
}
input.w-button {
-webkit-appearance: button;
}
html[data-w-dynpage] [data-w-cloak] {
color: #0000 !important;
}
.w-code-block {
margin: unset;
}
pre.w-code-block code {
all: inherit;
}
pre.w-code-block code > span {
display: block !important;
}
.w-optimization {
display: contents;
}
h1, h2, h3, h4, h5, h6 {
margin-bottom: 10px;
font-weight: bold;
}
h1 {
margin-top: 20px;
font-size: 38px;
line-height: 44px;
}
h2 {
margin-top: 20px;
font-size: 32px;
line-height: 36px;
}
h3 {
margin-top: 20px;
font-size: 24px;
line-height: 30px;
}
h4 {
margin-top: 10px;
font-size: 18px;
line-height: 24px;
}
h5 {
margin-top: 10px;
font-size: 14px;
line-height: 20px;
}
h6 {
margin-top: 10px;
font-size: 12px;
line-height: 18px;
}
p {
margin-top: 0;
margin-bottom: 10px;
}
blockquote {
border-left: 5px solid #e2e2e2;
margin: 0 0 10px;
padding: 10px 20px;
font-size: 18px;
line-height: 22px;
}
figure {
margin: 0 0 10px;
}
ul, ol {
margin-top: 0;
margin-bottom: 10px;
padding-left: 40px;
}
.w-list-unstyled {
padding-left: 0;
list-style: none;
}
:root {
--scheme--background:#141925;
--_type--fonts---font-styles--body: Manrope, Arial, sans-serif;
--scheme--text: var(--_color--primitives---colors--white);
--_type--sizes---regular: 1rem;
--_type--fonts---line-height--large: 140%;
--_type--fonts---font-weight--normal: 400;
--_type--fonts---font-styles--heading: Manrope, Arial, sans-serif;
--_type--heading---display-text--h1: 2.4rem;
--_type--fonts---line-height--medium: 125%;
--_type--heading---weight: var(--_type--fonts---font-weight--medium);
--_type--heading---display-text--h2: 1.875rem;
--_type--heading---display-text--h3: 1.35rem;
--_type--heading---display-text--display-4\: calc(var(--_type--heading---display-text--display-5\) * var(--_type--heading---text-scale\));
--_type--heading---display-text--display-5\: calc(var(--_type--heading---display-text--display-6\) * var(--_type--heading---text-scale\));
--_type--heading---display-text--display-6\: calc(16px * var(--_type--heading---text-scale\));
--scheme--text-subtle: #ffffffa6;
--_layout--scale---xsmall: 1rem;
--_layout--scale---none: 0rem;
--_layout--scale---small: 1.25rem;
--_type--sizes---xl\: 1.25rem;
--_type--fonts---line-height--xlarge: 150%;
--_color--primitives---opacity--transparent: transparent;
--_type--fonts---line-height--small: 110%;
--_type--sizes---xs: .75rem;
--_layout--scale---xxsmall: .75rem;
--_styling--button---border--color: var(--_color--primitives---colors--white);
--_styling--button---radius: 999px;
--_styling--button---background--color: var(--_color--primitives---colors--white);
--_styling--button---text--color: var(--_color--primitives---colors--neutral-400);
--_styling--button---border--hover: var(--_color--primitives---colors--white);
--_styling--button---background--hover: var(--_color--primitives---opacity--transparent);
--_styling--button---text--hover: var(--_color--primitives---colors--white);
--_styling--border---radius--medium: .5rem;
--_styling--border---stroke--border-width: 1px;
--scheme--border: var(--_color--primitives---colors--white-10);
--_color--primitives---colors--white-10: #ffffff1a;
--_color--primitives---colors--white-20: #fff3;
--_color--primitives---colors--neutral-400: #0f1010;
--_type--sizes---s: .875rem;
--_color--primitives---colors--green-light: #2895f7;
--_type--heading---rich-text--h1: 2.25rem;
--_type--fonts---font-weight--medium: 500;
--scheme--foreground: var(--_color--primitives---colors--neutral-300);
--_type--heading---rich-text--h2: 2rem;
--_type--heading---rich-text--h3: 1.75rem;
--_type--heading---rich-text--h4: 1.5rem;
--_type--heading---rich-text--h5: 1.25rem;
--_type--heading---rich-text--h6: 1rem;
--scheme--text-very-subtle\: var(--_color--primitives---colors--neutral-200);
--_layout--sizes---padding--global: var(--_layout--scale---small);
--_color--primitives---colors--green-dark: #33c18b0f;
--_color--primitives---colors--red-light: #c23232;
--_color--primitives---colors--red-dark: #c928280f;
--_color--primitives---opacity--dark-60: rgb(from var(--_color--primitives---opacity--dark-base) r g b / .6);
--_type--sizes---mobile-link: 2.5rem;
--_layout--sizes---gap--xsmall: .25rem;
--_layout--sizes---gap--small: 1rem;
--_color--primitives---colors--neutral-300: #191a1a;
--_type--fonts---font-weight--light: 300;
--_color--primitives---colors--neutral-100: #3f3f3f;
--_color--primitives---colors--neutral-200: #1e1d1e;
--_styling--border---radius--pill: 999px;
--_color--primitives---colors--white: #fff;
--_type--fonts---line-height--xsmall: 100%;
--_layout--scale---tiny: .5rem;
--_layout--scale---xtiny: .25rem;
--_color--primitives---colors--orange: #df6d45;
--_layout--sizes---blocks--xxsmall: 20rem;
--_type--sizes---xxs: .625rem;
--_layout--sizes---blocks--xsmall: 25rem;
--_layout--sizes---blocks--small: 30rem;
--_layout--sizes---blocks--medium: 35rem;
--_layout--sizes---blocks--large: 48rem;
--_layout--scale---medium: 1.5rem;
--_layout--scale---large: 2rem;
--_layout--sizes---blocks--xlarge: 64rem;
--_layout--scale---xlarge: 3rem;
--_layout--sizes---blocks--xxlarge: 80rem;
--_layout--scale---xxlarge: 4rem;
--_layout--sizes---padding--small: var(--_layout--scale---large);
--_layout--sizes---padding--medium: var(--_layout--scale---xxlarge);
--_layout--scale---huge: 6rem;
--_layout--scale---xhuge: 7rem;
--_layout--sizes---padding--large: var(--_layout--scale---xhuge);
--_layout--scale---xxhuge: 10rem;
--_layout--sizes---gap--medium: 2.5rem;
--_layout--sizes---gap--large: 4rem;
--_layout--sizes---gap--xlarge: 5rem;
--scheme--accent: var(--_color--primitives---colors--neutral-400);
--_color--primitives---colors--neutral-light: #f2ece7;
--_color--primitives---opacity--dark-base: var(--_color--primitives---colors--neutral-400);
--_color--primitives---opacity--light-base: var(--_color--primitives---colors--white-10);
--_color--primitives---opacity--light-5: rgb(from var(--_color--primitives---opacity--light-base) r g b / .05);
--_color--primitives---opacity--light-10: rgb(from var(--_color--primitives---opacity--light-base) r g b / .1);
--_color--primitives---opacity--light-15: rgb(from var(--_color--primitives---opacity--light-base) r g b / .15);
--_color--primitives---opacity--light-20: rgb(from var(--_color--primitives---opacity--light-base) r g b / .2);
--_color--primitives---opacity--light-30: rgb(from var(--_color--primitives---opacity--light-base) r g b / .3);
--_type--fonts---font-weight--extra-light: 200;
--_color--primitives---opacity--light-40: rgb(from var(--_color--primitives---opacity--light-base) r g b / .4);
--_color--primitives---opacity--light-50: rgb(from var(--_color--primitives---opacity--light-base) r g b / .5);
--_color--primitives---opacity--light-60: rgb(from var(--_color--primitives---opacity--light-base) r g b / .6);
--_color--primitives---opacity--dark-5: rgb(from var(--_color--primitives---opacity--dark-base) r g b / .05);
--_type--fonts---font-weight--semibold: 600;
--_color--primitives---opacity--dark-10: rgb(from var(--_color--primitives---opacity--dark-base) r g b / .1);
--_type--fonts---font-weight--bold: 700;
--_color--primitives---opacity--dark-15: rgb(from var(--_color--primitives---opacity--dark-base) r g b / .15);
--_type--fonts---font-weight--extra-bold: 800;
--_color--primitives---opacity--dark-20: rgb(from var(--_color--primitives---opacity--dark-base) r g b / .2);
--_color--primitives---opacity--dark-30: rgb(from var(--_color--primitives---opacity--dark-base) r g b / .3);
--_color--primitives---opacity--dark-40: rgb(from var(--_color--primitives---opacity--dark-base) r g b / .4);
--_color--primitives---opacity--dark-50: rgb(from var(--_color--primitives---opacity--dark-base) r g b / .5);
--_styling--border---radius--large: 2rem;
--_styling--border---radius--small: .25rem;
--_styling--border---stroke--divider-width: 1px;
--_type--heading---text-scale\: 1.19;
}
.w-layout-blockcontainer {
max-width: 940px;
margin-left: auto;
margin-right: auto;
display: block;
}
.w-layout-grid {
grid-row-gap: 16px;
grid-column-gap: 16px;
grid-template-rows: auto auto;
grid-template-columns: 1fr 1fr;
grid-auto-columns: 1fr;
display: grid;
}
@media screen and (max-width: 991px) {
.w-layout-blockcontainer {
max-width: 728px;
}
}
@media screen and (max-width: 767px) {
.w-layout-blockcontainer {
max-width: none;
}
}
body {
background-color: var(--scheme--background);
font-family: var(--_type--fonts---font-styles--body);
color: var(--scheme--text);
font-size: var(--_type--sizes---regular);
line-height: var(--_type--fonts---line-height--large);
font-weight: var(--_type--fonts---font-weight--normal);
}
h1 {
font-family: var(--_type--fonts---font-styles--heading);
font-size: var(--_type--heading---display-text--h1);
line-height: var(--_type--fonts---line-height--medium);
font-weight: var(--_type--heading---weight);
margin-top: 0;
margin-bottom: 0;
}
h2 {
font-family: var(--_type--fonts---font-styles--heading);
font-size: var(--_type--heading---display-text--h2);
line-height: var(--_type--fonts---line-height--medium);
font-weight: var(--_type--heading---weight);
margin-top: 0;
margin-bottom: 0;
}
h3 {
font-family: var(--_type--fonts---font-styles--heading);
font-size: var(--_type--heading---display-text--h3);
line-height: var(--_type--fonts---line-height--medium);
font-weight: var(--_type--heading---weight);
margin-top: 0;
margin-bottom: 0;
}
h4 {
font-family: var(--_type--fonts---font-styles--heading);
font-size: var(--_type--heading---display-text--display-4\);
line-height: var(--_type--fonts---line-height--large);
font-weight: var(--_type--heading---weight);
margin-top: 0;
margin-bottom: 0;
}
h5 {
font-family: var(--_type--fonts---font-styles--heading);
font-size: var(--_type--heading---display-text--display-5\);
line-height: var(--_type--fonts---line-height--large);
font-weight: var(--_type--heading---weight);
margin-top: 0;
margin-bottom: 0;
}
h6 {
font-family: var(--_type--fonts---font-styles--heading);
font-size: var(--_type--heading---display-text--display-6\);
line-height: var(--_type--fonts---line-height--large);
font-weight: var(--_type--heading---weight);
margin-top: 0;
margin-bottom: 0;
}
p {
margin-bottom: 0;
}
a {
color: var(--scheme--text);
text-decoration: none;
}
ul {
margin-bottom: 0;
padding-left: 1.25rem;
}
ol {
margin-bottom: 0;
padding-left: 1.5rem;
}
li {
margin-top: .25rem;
margin-bottom: .25rem;
padding-left: .5rem;
}
img {
max-width: 100%;
display: inline-block;
}
label {
color: var(--scheme--text-subtle);
font-size: var(--_layout--scale---xsmall);
font-weight: var(--_type--fonts---font-weight--normal);
margin-bottom: .25rem;
}
strong {
font-weight: bold;
}
em {
font-style: italic;
}
blockquote {
margin-bottom: var(--_layout--scale---none);
padding: var(--_layout--scale---small);
border-left: .1875rem solid var(--scheme--text);
font-size: var(--_type--sizes---xl\);
line-height: var(--_type--fonts---line-height--xlarge);
}
figure {
margin-top: 3rem;
margin-bottom: 3rem;
}
figcaption {
text-align: center;
margin-top: .25rem;
}
.text-style-link {
color: var(--scheme--text);
text-decoration: underline;
-webkit-text-decoration-color: var(--_color--primitives---opacity--transparent);
text-decoration-color: var(--_color--primitives---opacity--transparent);
transition: text-decoration-color .3s, color .3s;
}
.text-style-link:hover {
color: var(--scheme--text-subtle);
-webkit-text-decoration-color: var(--scheme--text-subtle);
text-decoration-color: var(--scheme--text-subtle);
}
.page-wrapper {
overflow: clip;
}
.align-center {
margin-left: auto;
margin-right: auto;
}
.utility_component {
justify-content: center;
align-items: center;
width: 100vw;
max-width: 100%;
height: 100vh;
max-height: 100%;
padding-left: 1.25rem;
padding-right: 1.25rem;
display: flex;
position: relative;
}
.utility_form-block {
text-align: center;
flex-direction: column;
max-width: 20rem;
display: flex;
}
.utility_form {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-direction: column;
align-items: stretch;
display: flex;
}
.heading-style-h2 {
font-size: var(--_type--heading---display-text--h2);
line-height: var(--_type--fonts---line-height--medium);
font-weight: var(--_type--heading---weight);
}
.heading-style-h2.text-wrap-balance:where(.w-variant-8efdbe3a-0a34-150b-8261-9c4465ebf859), .heading-style-h2.text-wrap-balance:where(.w-variant-033790a2-ca22-a1c4-2e6c-39418bef2bd0) {
text-wrap: balance;
}
.heading-style-h1 {
font-size: var(--_type--heading---display-text--h1);
line-height: var(--_type--fonts---line-height--small);
font-weight: var(--_type--heading---weight);
text-wrap: balance;
width: 100%;
max-width: 2000px;
margin-left: auto;
margin-right: auto;
}
.text-size-xsmall {
font-size: var(--_type--sizes---xs);
line-height: var(--_type--fonts---line-height--large);
}
.button {
padding: var(--_layout--scale---xxsmall) 12px var(--_layout--scale---xxsmall) .75rem;
border: 1px solid var(--_styling--button---border--color);
border-radius: var(--_styling--button---radius);
background-color: var(--_styling--button---background--color);
color: var(--_styling--button---text--color);
text-align: center;
justify-content: center;
align-items: center;
text-decoration: none;
transition: background-color .3s, color .3s, border-color .3s;
display: flex;
}
.button:where(.w-variant-7e0ededc-0c49-f509-208b-07424a09d459) {
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
--_styling--button---border--color: var(--_color--primitives---opacity--transparent);
--_styling--button---radius: 999px;
--_styling--button---background--color: var(--_color--primitives---colors--white-10);
--_styling--button---text--color: var(--_color--primitives---colors--white);
--_styling--button---border--hover: var(--_color--primitives---opacity--transparent);
--_styling--button---background--hover: var(--_color--primitives---colors--white-20);
--_styling--button---text--hover: var(--_color--primitives---colors--white);
}
.button:where(.w-variant-8f2bc1ab-e8e4-b850-837a-7b654d4316db) {
--_styling--button---border--color: var(--_color--primitives---colors--green-light);
--_styling--button---radius: 999px;
--_styling--button---background--color: var(--_color--primitives---colors--green-dark);
--_styling--button---text--color: var(--_color--primitives---colors--green-light);
--_styling--button---border--hover: var(--_color--primitives---colors--green-light);
--_styling--button---background--hover: var(--_color--primitives---colors--green-light);
--_styling--button---text--hover: var(--_color--primitives---colors--white);
}
.button:hover {
border-color: var(--_styling--button---border--hover);
background-color: var(--_styling--button---background--hover);
color: var(--_styling--button---text--hover);
}
.button.is-form {
border-radius: var(--_styling--border---radius--medium);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
--_styling--button---border--color: var(--_color--primitives---opacity--transparent);
--_styling--button---radius: 999px;
--_styling--button---background--color: var(--_color--primitives---colors--white-10);
--_styling--button---text--color: var(--_color--primitives---colors--white);
--_styling--button---border--hover: var(--_color--primitives---opacity--transparent);
--_styling--button---background--hover: var(--_color--primitives---colors--white-20);
--_styling--button---text--hover: var(--_color--primitives---colors--white);
width: 100%;
}
.heading-style-h3 {
font-size: var(--_type--heading---display-text--h3);
line-height: var(--_type--fonts---line-height--medium);
font-weight: var(--_type--heading---weight);
}
.form_input {
border: var(--_styling--border---stroke--border-width) solid var(--scheme--border);
background-color: var(--_color--primitives---colors--white-10);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
height: 46px;
color: var(--scheme--text);
border-radius: 8px;
margin-bottom: 0;
padding: 12px;
font-size: 1rem;
line-height: 1.6;
transition: background-color .3s, border-color .3s;
}
.form_input:hover {
border-color: var(--_color--primitives---colors--white-20);
background-color: var(--_color--primitives---colors--white-20);
}
.form_input:focus {
border-color: var(--_color--primitives---colors--neutral-400);
}
.form_input::placeholder {
color: var(--scheme--text-subtle);
}
.form_input.is-text-area {
height: auto;
min-height: 11.25rem;
padding-top: var(--_layout--scale---xsmall);
padding-bottom: var(--_layout--scale---xsmall);
overflow: auto;
}
.button-group {
grid-column-gap: var(--_layout--scale---xsmall);
grid-row-gap: var(--_layout--scale---xsmall);
flex-wrap: wrap;
align-items: center;
display: flex;
}
.button-group.is-center {
justify-content: center;
align-items: center;
}
.text-align-center {
text-align: center;
}
.text-size-small {
font-size: var(--_type--sizes---s);
}
.text-size-small.text-color-subtle.is-darker {
opacity: .5;
}
.text-size-small.text-color-subtle.is-green {
color: var(--_color--primitives---colors--green-light);
}
.text-size-small.opacity-50 {
opacity: .5;
}
.text-rich-text {
grid-column-gap: var(--_layout--scale---xsmall);
grid-row-gap: var(--_layout--scale---xsmall);
flex-flow: column;
display: flex;
}
.text-rich-text h1 {
font-family: var(--_type--fonts---font-styles--heading);
color: var(--scheme--text);
font-size: var(--_type--heading---rich-text--h1);
line-height: var(--_type--fonts---line-height--small);
font-weight: var(--_type--fonts---font-weight--medium);
}
.text-rich-text blockquote {
padding: var(--_layout--scale---small);
border: 1px solid var(--scheme--border);
border-radius: var(--_styling--border---radius--medium);
background-color: var(--scheme--foreground);
font-size: 1.25rem;
font-style: italic;
}
.text-rich-text h2 {
font-family: var(--_type--fonts---font-styles--heading);
color: var(--scheme--text);
font-size: var(--_type--heading---rich-text--h2);
line-height: var(--_type--fonts---line-height--small);
font-weight: var(--_type--fonts---font-weight--medium);
}
.text-rich-text h3 {
font-family: var(--_type--fonts---font-styles--heading);
color: var(--scheme--text);
font-size: var(--_type--heading---rich-text--h3);
line-height: var(--_type--fonts---line-height--medium);
font-weight: var(--_type--fonts---font-weight--medium);
}
.text-rich-text h4 {
font-family: var(--_type--fonts---font-styles--heading);
color: var(--scheme--text);
font-size: var(--_type--heading---rich-text--h4);
line-height: var(--_type--fonts---line-height--medium);
font-weight: var(--_type--fonts---font-weight--medium);
}
.text-rich-text h5 {
font-family: var(--_type--fonts---font-styles--heading);
color: var(--scheme--text);
font-size: var(--_type--heading---rich-text--h5);
line-height: var(--_type--fonts---line-height--large);
font-weight: var(--_type--fonts---font-weight--medium);
}
.text-rich-text h6 {
font-family: var(--_type--fonts---font-styles--heading);
color: var(--scheme--text);
font-size: var(--_type--heading---rich-text--h6);
line-height: var(--_type--fonts---line-height--large);
font-weight: var(--_type--fonts---font-weight--medium);
}
.text-rich-text p {
color: var(--scheme--text-subtle);
}
.text-rich-text a {
text-decoration: underline;
transition: color .3s;
}
.text-rich-text a:hover {
color: var(--scheme--text-very-subtle\);
}
.text-rich-text figcaption {
margin-top: var(--_layout--scale---xxsmall);
padding-left: var(--_layout--scale---xxsmall);
border-left: var(--_styling--border---stroke--border-width) solid var(--scheme--text);
font-size: var(--_type--sizes---s);
text-align: left;
}
.text-rich-text img {
border-radius: var(--_styling--border---radius--medium);
}
.text-rich-text ul, .text-rich-text ol {
color: var(--scheme--text-subtle);
margin-top: 0;
margin-bottom: 0;
}
.text-rich-text figure {
margin-top: 0;
margin-bottom: 0;
}
.text-rich-text strong, .text-rich-text em {
color: var(--scheme--text);
}
.padding-global {
padding-right: var(--_layout--sizes---padding--global);
padding-left: var(--_layout--sizes---padding--global);
}
.form_message-success-wrapper {
background-color: var(--_color--primitives---opacity--transparent);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
margin-top: 1rem;
padding: 0;
}
.form_message-success {
border: 1px solid var(--_color--primitives---colors--green-light);
background-color: var(--_color--primitives---colors--green-dark);
color: var(--_color--primitives---colors--green-light);
border-radius: 8px;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 2.5rem;
display: flex;
}
.form_message-error {
border: 1px solid var(--_color--primitives---colors--red-light);
background-color: var(--_color--primitives---colors--red-dark);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
color: var(--_color--primitives---colors--red-light);
text-align: center;
border-radius: 8px;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 1rem;
display: flex;
}
.form_message-error-wrapper {
background-color: var(--_color--primitives---opacity--transparent);
margin-top: 1rem;
padding: 0;
}
.section_hero {
min-height: 100vh;
align-items: flex-start;
padding: 0;
margin: 0;
}
.hero_bg-wrap {
position: absolute;
inset: 0%;
}
.hero_bg-overlay {
z-index: 2;
background-image: linear-gradient(180deg, var(--_color--primitives---opacity--transparent), var(--scheme--background));
position: absolute;
inset: 0%;
}
.hero_bg-image {
object-fit: cover;
width: 100%;
height: 100%;
}
.hero_container {
z-index: 3;
grid-column-gap: var(--_layout--scale---small);
grid-row-gap: var(--_layout--scale---small);
text-align: center;
flex-flow: column;
width: 100%;
max-width: 40rem;
display: flex;
position: relative;
padding: 190px 40px 100px;
}
.text-color-subtle {
color: var(--scheme--text-subtle);
}
.button_text-wrap {
flex-flow: column;
height: 24px;
display: flex;
overflow: hidden;
}
.scroll_wrapper {
z-index: 3;
grid-column-gap: .5rem;
grid-row-gap: .5rem;
opacity: .57;
justify-content: center;
align-items: center;
display: inline-flex;
position: absolute;
inset: auto auto 12px;
}
.scroll_icon {
width: 16px;
height: 16px;
color: var(--scheme--text-subtle);
}
/* ==========================================
HEADER / NAVBAR
========================================== */
.navbar_nav {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 93px;
z-index: 100;
background: rgba(2, 6, 23, 0.82);
border-top: 1px solid rgba(56, 189, 248, 0.12);
border-bottom: 1px solid rgba(148, 163, 184, 0.08);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
}
.navbar_container {
width: 100%;
max-width: 1250px;
height: 100%;
margin: 0 auto;
padding: 0 40px;
box-sizing: border-box;
}
.navbar_content {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: space-between;
}
/* ==========================================
LOGO
========================================== */
.brand_link {
display: flex;
align-items: center;
flex-shrink: 0;
}
.brand_logo {
display: block;
width: 180px !important;
height: auto !important;
}
/* ==========================================
MENU
========================================== */
.navbar_menu {
display: flex;
align-items: center;
justify-content: center;
gap: 36px;
margin-left: auto;
margin-right: 48px;
}
.navbar_link {
position: relative;
display: flex;
align-items: center;
color: #d8dee9;
font-size: 14px;
font-weight: 400;
line-height: 1;
text-decoration: none;
white-space: nowrap;
transition:
color 0.25s ease;
}
.navbar_link:hover {
color: #ffffff;
}
/* linha azul ao passar o mouse */
.navbar_link::after {
content: "";
position: absolute;
left: 0;
bottom: -9px;
width: 0;
height: 1px;
background: #38bdf8;
transition: width 0.25s ease;
}
.navbar_link:hover::after {
width: 100%;
}
/* ==========================================
BOTÃO
========================================== */
.navbar_right {
display: flex;
align-items: center;
flex-shrink: 0;
}
.navbar_right .button {
min-width: 194px;
height: 48px;
padding: 0 24px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 9px;
background: #17365d;
color: #ffffff;
border: none;
text-decoration: none;
font-size: 13px;
transition:
background 0.25s ease,
transform 0.25s ease;
}
.navbar_right .button:hover {
background: #1e4778;
transform: translateY(-1px);
}
/* ==========================================
MENU MOBILE
========================================== */
.navbar_burger {
display: none;
}
/* ==========================================
TABLET
========================================== */
@media screen and (max-width: 1000px) {
.navbar_container {
padding: 0 25px;
}
.navbar_menu {
gap: 22px;
margin-right: 25px;
}
.navbar_link {
font-size: 13px;
}
.navbar_right .button {
min-width: 165px;
}
}
/* ==========================================
MOBILE
========================================== */
@media screen and (max-width: 767px) {
.navbar_nav {
height: 78px;
}
.navbar_container {
padding: 0 20px;
}
.brand_logo {
width: 145px !important;
}
.navbar_menu {
display: none;
}
.navbar_right {
display: none;
}
.navbar_burger {
display: flex;
width: 42px;
height: 42px;
align-items: center;
justify-content: center;
}
}
.section {
padding-top: 5rem;
padding-bottom: 5rem;
}
.container {
z-index: 3;
width: 100%;
max-width: 70rem;
padding-right: var(--_layout--sizes---padding--global);
padding-left: var(--_layout--sizes---padding--global);
grid-column-gap: 2.5rem;
grid-row-gap: 2.5rem;
flex-flow: column;
display: flex;
position: relative;
}
.container.align-center {
justify-content: flex-start;
align-items: center;
}
.container.is-blog {
max-width: 50rem;
}
.header_block {
grid-column-gap: var(--_layout--scale---xxsmall);
grid-row-gap: var(--_layout--scale---xxsmall);
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
display: flex;
}
.header_block:where(.w-variant-8efdbe3a-0a34-150b-8261-9c4465ebf859), .header_block:where(.w-variant-033790a2-ca22-a1c4-2e6c-39418bef2bd0), .header_block.center-aligned {
text-align: center;
justify-content: flex-start;
align-items: center;
}
.badge_block {
grid-column-gap: .25rem;
grid-row-gap: .25rem;
justify-content: flex-start;
align-items: center;
display: flex;
}
.badge_dot {
background-color: var(--scheme--text-subtle);
width: 4px;
height: 4px;
}
.badge_dot:where(.w-variant-15b21f3e-3e3e-ac6d-812a-c8c5c7570baf) {
background-color: var(--_color--primitives---colors--green-light);
}
.badge_text {
color: #5ee7df;
font-size: var(--_type--sizes---s);
}
.badge_text:where(.w-variant-15b21f3e-3e3e-ac6d-812a-c8c5c7570baf) {
color: var(--_color--primitives---colors--green-light);
}
.header_heading-stack {
grid-column-gap: .25rem;
grid-row-gap: .25rem;
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
display: flex;
}
.header_heading-stack:where(.w-variant-8efdbe3a-0a34-150b-8261-9c4465ebf859), .header_heading-stack:where(.w-variant-033790a2-ca22-a1c4-2e6c-39418bef2bd0), .header_heading-stack.center-aligned-2, .header_heading-stack.center-aligned-7 {
justify-content: flex-start;
align-items: center;
}
.grid {
grid-column-gap: var(--_layout--sizes---gap--xsmall);
grid-row-gap: var(--_layout--sizes---gap--xsmall);
grid-template-rows: auto;
grid-template-columns: 1fr 1fr 1fr;
grid-auto-columns: 1fr;
width: 100%;
display: grid;
}
.grid.is-pricing {
place-items: start stretch;
}
.grid.gap-small {
grid-column-gap: var(--_layout--scale---xxsmall);
grid-row-gap: var(--_layout--scale---xxsmall);
}
.grid.is-blog {
grid-column-gap: var(--_layout--scale---xxsmall);
grid-row-gap: var(--_layout--sizes---gap--small);
}
.grid.is-blog.is-2col {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
grid-template-columns: 1fr 1fr;
}
.grid.is-legal {
grid-column-gap: 2.5rem;
grid-row-gap: 2.5rem;
grid-template-columns: .5fr 1fr;
}
.card {
background-color: var(--_color--primitives---colors--neutral-300);
border-radius: 12px;
width: 100%;
height: 100%;
padding: 2.5rem 1.5rem;
}
.card.is-pricing {
grid-column-gap: 1.25rem;
grid-row-gap: 1.25rem;
border: 1px solid var(--scheme--border);
flex-flow: column;
height: auto;
padding: 1.25rem;
display: flex;
}
.card.is-pricing.is-green {
border: 1px solid var(--_color--primitives---colors--green-light);
}
.card.is-bento {
grid-column-gap: 2.5rem;
grid-row-gap: 2.5rem;
flex-flow: column;
justify-content: space-between;
align-items: flex-start;
display: flex;
}
.problem-card_content {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-flow: column;
justify-content: space-between;
align-items: flex-start;
height: 100%;
display: flex;
}
.card_tag {
color: var(--scheme--text-subtle);
font-size: var(--_type--sizes---s);
font-weight: var(--_type--fonts---font-weight--light);
}
.solution_grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 2rem;
}
/* CARD */
.solution_card {
position: relative;
height: 420px;
overflow: hidden;
border-radius: 16px;
border: 1px solid #263248;
background: #101829;
cursor: pointer;
}
/* FOTO */
.solution_image_wrap {
position: absolute;
inset: 0;
}
.solution_image {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition:
transform .7s cubic-bezier(.2,.8,.2,1),
filter .7s ease;
}
/* ESCURECIMENTO */
.solution_card::after {
content: "";
position: absolute;
inset: 0;
background:
linear-gradient(
180deg,
rgba(5, 10, 20, .05) 0%,
rgba(5, 10, 20, .35) 45%,
rgba(5, 10, 20, .98) 100%
);
opacity: .35;
transition: opacity .6s ease;
pointer-events: none;
}
/* CONTEÚDO */
.solution_overlay {
position: absolute;
inset: 0;
z-index: 2;
display: flex;
flex-direction: column;
justify-content: flex-end;
padding: 2rem;
transform: translateY(120px);
opacity: 0;
transition:
transform .6s cubic-bezier(.2,.8,.2,1),
opacity .45s ease;
}
/* ÍCONE */
.solution_icon {
width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1rem;
border: 1px solid #075d91;
border-radius: 12px;
background: rgba(5, 35, 55, .85);
color: #00a8ff;
}
/* TAG */
.solution_card_tag {
margin-bottom: .5rem;
color: #00a8ff;
font-size: .75rem;
font-weight: 700;
letter-spacing: .08em;
}
/* TÍTULO */
.solution_card_title {
margin: 0 0 1rem;
color: #fff;
font-size: 1.4rem;
line-height: 1.3;
}
/* TEXTO */
.solution_card_text {
display: flex;
flex-direction: column;
gap: .75rem;
}
.solution_card_text p {
margin: 0;
color: #d5ddea;
font-size: .85rem;
line-height: 1.5;
}
.solution_card_text strong {
color: #fff;
}
/* EXEMPLO */
.solution_card_footer {
margin-top: 1.25rem;
padding-top: 1rem;
border-top: 1px solid rgba(255,255,255,.12);
color: #00a8ff;
font-size: .7rem;
font-weight: 700;
letter-spacing: .08em;
}
/* =========================
HOVER
========================= */
.solution_card:hover .solution_image {
transform: scale(1.08);
filter: brightness(.45);
}
.solution_card:hover::after {
opacity: 1;
}
.solution_card:hover .solution_overlay {
transform: translateY(0);
opacity: 1;
}
.tag_block:where(.w-variant-f9f5a726-df93-2875-f74e-4149ef4decd1) {
border-color: var(--_color--primitives---colors--green-light);
background-color: var(--_color--primitives---colors--green-dark);
color: var(--_color--primitives---colors--green-light);
}
.text-block {
line-height: var(--_type--fonts---line-height--medium);
}
.outcome_block {
grid-column-gap: 0px;
grid-row-gap: 0px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
grid-auto-columns: 1fr;
display: grid;
position: relative;
}
.outcome_arrow {
z-index: 1;
border: 1px solid var(--scheme--border);
border-radius: var(--_styling--border---radius--pill);
background-color: var(--_color--primitives---colors--white-10);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
justify-content: center;
align-items: center;
width: 1.5rem;
height: 1.5rem;
display: flex;
position: absolute;
inset: auto -.75rem auto auto;
}
.outcome_content {
grid-column-gap: 1.5rem;
grid-row-gap: 1.5rem;
border-style: solid none solid solid;
border-width: 1px;
border-color: var(--scheme--border);
background-color: var(--scheme--foreground);
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
flex-flow: column;
justify-content: center;
align-items: flex-end;
padding: 2.5rem;
display: flex;
position: relative;
}
.outcome_content.is-green {
border-style: solid;
border-color: var(--_color--primitives---colors--green-light);
background-color: var(--_color--primitives---colors--green-dark);
border-radius: 0 8px 8px 0;
}
.outcome_top {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
width: 100%;
display: flex;
}
.outcome_pill {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
border: 1px solid var(--scheme--border);
border-radius: var(--_styling--border---radius--pill);
background-color: var(--_color--primitives---colors--neutral-200);
color: var(--scheme--text-subtle);
font-size: var(--_type--sizes---xs);
line-height: var(--_type--fonts---line-height--xlarge);
justify-content: center;
align-items: center;
padding: .25rem .5rem;
display: flex;
}
.outcome_pill.is-green {
border-color: var(--_color--primitives---colors--green-light);
background-color: var(--_color--primitives---colors--green-dark);
color: var(--_color--primitives---colors--green-light);
}
.outcome_pill-divider {
border-radius: var(--_styling--border---radius--pill);
background-color: var(--_color--primitives---colors--neutral-100);
width: 3px;
height: 3px;
}
.outcome_list {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-flow: column;
width: 100%;
display: flex;
}
.outcome_list-item {
grid-column-gap: 1rem;
grid-row-gap: 1rem;
grid-template-rows: auto;
grid-template-columns: .25fr 1fr;
grid-auto-columns: 1fr;
place-items: start stretch;
display: grid;
}
.outcome_list-left {
justify-content: space-between;
align-items: center;
display: flex;
}
.outcome_list-dot {
border-radius: var(--_styling--border---radius--pill);
background-color: var(--_color--primitives---colors--neutral-100);
width: 4px;
height: 4px;
}
.outcome_list-dot.is-green {
background-color: var(--_color--primitives---colors--green-light);
}
.outcome_list-details {
grid-column-gap: .25rem;
grid-row-gap: .25rem;
flex-flow: column;
display: flex;
}
.outcome_tag-list {
grid-column-gap: .25rem;
grid-row-gap: .25rem;
flex-flow: wrap;
justify-content: flex-start;
align-items: center;
display: flex;
}
.outcome_arrow-icon {
width: 1rem;
height: 1rem;
}
.stats_grid {
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr 1fr;
grid-auto-columns: 1fr;
width: 100%;
max-width: 500px;
margin-left: auto;
margin-right: auto;
display: grid;
}
.stats_item {
text-align: center;
flex-flow: column;
justify-content: center;
align-items: center;
padding-left: 1.25rem;
padding-right: 1.25rem;
display: flex;
}
.stats_item.is-center {
border-right: 1px solid var(--scheme--border);
border-left: 1px solid var(--scheme--border);
}
.step_content {
grid-column-gap: 1rem;
grid-row-gap: 1rem;
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
width: 100%;
height: 100%;
display: flex;
}
.feature_tabs {
flex-flow: column;
justify-content: flex-start;
align-items: center;
width: 100%;
display: flex;
}
.feature_tabs-menu {
grid-column-gap: .25rem;
grid-row-gap: .25rem;
justify-content: center;
align-items: center;
margin-bottom: 2.5rem;
display: flex;
}
.features_tab-link {
border: 1px solid var(--_color--primitives---opacity--transparent);
border-radius: var(--_styling--border---radius--pill);
background-color: var(--_color--primitives---colors--neutral-300);
color: var(--scheme--text-subtle);
padding: .5rem .75rem;
}
.features_tab-link.w--current {
border-color: var(--_color--primitives---colors--white-10);
background-color: var(--_color--primitives---colors--neutral-200);
color: var(--scheme--text);
}
.features_tabs-content {
width: 100%;
}
.features_tab-grid {
grid-column-gap: 1.25rem;
grid-row-gap: 1.25rem;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
}
.features_visual {
background-image: url("../images/69f11a1bebe9dc161fd3ac5a_Foggy%20Mountain.webp");
background-position: 50%;
background-repeat: no-repeat;
background-size: cover;
border-radius: 8px;
justify-content: center;
align-items: center;
padding: 2.5rem;
display: flex;
overflow: hidden;
}
.features_image {
width: 100%;
}
.features_content {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
flex-flow: column;
display: flex;
}
.features_top, .features_list {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-flow: column;
display: flex;
}
.features_item {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
border: 1px solid var(--scheme--border);
background-color: var(--_color--primitives---colors--neutral-200);
border-radius: .5rem;
justify-content: flex-start;
align-items: center;
padding: .5rem;
display: flex;
}
.features_icon-wrap {
border: 1px solid var(--_color--primitives---colors--green-light);
background-color: var(--_color--primitives---colors--green-dark);
width: 1.5rem;
height: 1.5rem;
color: var(--_color--primitives---colors--green-light);
border-radius: 4px;
flex: none;
justify-content: center;
align-items: center;
display: flex;
}
.features_icon-wrap.is-grey {
border-color: var(--_color--primitives---colors--white-10);
background-color: var(--_color--primitives---colors--neutral-200);
color: var(--scheme--text-subtle);
}
.features_icon {
width: 14px;
height: 14px;
}
.testimonials02_marquee {
grid-column-gap: 1rem;
grid-row-gap: 1rem;
justify-content: center;
align-items: center;
display: flex;
}
.testimonials02_marquee.is-bottom {
margin-top: .5rem;
}
.testimonials02_list {
grid-column-gap: 1rem;
grid-row-gap: 1rem;
flex: none;
justify-content: center;
align-items: center;
display: flex;
}
.testimonials02_list.move-right, .testimonials02_list.move-left {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
}
.testimonials02_card {
grid-column-gap: 1rem;
grid-row-gap: 1rem;
border: 1px solid var(--scheme--border);
background-color: var(--scheme--foreground);
border-radius: .5rem;
flex-flow: column;
justify-content: space-between;
align-items: stretch;
max-width: 28rem;
padding: 1.5rem;
display: flex;
position: relative;
overflow: hidden;
}
.testimonials02_bottom {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
flex-flow: wrap;
justify-content: flex-start;
align-items: center;
display: flex;
}
.avatar-wrapper {
border-radius: var(--_styling--border---radius--pill);
flex: none;
justify-content: center;
align-items: center;
width: 32px;
height: 32px;
display: inline-flex;
overflow: hidden;
}
.testimonials_divider {
background-color: var(--_color--primitives---colors--white-10);
width: 5rem;
height: 1px;
}
.testimonials02_quote {
width: 2rem;
height: 2rem;
color: var(--_color--primitives---colors--white-10);
}
.testimonials_component {
max-width: 75rem;
position: relative;
overflow: hidden;
}
.testimonials_fadeout {
background-image: linear-gradient(90deg, var(--scheme--background), var(--_color--primitives---opacity--transparent));
pointer-events: none;
width: 25%;
position: absolute;
inset: 0% auto 0% 0%;
}
.testimonials_fadeout.is-right {
background-image: linear-gradient(270deg, var(--scheme--background), var(--_color--primitives---opacity--transparent));
inset: 0% 0% 0% auto;
}
.faq_block {
border: 1px solid var(--scheme--border);
border-radius: .5rem;
width: 100%;
max-width: 600px;
}
.faq_accordion {
background-color: var(--_color--primitives---opacity--transparent);
width: 100%;
color: var(--scheme--text);
overflow: hidden;
}
.faq_title {
grid-column-gap: 1.5rem;
grid-row-gap: 1.5rem;
color: var(--scheme--text);
cursor: pointer;
justify-content: space-between;
align-items: center;
padding: .75rem;
display: flex;
}
.faq_icon-holder {
justify-content: center;
align-items: center;
width: 24px;
height: 24px;
display: flex;
}
.faq_icon_line-horizontal {
color: #fff;
background-color: #fff;
width: 16px;
height: 2px;
position: absolute;
}
.faq_icon_line-vertical {
background-color: #fff;
width: 2px;
height: 16px;
position: absolute;
}
.faq_content {
border-bottom: 1px solid var(--scheme--border);
padding-left: .75rem;
padding-right: .75rem;
overflow: hidden;
}
.faq_dropdown-content {
grid-column-gap: calc(16px * 1);
grid-row-gap: calc(16px * 1);
flex-flow: column;
margin-bottom: .75rem;
display: flex;
}
.section_footer {
padding: 1.25rem clamp(1rem, 4vw, 3rem);
background: #050b14;
border-top: 1px solid rgba(161, 181, 209, 0.16);
}
.footer-content {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr);
align-items: center;
gap: 1.5rem;
width: min(100%, 70rem);
margin: 0 auto;
}
.footer-brand {
display: inline-flex;
justify-self: start;
align-items: center;
}
.footer-logo {
display: block;
width: clamp(9rem, 16vw, 13rem);
height: auto;
}
.footer-bg-overlay {
z-index: 2;
background-image: linear-gradient(0deg, #0f101000, var(--_color--primitives---colors--neutral-400));
position: absolute;
inset: 0%;
}
.footer_bg-image {
object-fit: cover;
width: 100%;
height: 100%;
}
.footer_top {
display: flex;
gap: 2rem;
}
.footer_column {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
display: flex;
}
.footer_menu {
grid-column-gap: .25rem;
grid-row-gap: .25rem;
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
width: 100%;
display: flex;
}
.footer_link {
color: var(--scheme--text);
text-decoration: underline;
-webkit-text-decoration-color: var(--_color--primitives---opacity--transparent);
text-decoration-color: var(--_color--primitives---opacity--transparent);
transition: text-decoration-color .3s, color .3s;
}
.footer_link:hover {
color: var(--scheme--text-subtle);
-webkit-text-decoration-color: var(--scheme--text-subtle);
text-decoration-color: var(--scheme--text-subtle);
}
.footer-copyright {
margin: 0;
color: #94a3b8;
font-size: 0.8125rem;
line-height: 1.4;
text-align: center;
}
.footer_text-wrap {
container-type: inline-size;
}
.footer_text-image {
width: 100%;
}
.pricing_top {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
display: flex;
}
.pricing_price-block {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
display: flex;
}
.pricing_price-wrapper {
grid-column-gap: 6px;
grid-row-gap: 6px;
justify-content: flex-start;
align-items: flex-end;
display: flex;
}
.pricing_price {
font-size: 2.25rem;
line-height: var(--_type--fonts---line-height--xsmall);
}
.pricing_divider-row {
grid-column-gap: 1.25rem;
grid-row-gap: 1.25rem;
justify-content: space-between;
align-items: center;
display: flex;
}
.pricing_divider {
background-color: var(--_color--primitives---colors--white-10);
width: 100%;
height: 1px;
}
.pricing_checklist {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-flow: column;
padding-left: 0;
display: flex;
}
.pricing_list-item {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
justify-content: flex-start;
align-items: center;
margin-top: 0;
margin-bottom: 0;
padding: 0;
display: flex;
}
.pricing_check-icon {
width: 1rem;
height: 1rem;
}
.pricing_check-icon.is-green {
color: var(--_color--primitives---colors--green-light);
}
.pricing_button-wrap {
grid-template-rows: auto;
grid-template-columns: 1fr;
grid-auto-columns: 1fr;
display: grid;
}
.about-text_reveal {
font-size: 1.75rem;
line-height: var(--_type--fonts---line-height--small);
letter-spacing: -.04px;
}
.card_number {
opacity: .18;
font-size: 2rem;
line-height: var(--_type--fonts---line-height--xsmall);
}
.card_divider {
background-color: var(--_color--primitives---colors--white-10);
width: 45%;
height: 1px;
}
.card_number-icon {
width: 24px;
height: 24px;
color: var(--scheme--text);
}
.card_bottom {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
flex-flow: column;
display: flex;
}
.card_number-text {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-flow: column;
display: flex;
}
.section_image {
position: relative;
}
.large-image_wrapper {
aspect-ratio: 16 / 9;
}
.team_card {
border-radius: 8px;
position: relative;
overflow: hidden;
}
.team_image {
aspect-ratio: 1 / 1.15;
object-fit: cover;
width: 100%;
}
.team_img-wrapper {
position: relative;
}
.team_img-verlay {
z-index: 1;
background-image: linear-gradient(180deg, var(--_color--primitives---opacity--transparent), var(--scheme--background));
position: absolute;
inset: -1%;
}
.team_content {
z-index: 2;
justify-content: flex-start;
align-items: flex-end;
padding: 1.25rem;
display: flex;
position: absolute;
inset: 0%;
}
.team_text-block {
width: 100%;
}
.team_social-lsit {
grid-column-gap: .25rem;
grid-row-gap: .25rem;
justify-content: flex-end;
align-items: center;
display: flex;
}
.team_social-item {
background-color: var(--_color--primitives---colors--white-10);
width: 24px;
height: 24px;
color: var(--scheme--text-subtle);
border-radius: 4px;
justify-content: center;
align-items: center;
transition: background-color .3s, color .3s;
display: flex;
}
.team_social-item:hover {
background-color: var(--_color--primitives---colors--white-20);
color: var(--scheme--text);
}
.team_icon {
width: 16px;
height: 16px;
}
.section_contact {
justify-content: center;
align-items: center;
min-height: 100vh;
display: flex;
position: relative;
}
.contact_form-block {
width: 100%;
max-width: 25rem;
margin-left: auto;
margin-right: auto;
}
.contact_form {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
flex-flow: column;
display: flex;
}
.form_input-wrapper {
grid-column-gap: .25rem;
grid-row-gap: .25rem;
flex-flow: column;
display: flex;
}
.about-bg_overlay {
z-index: 2;
background-image: linear-gradient(180deg, var(--scheme--background), var(--_color--primitives---opacity--transparent) 50%, var(--scheme--background));
position: absolute;
inset: 0%;
}
.blog_list-wrapper {
width: 100%;
}
.blog_card {
grid-column-gap: var(--_layout--scale---tiny);
grid-row-gap: var(--_layout--scale---tiny);
filter: grayscale();
flex-flow: column;
width: 100%;
height: 100%;
transition: filter .5s;
display: flex;
position: relative;
}
.blog_card:hover {
filter: grayscale(0%);
}
.blog_img-wrapper {
border-radius: 8px;
width: 100%;
height: 20rem;
position: relative;
overflow: hidden;
}
.blog_image {
object-fit: cover;
width: 100%;
height: 100%;
}
.blog_overlay {
z-index: 1;
background-image: linear-gradient(180deg, var(--_color--primitives---opacity--transparent), var(--scheme--background));
display: none;
position: absolute;
inset: 0%;
}
.blog_content {
z-index: 2;
grid-column-gap: .5rem;
grid-row-gap: .5rem;
border-radius: var(--_styling--border---radius--medium);
background-color: var(--_color--primitives---colors--neutral-300);
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
padding: 1.25rem;
display: flex;
}
.waitlist_form-block {
width: 100%;
max-width: 25rem;
margin-left: auto;
margin-right: auto;
}
.waitlist_form {
grid-column-gap: 4px;
grid-row-gap: 4px;
grid-template-rows: auto;
grid-template-columns: 1fr .5fr;
grid-auto-columns: 1fr;
display: grid;
}
.column {
height: 99%;
}
.position-sticky {
position: sticky;
top: 8rem;
}
._404_overlay {
z-index: 2;
background-image: linear-gradient(180deg, #0f101091, var(--scheme--background));
position: absolute;
inset: 0%;
}
._404_number {
background-image: linear-gradient(0deg, var(--_color--primitives---opacity--transparent), white);
opacity: .57;
font-size: 25.5rem;
line-height: .7;
font-weight: var(--_type--fonts---font-weight--medium);
letter-spacing: -5px;
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
background-clip: text;
}
._404_wrap {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
flex-flow: column;
justify-content: flex-start;
align-items: center;
display: flex;
}
.blog_header {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
display: flex;
}
.blog_header-text {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
flex-flow: column;
display: flex;
}
.blog_meta-wrapper {
grid-column-gap: .75rem;
grid-row-gap: .5rem;
flex-flow: wrap;
justify-content: flex-start;
align-items: center;
display: flex;
}
.meta_item {
grid-column-gap: .25rem;
grid-row-gap: .25rem;
justify-content: flex-start;
align-items: center;
display: flex;
}
.blog_meta-icon {
width: 16px;
height: 16px;
color: var(--scheme--text-subtle);
}
.meta_read-wrap {
grid-column-gap: 3px;
grid-row-gap: 3px;
justify-content: flex-start;
align-items: center;
display: flex;
}
.blog_header-image {
aspect-ratio: 2;
border-radius: var(--_styling--border---radius--medium);
width: 100%;
}
.blog_articles-wrap {
grid-column-gap: .75rem;
grid-row-gap: .75rem;
flex-flow: column;
display: flex;
}
.admin_grid {
grid-column-gap: .5rem;
grid-row-gap: .5rem;
grid-template-rows: auto;
grid-template-columns: .5fr 1fr;
place-items: start;
}
.license_col {
grid-column-gap: 40px;
grid-row-gap: 40px;
flex-flow: column;
display: flex;
}
.admin_content {
grid-column-gap: var(--_layout--scale---tiny);
grid-row-gap: var(--_layout--scale---tiny);
flex-flow: column;
display: flex;
}
.admin_content.is-color {
grid-column-gap: var(--_layout--scale---tiny);
grid-row-gap: var(--_layout--scale---tiny);
grid-template-rows: auto;
grid-template-columns: 1fr 1fr 1fr;
grid-auto-columns: 1fr;
width: 100%;
display: grid;
}
.admin_content.is-button {
grid-column-gap: var(--_layout--scale---tiny);
grid-row-gap: var(--_layout--scale---tiny);
grid-template-rows: auto;
grid-template-columns: 1fr 1fr 1fr;
grid-auto-columns: 1fr;
place-items: center start;
width: 100%;
display: grid;
}
.admin_style-block {
grid-column-gap: var(--_layout--scale---xtiny);
grid-row-gap: var(--_layout--scale---xtiny);
flex-flow: column;
display: flex;
}
.color-block {
border: 1px solid var(--scheme--border);
border-radius: var(--_styling--border---radius--medium);
background-color: var(--_color--primitives---colors--neutral-400);
width: 100%;
height: 5rem;
}
.color-block._300 {
background-color: var(--_color--primitives---colors--neutral-300);
}
.color-block._200 {
background-color: var(--_color--primitives---colors--neutral-200);
}
.color-block._100 {
background-color: var(--_color--primitives---colors--neutral-100);
}
.color-block.light {
background-color: var(--_color--primitives---colors--white);
}
.color-block._10 {
background-color: var(--_color--primitives---colors--white-10);
}
.color-block._20 {
background-color: var(--_color--primitives---colors--white-20);
}
.color-block.orange {
background-color: var(--_color--primitives---colors--orange);
}
.color-block.green-light {
background-color: var(--_color--primitives---colors--green-light);
}
.color-block.green-dark {
background-color: var(--_color--primitives---colors--green-dark);
}
.color-block.red-light {
background-color: var(--_color--primitives---colors--red-light);
}
.color-block.red-dark {
background-color: var(--_color--primitives---colors--red-dark);
}
@media screen and (max-width: 991px) {
body {
--_type--heading---display-text--h1: 2.4rem;
--_type--heading---weight: var(--_type--fonts---font-weight--medium);
--_type--heading---display-text--h2: 1.875rem;
--_type--heading---display-text--h3: 1.35rem;
--_type--heading---display-text--display-4\: calc(var(--_type--heading---display-text--display-5\) * var(--_type--heading---text-scale\));
--_type--heading---display-text--display-5\: calc(var(--_type--heading---display-text--display-6\) * var(--_type--heading---text-scale\));
--_type--heading---display-text--display-6\: calc(16px * var(--_type--heading---text-scale\));
--_type--heading---rich-text--h1: 2.25rem;
--_type--heading---rich-text--h2: 2rem;
--_type--heading---rich-text--h3: 1.75rem;
--_type--heading---rich-text--h4: 1.5rem;
--_type--heading---rich-text--h5: 1.25rem;
--_type--heading---rich-text--h6: 1rem;
--_type--heading---text-scale\: 1.19;
}
.blog_img-wrapper {
height: 15rem;
}
}
@media screen and (max-width: 767px) {
body {
--_type--heading---display-text--h1: 2.4rem;
--_type--heading---weight: var(--_type--fonts---font-weight--medium);
--_type--heading---display-text--h2: 1.875rem;
--_type--heading---display-text--h3: 1.35rem;
--_type--heading---display-text--display-4\: calc(var(--_type--heading---display-text--display-5\) * var(--_type--heading---text-scale\));
--_type--heading---display-text--display-5\: calc(var(--_type--heading---display-text--display-6\) * var(--_type--heading---text-scale\));
--_type--heading---display-text--display-6\: calc(16px * var(--_type--heading---text-scale\));
--_type--heading---rich-text--h1: 2.25rem;
--_type--heading---rich-text--h2: 2rem;
--_type--heading---rich-text--h3: 1.75rem;
--_type--heading---rich-text--h4: 1.5rem;
--_type--heading---rich-text--h5: 1.25rem;
--_type--heading---rich-text--h6: 1rem;
--_type--heading---text-scale\: 1.19;
}
.navbar_nav.fade-in-0-8 {
background-color: var(--_color--primitives---colors--neutral-400);
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
.navbar_container {
max-width: 100%;
}
.navbar_menu {
background-color: var(--_color--primitives---colors--neutral-400);
padding: 2.5rem .75rem;
}
.navbar_link {
color: var(--scheme--text);
font-size: var(--_type--sizes---mobile-link);
line-height: var(--_type--fonts---line-height--large);
}
.navbar_right {
display: none;
}
.navbar_burger {
flex-flow: column;
justify-content: center;
align-items: center;
width: 32px;
height: 32px;
padding: 0;
display: flex;
position: relative;
}
.navbar_burger.w--open {
background-color: var(--_color--primitives---opacity--transparent);
}
.grid.is-pricing {
flex-flow: column;
grid-template-columns: 1fr 1fr;
}
.grid.is-bento, .grid.gap-small.is-team, .grid.is-blog {
grid-template-columns: 1fr 1fr;
}
.grid.is-legal {
grid-column-gap: 1.5rem;
grid-row-gap: 1.5rem;
}
.card.is-pricing {
height: 100%;
}
.solution_item {
grid-template-columns: .75fr 1fr;
}
.solution_visual {
padding: .5rem .75rem;
}
.outcome_block {
grid-template-columns: 1fr;
}
.outcome_arrow {
inset: auto auto -.75rem;
}
.outcome_content {
border-bottom-style: none;
border-right-style: solid;
border-top-right-radius: 8px;
border-bottom-left-radius: 0;
justify-content: flex-end;
align-items: center;
}
.outcome_content.is-green {
border-top-right-radius: 0;
border-bottom-left-radius: 8px;
}
.outcome_arrow-icon {
transform: rotate(90deg);
}
.faq_title {
padding: 1rem 1.25rem;
}
.faq_content {
padding-left: 1.25rem;
padding-right: 1.25rem;
}
.navbar_line-top, .navbar_line-middle, .navbar_line-bottom {
background-color: var(--_color--primitives---colors--white);
width: 22px;
height: 2px;
}
.navbar_burger-wrap {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-flow: column;
justify-content: space-between;
align-items: center;
width: 32px;
height: 32px;
padding-top: 8px;
padding-bottom: 8px;
display: flex;
position: absolute;
}
._404_number {
font-size: 15rem;
}
}
@media screen and (max-width: 479px) {
body {
--_type--heading---display-text--h1: 2.4rem;
--_type--heading---weight: var(--_type--fonts---font-weight--medium);
--_type--heading---display-text--h2: 1.875rem;
--_type--heading---display-text--h3: 1.35rem;
--_type--heading---display-text--display-4\: calc(var(--_type--heading---display-text--display-5\) * var(--_type--heading---text-scale\));
--_type--heading---display-text--display-5\: calc(var(--_type--heading---display-text--display-6\) * var(--_type--heading---text-scale\));
--_type--heading---display-text--display-6\: calc(16px * var(--_type--heading---text-scale\));
--_type--heading---rich-text--h1: 2.25rem;
--_type--heading---rich-text--h2: 2rem;
--_type--heading---rich-text--h3: 1.75rem;
--_type--heading---rich-text--h4: 1.5rem;
--_type--heading---rich-text--h5: 1.25rem;
--_type--heading---rich-text--h6: 1rem;
--_type--heading---text-scale\: 1.19;
}
.grid {
grid-template-columns: 1fr;
}
.grid.is-pricing {
grid-column-gap: var(--_layout--sizes---gap--small);
grid-row-gap: var(--_layout--sizes---gap--small);
display: flex;
}
.grid.is-bento, .grid.gap-small.is-team {
grid-template-columns: 1fr;
}
.grid.is-blog {
flex-flow: column;
display: flex;
}
.grid.is-legal {
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
display: flex;
}
.card.is-pricing {
height: auto;
}
.solution_item {
grid-template-columns: 1fr;
}
.solution_visual {
padding: 1.25rem;
}
.outcome_content {
padding: 1.5rem;
}
.stats_grid {
grid-column-gap: 0px;
grid-row-gap: 0px;
flex-flow: column;
display: flex;
}
.stats_item {
padding: 1.25rem;
}
.stats_item.is-center {
border-style: solid none;
border-width: 1px;
border-color: var(--scheme--border);
}
.features_tab-grid {
flex-flow: column;
display: flex;
}
.features_visual {
order: 9999;
padding: 1.5rem;
}
.footer_top {
grid-column-gap: 1rem;
grid-row-gap: 3rem;
grid-template-columns: 1fr 1fr;
}
._404_number {
font-size: 6.1rem;
}
.admin_grid {
grid-column-gap: 1rem;
grid-row-gap: 1rem;
flex-flow: column;
justify-content: flex-start;
align-items: flex-start;
display: flex;
}
.admin_content.is-color, .admin_content.is-button {
grid-template-columns: 1fr 1fr;
}
}
#w-node-b11903fe-7e5e-fd83-5592-e75ed38a59f9-d38a59f6, #w-node-_48f98970-debf-8658-41f9-e67aaaa97232-5936c478 {
grid-area: span 1 / span 2 / span 1 / span 2;
}
#w-node-bcdc2ed2-330f-3d73-63b8-8ccbdeae8dcc-5936c478, #w-node-a78674c6-6adf-358c-616a-df499cf51241-5936c478 {
grid-area: span 1 / span 1 / span 1 / span 1;
}
#w-node-a70cc821-1fbe-3535-eb8c-ad3a14c8f4cc-5936c478 {
grid-area: span 1 / span 2 / span 1 / span 2;
}
@media screen and (max-width: 767px) {
#w-node-fcdf1a98-b49e-37d4-6f5e-4294d257676d-41ea4bb8 {
grid-area: span 1 / span 2 / span 1 / span 2;
}
#w-node-_48f98970-debf-8658-41f9-e67aaaa97232-5936c478, #w-node-a70cc821-1fbe-3535-eb8c-ad3a14c8f4cc-5936c478 {
grid-column: span 1 / span 1;
}
#w-node-_62638ad1-3f95-bcb3-5027-5beed6438165-5936c478 {
grid-area: span 1 / span 2 / span 1 / span 2;
}
#w-node-_0a8acfb0-9086-f3ca-3010-698e5998a9c4-5936c478 {
grid-area: span 1 / span 1 / span 1 / span 1;
}
}
@media screen and (max-width: 479px) {
#w-node-b11903fe-7e5e-fd83-5592-e75ed38a59f9-d38a59f6 {
grid-column: span 2 / span 2;
}
#w-node-_62638ad1-3f95-bcb3-5027-5beed6438165-5936c478 {
grid-column: span 1 / span 1;
}
}
/* ==========================================
COMO FUNCIONA — IGUAL À REFERÊNCIA
========================================== */
/* A section ocupa toda a largura */
#how-it-works {
width: 100% !important;
overflow: hidden;
}
/* Remove a limitação do container do Webflow */
#how-it-works > .w-container,
#how-it-works .container {
width: 100% !important;
max-width: none !important;
padding-left: 23px !important;
padding-right: 23px !important;
box-sizing: border-box !important;
}
/* ==========================================
GRID
========================================== */
#how-it-works .w-layout-grid.grid {
display: grid !important;
grid-template-columns:
repeat(4, minmax(0, 1fr)) !important;
gap: 32px !important;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
box-sizing: border-box !important;
}
/* ==========================================
CARD
========================================== */
#how-it-works .card {
width: 100% !important;
height: 310px !important;
min-height: 310px !important;
max-height: 310px !important;
padding: 0 !important;
box-sizing: border-box !important;
background: #0b1123 !important;
border: 1px solid #1e2b42 !important;
border-radius: 16px !important;
overflow: hidden !important;
}
/* ==========================================
CONTEÚDO
========================================== */
#how-it-works .step_content {
width: 100% !important;
height: 100% !important;
padding: 38px 32px !important;
box-sizing: border-box !important;
display: flex !important;
flex-direction: column !important;
}
/* ==========================================
NÚMERO
========================================== */
#how-it-works .card_tag {
margin: 0 0 30px 0 !important;
padding: 0 !important;
color: #0b4168 !important;
font-size: 47px !important;
line-height: 1 !important;
font-weight: 800 !important;
}
/* ==========================================
BLOCO
========================================== */
#how-it-works .step-card_text-block {
margin: 0 !important;
padding: 0 !important;
display: block !important;
}
/* ==========================================
REMOVE ÍCONE
========================================== */
#how-it-works .step_icon-wrapper {
display: none !important;
}
/* ==========================================
TÍTULO
========================================== */
#how-it-works .card h3 {
margin: 0 0 16px 0 !important;
padding: 0 !important;
color: #ffffff !important;
font-size: 16px !important;
line-height: 1.55 !important;
font-weight: 600 !important;
}
/* ==========================================
TEXTO
========================================== */
#how-it-works .card p {
margin: 0 !important;
padding: 0 !important;
color: #9eb2cc !important;
font-size: 17px !important;
line-height: 1.55 !important;
}
/* ==========================================
TABLET
========================================== */
@media screen and (max-width: 1100px) {
#how-it-works .w-layout-grid.grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
/* ==========================================
CELULAR
========================================== */
@media screen and (max-width: 767px) {
#how-it-works > .w-container,
#how-it-works .container {
padding-left: 16px !important;
padding-right: 16px !important;
}
#how-it-works .w-layout-grid.grid {
grid-template-columns: 1fr !important;
gap: 18px !important;
}
#how-it-works .card {
height: auto !important;
min-height: 280px !important;
max-height: none !important;
}
}
/* =========================================================
SOBRE NÓS
MESMO PADRÃO VISUAL DAS OUTRAS SEÇÕES
========================================================= */
.about-section {
background: #020617;
}
/* =========================================================
HEADER
========================================================= */
.about-header {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
margin-bottom: 60px;
text-align: center;
}
/* Badge */
.about-header .badge_wrapper {
margin-bottom: 20px;
}
/* Título + subtítulo */
.about-header .header_heading-stack {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
max-width: 1000px;
}
.about-header .heading-style-h2 {
margin: 0;
text-align: center;
}
.about-header .header_heading-stack p {
margin-top: 14px;
text-align: center;
}
/* Texto introdutório */
.about-intro {
width: 100%;
max-width: 900px;
margin-top: 28px;
color: #9eabc0;
text-align: center;
font-size: 16px;
line-height: 1.7;
}
.about-intro p {
margin: 0;
}
.about-intro p + p {
margin-top: 16px;
}
/* =========================================================
PROFISSIONAIS
========================================================= */
.about-people-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
width: 100%;
}
/* =========================================================
CARD
========================================================= */
.about-person-card {
position: relative;
height: 430px;
overflow: hidden;
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 14px;
background: #0b1325;
transition:
transform 0.3s ease,
border-color 0.3s ease;
}
.about-person-card:hover {
transform: translateY(-3px);
border-color: rgba(56, 189, 248, 0.45);
}
/* =========================================================
FOTO
========================================================= */
.about-person-image-wrap {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.about-person-image {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center top;
transition:
transform 0.6s ease,
filter 0.4s ease;
}
.about-person-card:hover .about-person-image {
transform: scale(1.04);
filter: brightness(0.45);
}
/* Gradiente */
.about-person-image-wrap::after {
content: "";
position: absolute;
inset: 0;
z-index: 1;
pointer-events: none;
background:
linear-gradient(
to bottom,
transparent 45%,
rgba(2, 6, 23, 0.2) 60%,
rgba(2, 6, 23, 0.95) 100%
);
}
/* =========================================================
NOME NORMAL
========================================================= */
.about-person-caption {
position: absolute;
left: 28px;
right: 28px;
bottom: 25px;
z-index: 3;
transition:
opacity 0.3s ease,
transform 0.3s ease;
}
.about-person-caption-name {
color: #ffffff;
font-size: 22px;
font-weight: 700;
}
.about-person-caption-role {
margin-top: 6px;
color: #38bdf8;
font-size: 10px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
}
/* =========================================================
HOVER
========================================================= */
.about-person-overlay {
position: absolute;
inset: 0;
z-index: 4;
display: flex;
align-items: flex-end;
padding: 30px;
opacity: 0;
visibility: hidden;
background:
linear-gradient(
to bottom,
rgba(2, 6, 23, 0.15),
rgba(2, 6, 23, 0.97)
);
transition:
opacity 0.35s ease,
visibility 0.35s ease;
}
.about-person-card:hover .about-person-overlay {
opacity: 1;
visibility: visible;
}
.about-person-card:hover .about-person-caption {
opacity: 0;
transform: translateY(10px);
}
/* =========================================================
TEXTO DO HOVER
========================================================= */
.about-person-info {
width: 100%;
transform: translateY(15px);
transition: transform 0.4s ease;
}
.about-person-card:hover .about-person-info {
transform: translateY(0);
}
.about-person-name {
color: #ffffff;
font-size: 24px;
font-weight: 700;
}
.about-person-role {
margin-top: 6px;
color: #38bdf8;
font-size: 10px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
}
.about-person-description {
margin-top: 18px;
color: #c0cada;
font-size: 14px;
line-height: 1.65;
}
/* =========================================================
O QUE NOS MOVE
========================================================= */
.about-mission {
width: 100%;
margin-top: 24px;
padding: 30px;
box-sizing: border-box;
border: 1px solid rgba(56, 189, 248, 0.30);
border-radius: 14px;
background:
linear-gradient(
135deg,
rgba(10, 28, 53, 0.95),
rgba(8, 18, 35, 0.95)
);
}
.about-mission-title {
display: flex;
align-items: center;
gap: 9px;
margin-bottom: 16px;
color: #ffffff;
font-size: 15px;
font-weight: 700;
}
.about-mission-icon {
color: #38bdf8;
}
.about-mission p {
margin: 0;
color: #aebbd0;
font-size: 14px;
line-height: 1.65;
}
.about-mission p + p {
margin-top: 14px;
}
/* =========================================================
MOBILE
========================================================= */
@media screen and (max-width: 767px) {
.about-header {
margin-bottom: 40px;
}
.about-intro {
font-size: 15px;
}
.about-people-grid {
grid-template-columns: 1fr;
gap: 18px;
}
.about-person-card {
height: 400px;
}
.about-mission {
padding: 24px;
}
}
/* ==========================================
HERO — DIRETRIZLAB
========================================== */
.section_hero {
min-height: 100vh;
align-items: flex-start;
padding: 0;
margin: 0;
}
/* ==========================================
FUNDO
========================================== */
.hero_bg-wrap {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
z-index: 0;
overflow: hidden;
}
/* VÍDEO */
.hero_bg-video {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
opacity: 0.55;
}
/* IMAGEM — caso seja utilizada */
.hero_bg-image {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
opacity: 0.55;
}
/* ==========================================
OVERLAY DO VÍDEO
========================================== */
.hero_bg-overlay {
position: absolute;
inset: 0;
z-index: 1;
background:
linear-gradient(
90deg,
rgba(2, 8, 23, 0.96) 0%,
rgba(2, 8, 23, 0.82) 38%,
rgba(2, 8, 23, 0.45) 70%,
rgba(2, 8, 23, 0.30) 100%
);
}
/* ==========================================
CONTEÚDO
========================================== */
.hero_content {
position: relative;
z-index: 2;
width: 100%;
display: flex;
justify-content: flex-start;
align-items: center;
text-align: left;
}
/* CONTAINER */
.hero_container {
width: 100%;
max-width: 1200px;
margin-left: auto;
margin-right: auto;
padding: 120px 40px 80px;
text-align: left;
}
/* ==========================================
TAGLINE — GLASS PILL
========================================== */
.hero_tagline {
display: inline-flex;
align-items: center;
gap: 9px;
margin-top: -78px;
width: fit-content;
margin-bottom: 22px;
padding: 9px 15px;
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 999px;
background: rgba(255, 255, 255, 0.055);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.08),
0 6px 20px rgba(0, 0, 0, 0.12);
color: rgba(255, 255, 255, 0.78);
font-size: 10px;
font-weight: 600;
letter-spacing: 1.8px;
line-height: 1;
text-transform: uppercase;
white-space: nowrap;
}
/* PONTINHO */
.hero_tagline-dot {
width: 6px;
height: 6px;
flex-shrink: 0;
border-radius: 50%;
background: #5ee7df;
box-shadow:
0 0 8px rgba(94, 231, 223, 0.7);
}
@media screen and (max-width: 767px) {
.hero_tagline {
margin-bottom: 18px;
padding: 8px 12px;
font-size: 9px;
letter-spacing: 1.4px;
}
.hero_tagline-dot {
width: 5px;
height: 5px;
}
}
/* ==========================================
TÍTULO
========================================== */
.hero_title {
margin: 0;
max-width: 850px;
text-align: left;
font-size: clamp(2.5rem, 4vw, 4rem);
line-height: 1.08;
font-weight: 100;
letter-spacing: -1.8px;
color: #ffffff;
}
/* PRIMEIRA PARTE */
.hero_title-light {
display: block;
font-size: 1em;
font-weight: 100;
color: #ffffff;
text-align: left;
}
/* SEGUNDA PARTE */
.hero_title-bold {
display: block;
margin-top: 0;
font-size: 1em;
font-weight: 700;
color: #91abd0;
text-align: left;
}
/* ==========================================
DESCRIÇÃO
========================================== */
.hero_description {
max-width: 300px;
margin-top: 4px;
margin-bottom: 0;
text-align: left;
font-size: clamp(1rem, 0.6vw + 0.6rem, 1.125rem);
line-height: 1.55;
font-weight: 80;
color: rgba(255, 255, 255, 0.68);
}
/* ==========================================
BOTÕES
========================================== */
.hero_buttons {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 24px;
margin-top: 4px;
text-align: left;
}
/* BOTÃO */
.hero_button {
min-width: 14rem;
min-height: 3.125rem;
padding: .75rem 1.25rem;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 10px;
text-decoration: none;
font-size: .9375rem;
line-height: 1.1;
transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}
/* ==========================================
BOTÃO PRINCIPAL
========================================== */
.hero_button-primary {
background: #1e2b42;
color: #ffffff;
border: 1px solid rgba(56, 189, 248, 0.8);
font-weight: 600;
}
.hero_button-primary:hover {
transform: translateY(-2px);
box-shadow:
0 10px 30px rgba(56, 189, 248, 0.25);
}
/* ==========================================
BOTÃO SECUNDÁRIO
========================================== */
.hero_button-secondary {
background: rgba(255, 255, 255, 0.04);
color: #ffffff;
border: 1px solid rgba(255, 255, 255, 0.22);
backdrop-filter: blur(8px);
font-weight: 500;
}
.hero_button-secondary:hover {
background: rgba(255, 255, 255, 0.09);
transform: translateY(-2px);
}
/* ==========================================
SCROLL
========================================== */
.scroll_wrapper {
position: absolute;
z-index: 3;
bottom: 30px;
left: 50%;
transform: translateX(-50%);
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
color: rgba(255, 255, 255, 0.65);
}
/* ==========================================
MOBILE
========================================== */
@media screen and (max-width: 767px) {
.section_hero {
min-height: 700px;
}
.hero_container {
padding: 140px 24px 90px;
margin-left: 0;
margin-right: 0;
text-align: left;
}
.hero_content {
text-align: left;
justify-content: flex-start;
align-items: center;
}
.hero_title {
max-width: 100%;
font-size: 2.375rem;
line-height: 1.1;
letter-spacing: -1px;
text-align: left;
}
.hero_description {
max-width: 100%;
font-size: 1rem;
line-height: 1.55;
text-align: left;
}
.hero_buttons {
width: 100%;
flex-direction: column;
align-items: stretch;
gap: 14px;
text-align: left;
}
.hero_button {
width: 100%;
min-width: 0;
}
.scroll_wrapper {
display: none;
}
}
/* =========================================
HEADER GLASS
========================================= */
.navbar_nav {
position: fixed;
top: 16px;
left: 0;
right: 0;
z-index: 9999;
background: rgba(5, 12, 28, 0.72);
backdrop-filter: blur(18px);
-webkit-backdrop-filter: blur(18px);
border: 1px solid rgba(255, 255, 255, 0.10);
box-shadow:
0 8px 32px rgba(0, 0, 0, 0.25),
inset 0 1px 0 rgba(255, 255, 255, 0.06);
border-radius: 18px;
width: calc(100% - 48px);
max-width: 1700px;
margin: 0 auto;
overflow: hidden;
}
/* CONTAINER */
.navbar_container {
width: 100%;
max-width: none;
padding: 0 28px;
}
/* CONTEÚDO */
.navbar_content {
min-height: 88px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 40px;
}
/* LOGO */
.brand_logo {
width: 180px;
height: auto;
display: block;
}
/* MENU */
.navbar_menu {
display: flex;
align-items: center;
justify-content: center;
gap: 42px;
margin-left: auto;
}
/* LINKS */
.navbar_link {
color: rgba(255, 255, 255, 0.90);
font-size: 16px;
font-weight: 400;
text-decoration: none;
transition:
color 0.25s ease,
opacity 0.25s ease;
}
.navbar_link:hover {
color: #5ee7df;
}
/* BOTÃO */
.navbar_right {
display: flex;
align-items: center;
}
.navbar_button {
min-width: 250px;
height: 54px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 12px;
background: rgba(32, 71, 119, 0.85);
border: 1px solid rgba(91, 156, 220, 0.12);
color: #ffffff;
text-decoration: none;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.04),
0 8px 24px rgba(0, 0, 0, 0.15);
transition:
background 0.25s ease,
transform 0.25s ease;
}
.navbar_button:hover {
background: rgba(40, 88, 145, 0.95);
transform: translateY(-1px);
}
/* =========================================
EFEITO DE LUZ AZUL NO GLASS
========================================= */
.navbar_nav::before {
content: "";
position: absolute;
width: 280px;
height: 120px;
left: 18%;
top: -80px;
background: rgba(30, 100, 190, 0.25);
filter: blur(60px);
pointer-events: none;
}
/* =========================================
MOBILE
========================================= */
@media screen and (max-width: 991px) {
.navbar_nav {
width: calc(100% - 24px);
top: 12px;
border-radius: 16px;
}
.navbar_container {
padding: 0 18px;
}
.navbar_content {
min-height: 76px;
}
.brand_logo {
width: 150px;
}
.navbar_menu,
.navbar_right {
display: none;
}
.navbar_burger {
display: flex;
}
}
/* =====================================================
HERO NÃO FICA POR CIMA DO HEADER
===================================================== */
#home.section_hero {
position: relative !important;
z-index: 1 !important;
height: calc(100vh - (var(--dl-nav-top) + var(--dl-nav-min-h))) !important;
min-height: 570px !important;
margin-top: calc(var(--dl-nav-top) + var(--dl-nav-min-h)) !important;
}
:root {
--dl-shell-padding: clamp(0.75rem, 2.5vw, 1.5rem);
--dl-container-padding: clamp(1rem, 4vw, 2.5rem);
--dl-nav-top: 1rem;
--dl-nav-min-h: 5.5rem;
}
@media screen and (max-width: 991px) {
:root {
--dl-nav-top: .75rem;
--dl-nav-min-h: 4.75rem;
}
}
@media screen and (max-width: 479px) {
:root {
--dl-shell-padding: .625rem;
--dl-container-padding: 1rem;
}
}
@media screen and (max-width: 320px) {
:root {
--dl-container-padding: .875rem;
}
}
@media screen and (max-width: 360px) {
:root {
--dl-nav-min-h: 4.25rem;
}
}
body {
overflow-x: hidden;
}
.navbar_nav {
top: var(--dl-nav-top);
width: calc(100% - (var(--dl-shell-padding) * 2));
}
.navbar_container {
padding-left: var(--dl-container-padding);
padding-right: var(--dl-container-padding);
}
.navbar_content {
min-height: var(--dl-nav-min-h);
gap: clamp(1rem, 3vw, 2.5rem);
}
.brand_logo {
width: clamp(8.75rem, 16vw, 11.25rem) !important;
}
.hero_container {
padding-left: var(--dl-container-padding);
padding-right: var(--dl-container-padding);
}
.section {
padding-top: clamp(3rem, 7vw, 5rem);
padding-bottom: clamp(3rem, 7vw, 5rem);
}
.testimonials_component {
width: 100%;
}
.testimonials02_marquee {
max-width: 100%;
overflow: hidden;
}
@media screen and (max-width: 991px) {
.testimonials_component {
max-width: 100%;
}
}
@media screen and (max-width: 360px) {
.hero_tagline {
white-space: normal;
width: 100%;
}
.hero_title {
font-size: 2.125rem;
}
}
@media screen and (max-width: 1024px) and (orientation: landscape) {
.hero_container {
padding-top: clamp(6rem, 14vh, 8.5rem);
padding-bottom: clamp(3rem, 10vh, 5rem);
}
}
@media screen and (max-width: 1024px) and (orientation: portrait) {
.hero_container {
padding-top: clamp(7rem, 18vh, 9rem);
padding-bottom: clamp(3.5rem, 10vh, 5.5rem);
}
}
@media screen and (min-width: 1920px) {
.hero_container {
max-width: 80rem;
}
}
/* =====================================================
DIRETRIZ LAB — CAMADA RESPONSIVA GLOBAL
Celular, tablet, notebook pequeno e desktop grande
===================================================== */
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
overflow-x: hidden;
-webkit-text-size-adjust: 100%;
}
.page-wrapper {
width: 100%;
max-width: 100%;
overflow-x: hidden;
}
img,
svg,
video:not(.hero_bg-video) {
max-width: 100%;
height: auto;
}
.hero_bg-video {
width: 100%;
height: 100%;
max-width: none;
object-fit: cover;
}
.container,
.w-container,
.section,
.hero_container,
.navbar_container {
min-width: 0;
}
#home.section_hero {
height: auto !important;
min-height: calc(100svh - (var(--dl-nav-top) + var(--dl-nav-min-h))) !important;
margin-top: calc(var(--dl-nav-top) + var(--dl-nav-min-h)) !important;
overflow: visible !important;
}
.navbar_nav {
height: auto;
overflow: visible;
max-width: min(1700px, calc(100% - (var(--dl-shell-padding) * 2)));
}
.navbar_button,
.navbar_right .button {
min-width: 0;
width: auto;
max-width: 100%;
}
.hero_tagline {
max-width: 100%;
white-space: normal;
margin-top: 0;
}
.hero_title {
max-width: 100%;
font-size: clamp(1.85rem, 4.4vw + 0.6rem, 4rem);
letter-spacing: -0.04em;
overflow-wrap: anywhere;
}
.hero_description {
max-width: min(37.5rem, 100%);
}
.hero_buttons {
flex-wrap: wrap;
width: 100%;
}
.hero_button {
min-width: min(14rem, 100%);
}
.grid {
min-width: 0;
}
#how-it-works .card,
#how-it-works .card .step_content {
min-width: 0;
}
.about-person-card {
height: auto;
min-height: 22rem;
}
.waitlist_form {
grid-template-columns: minmax(0, 1fr) auto;
}
/* Notebooks menores: menu compacto para caber logo + links + CTA */
@media screen and (max-width: 1280px) {
.navbar_content {
gap: 1rem;
}
.navbar_menu {
gap: clamp(0.75rem, 1.8vw, 1.75rem);
margin-right: 1rem;
}
.navbar_link {
font-size: 0.8125rem;
}
.navbar_right .button {
min-width: 0;
padding: 0 1rem;
height: 2.75rem;
}
#how-it-works .w-layout-grid.grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 1.25rem !important;
}
}
@media screen and (max-width: 1100px) {
.grid:not(.is-legal) {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.footer_top {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2rem 1.5rem;
}
}
@media screen and (max-width: 991px) {
.navbar_nav {
overflow: visible;
height: auto;
}
.navbar_content {
position: relative;
min-height: var(--dl-nav-min-h);
gap: 0.75rem;
}
.navbar_content {
flex-wrap: wrap;
}
.navbar_menu {
display: none;
flex-direction: column;
align-items: stretch;
justify-content: flex-start;
gap: 0;
width: 100%;
margin: 0;
padding: 1rem 1.25rem 1.5rem;
}
.navbar_menu[data-nav-menu-open],
.w-nav-overlay .navbar_menu {
display: flex !important;
background: rgba(5, 12, 28, 0.97);
max-height: min(70vh, 28rem);
overflow-y: auto;
}
.w-nav-overlay {
width: 100%;
background: rgba(2, 6, 23, 0.55) !important;
}
.navbar_link {
white-space: normal;
padding: 0.85rem 0.25rem;
font-size: 1rem;
line-height: 1.3;
}
.navbar_link::after {
display: none;
}
.navbar_right {
display: none;
width: 100%;
order: 11;
padding-bottom: 0.85rem;
}
.navbar_nav.w--open .navbar_right {
display: flex;
}
.navbar_nav.w--open .navbar_right .button {
width: 100%;
justify-content: center;
}
.navbar_burger {
display: flex;
width: 2.75rem;
height: 2.75rem;
align-items: center;
justify-content: center;
cursor: pointer;
}
.navbar_burger .navbar_line-top,
.navbar_burger .navbar_line-middle,
.navbar_burger .navbar_line-bottom {
flex: 0 0 2px;
height: 2px;
background-color: #fff;
}
.navbar_burger-wrap {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
width: 1.375rem;
height: 0.875rem;
}
.navbar_line-top,
.navbar_line-middle,
.navbar_line-bottom {
width: 1.375rem;
height: 2px;
background-color: #fff !important;
border-radius: 99px;
}
.navbar_burger {
position: relative;
z-index: 10001;
}
.hero_container {
padding: clamp(1.5rem, 6vh, 4.5rem) var(--dl-container-padding) clamp(2.5rem, 8vh, 5rem);
}
.hero_buttons {
flex-direction: column;
align-items: stretch;
}
.hero_button {
width: 100%;
min-width: 0;
}
.grid,
.grid.is-pricing,
.grid.is-bento,
.grid.gap-small.is-team,
.grid.is-blog {
grid-template-columns: 1fr;
}
.features_tab-grid {
display: flex;
flex-direction: column;
}
.solution_item {
grid-template-columns: 1fr;
}
.about-people-grid {
grid-template-columns: 1fr;
}
.waitlist_form {
grid-template-columns: 1fr;
}
#how-it-works .card {
height: auto !important;
min-height: 0 !important;
max-height: none !important;
}
#how-it-works .step_content {
padding: 1.75rem 1.35rem !important;
}
}
@media screen and (max-width: 767px) {
.section_hero {
min-height: 0;
}
.hero_container {
padding-top: 1.75rem;
padding-bottom: 3.5rem;
margin-left: 0;
margin-right: 0;
}
.hero_title {
font-size: clamp(1.7rem, 8vw, 2.35rem);
line-height: 1.12;
letter-spacing: -0.03em;
}
#how-it-works .w-layout-grid.grid {
grid-template-columns: 1fr !important;
}
.footer_top {
grid-template-columns: 1fr;
}
.stats_grid {
display: flex;
flex-direction: column;
}
}
@media screen and (max-width: 479px) {
.hero_tagline {
font-size: 0.5625rem;
letter-spacing: 0.08em;
padding: 0.5rem 0.75rem;
}
.about-person-card {
min-height: 18rem;
}
#how-it-works .card {
min-height: 0 !important;
}
}
@media screen and (max-width: 360px) {
.hero_title {
font-size: 1.55rem;
}
.brand_logo {
width: clamp(7.5rem, 48vw, 9.5rem) !important;
}
}
@media screen and (max-width: 1024px) and (orientation: landscape) {
#home.section_hero {
min-height: auto !important;
}
.hero_container {
padding-top: 1.25rem;
padding-bottom: 2.5rem;
}
}
@media screen and (min-width: 1440px) {
.hero_container {
max-width: 75rem;
}
}
@media screen and (min-width: 1920px) {
.navbar_nav {
max-width: 108rem;
}
.hero_container {
max-width: 80rem;
}
.container {
max-width: 80rem;
}
}
:root {
--dl-text-body: 1rem;
--dl-text-small: 1rem;
--dl-text-caption: 0.875rem;
--dl-heading-1: clamp(2rem, 1.6rem + 2vw, 3rem);
--dl-heading-2: clamp(1.75rem, 1.5rem + 1vw, 2.25rem);
--dl-heading-3: clamp(1.25rem, 1.125rem + 0.5vw, 1.5rem);
--dl-text-subtle: #c4cad6;
}
body {
font-size: var(--dl-text-body);
line-height: 1.6;
}
h1:not(.hero_title),
.heading-style-h1 {
font-size: var(--dl-heading-1);
line-height: 1.15;
}
h2,
.heading-style-h2 {
font-size: var(--dl-heading-2);
line-height: 1.25;
}
h3,
.heading-style-h3 {
font-size: var(--dl-heading-3);
line-height: 1.3;
}
.text-size-small {
font-size: var(--dl-text-small);
line-height: 1.5;
}
.text-size-xsmall {
font-size: var(--dl-text-caption);
line-height: 1.45;
}
.button_text,
.outcome_pill {
font-size: var(--dl-text-caption);
}
.text-color-subtle,
label,
.navbar_link {
color: var(--dl-text-subtle);
}
.navbar_link {
font-size: 0.875rem;
}
.hero_tagline {
max-width: 100%;
font-size: 0.875rem;
letter-spacing: 0;
white-space: normal;
background: rgba(8, 14, 27, 0.9);
color: #f1f5fb;
}
.hero_title {
font-size: clamp(1.75rem, 1.2rem + 2.25vw, 3.25rem);
line-height: 1.1;
letter-spacing: 0;
overflow-wrap: normal;
}
.hero_description {
font-size: clamp(1rem, 0.35vw + 0.95rem, 1.0625rem);
color: var(--dl-text-subtle);
}
.text-size-small.text-color-subtle.is-darker,
.text-size-small.opacity-50 {
opacity: 1;
}
.solution_card_tag,
.solution_card_footer,
.about-person-caption-role,
.about-person-role {
font-size: var(--dl-text-caption);
letter-spacing: 0;
line-height: 1.4;
}
.solution_card_text p,
.about-person-description,
.about-mission p,
.about-intro {
font-size: var(--dl-text-body);
}
.about-mission-title {
font-size: var(--dl-text-body);
}
.navbar_link {
min-height: 2.75rem;
}
#home.section_hero {
height: auto !important;
min-height: max(24rem, 100vh) !important;
min-height: max(24rem, 100svh) !important;
margin-top: 0 !important;
}
@media screen and (max-width: 1024px) {
#home .hero_container {
padding-top: calc(var(--dl-nav-top) + var(--dl-nav-min-h) + 1rem) !important;
}
}
section[id],
.section_footer[id] {
scroll-margin-top: 1.5rem;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[role="button"]:focus-visible,
[tabindex="0"]:focus-visible {
outline: 3px solid #8bd5ff;
outline-offset: 3px;
}
.form_input:focus-visible {
border-color: #8bd5ff;
}
.solution_card:focus .solution_overlay,
.solution_card:focus-within .solution_overlay,
.about-person-card:focus .about-person-overlay,
.about-person-card:focus-within .about-person-overlay {
transform: translateY(0);
opacity: 1;
visibility: visible;
}
@media (hover: none), (pointer: coarse) {
.solution_card {
height: auto;
display: flex;
flex-direction: column;
}
.solution_image_wrap {
position: relative;
inset: auto;
height: 15rem;
flex: none;
}
.solution_card::after,
.solution_icon {
display: none;
}
.solution_overlay {
position: relative;
inset: auto;
padding: 1.25rem;
transform: none !important;
opacity: 1 !important;
visibility: visible !important;
}
.solution_card:hover .solution_image,
.about-person-card:hover .about-person-image {
transform: none !important;
filter: none !important;
}
.about-person-card {
height: auto;
min-height: 0;
}
.about-person-image-wrap {
height: auto;
}
.about-person-image {
position: relative;
aspect-ratio: 1 / 1.1;
}
.about-person-caption {
display: none;
}
.about-person-overlay {
position: relative;
inset: auto;
padding: 1.25rem;
opacity: 1 !important;
visibility: visible !important;
background: #020617;
}
.about-person-info {
transform: none !important;
}
}
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
scroll-behavior: auto !important;
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
}
}
.faq_title {
appearance: none;
width: 100%;
min-height: 2.75rem;
border: 0;
background: transparent;
color: var(--scheme--text);
font: inherit;
text-align: left;
}
.faq_content {
transition: height 0.3s ease;
}
@media screen and (max-width: 991px) {
.solution_grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1.25rem;
}
}
@media screen and (max-width: 767px) {
.solution_grid {
grid-template-columns: 1fr;
}
}
.navbar_nav:has(.navbar_burger[aria-expanded="true"]) .navbar_right {
position: relative;
z-index: 10002;
display: flex;
width: 100%;
order: 11;
padding-bottom: 0.85rem;
}
.navbar_nav:has(.navbar_burger[aria-expanded="true"]) .navbar_right .button {
width: 100%;
justify-content: center;
}
@media screen and (min-width: 992px) {
:root {
--dl-nav-min-h: 5rem;
}
.navbar_nav {
height: 5rem;
}
}
body.diagnostic-page {
min-height: 100vh;
color: #f1f5fb;
background-color: #080e1b;
background-image:
linear-gradient(135deg, rgba(14, 34, 62, 0.72), transparent 42%),
repeating-linear-gradient(0deg, rgba(120, 160, 205, 0.025) 0, rgba(120, 160, 205, 0.025) 1px, transparent 1px, transparent 52px);
font-family: Manrope, Arial, sans-serif;
}
.diagnostic-shell {
width: min(100% - 3rem, 88rem);
min-height: 100vh;
margin: 0 auto;
}
.diagnostic-header {
min-height: 5rem;
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
border-bottom: 1px solid rgba(161, 181, 209, 0.16);
}
.diagnostic-brand {
display: inline-flex;
align-items: center;
flex: none;
}
.diagnostic-brand img {
display: block;
width: 10.5rem;
height: auto;
}
.diagnostic-back-link {
min-width: 12.125rem;
min-height: 3rem;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 1.5rem;
border: 0;
border-radius: 9px;
color: #fff;
background: #17365d;
font-size: 0.8125rem;
font-weight: 500;
line-height: 1;
text-decoration: none;
white-space: nowrap;
transition: background 0.25s ease, transform 0.25s ease;
}
.diagnostic-back-link:hover {
color: #fff;
background: #1e4778;
transform: translateY(-1px);
}
.diagnostic-main {
width: min(100%, 60rem);
padding: clamp(2rem, 5vh, 4rem) 0 5rem;
margin: 0 auto;
}
.diagnostic-form-kicker {
margin: 0;
color: #8fa8c9;
font-size: 0.8125rem;
font-weight: 700;
line-height: 1.4;
}
.diagnostic-form-panel {
min-width: 0;
padding: clamp(1.25rem, 3vw, 2.5rem);
border: 1px solid rgba(147, 170, 205, 0.22);
border-radius: 0.5rem;
background: rgba(8, 15, 29, 0.9);
box-shadow: 0 1.5rem 5rem rgba(0, 0, 0, 0.2);
animation: diagnostic-enter 0.6s 0.08s ease both;
}
.diagnostic-form-heading {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 1rem;
margin-bottom: 1.75rem;
padding-bottom: 1.25rem;
border-bottom: 1px solid rgba(161, 181, 209, 0.16);
}
.diagnostic-form-kicker {
margin-bottom: 0.5rem;
color: #74d8d5;
}
.diagnostic-form-heading h1,
.diagnostic-form-heading h2 {
margin: 0;
color: #f1f5fb;
font-size: 1.5rem;
font-weight: 600;
line-height: 1.25;
}
.diagnostic-required-note {
flex: none;
margin: 0 0 0.15rem;
color: #b6c2d3;
font-size: 0.8125rem;
line-height: 1.4;
}
.diagnostic-required-note span,
.diagnostic-field label span,
.diagnostic-fieldset legend span {
color: #7fe5e0;
}
.diagnostic-form {
display: flex;
flex-direction: column;
gap: 1.35rem;
}
.diagnostic-field-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1.1rem 1rem;
}
.diagnostic-field {
min-width: 0;
}
.diagnostic-field label,
.diagnostic-fieldset legend {
display: block;
margin: 0 0 0.45rem;
color: #e1e8f2;
font-size: 0.875rem;
font-weight: 600;
line-height: 1.45;
}
.diagnostic-field input,
.diagnostic-field select,
.diagnostic-field textarea {
display: block;
width: 100%;
min-width: 0;
min-height: 3rem;
padding: 0.75rem 0.875rem;
border: 1px solid #39465c;
border-radius: 0.25rem;
outline: none;
color: #f1f5fb;
background: #0d1627;
font: inherit;
font-size: 0.9375rem;
line-height: 1.45;
transition: border-color 0.18s ease, background-color 0.18s ease;
}
.diagnostic-field textarea {
min-height: 7rem;
resize: vertical;
}
.diagnostic-field input::placeholder,
.diagnostic-field textarea::placeholder {
color: #8998ad;
opacity: 1;
}
.diagnostic-field select:invalid {
color: #a6b2c4;
}
.diagnostic-field option {
color: #f1f5fb;
background: #0d1627;
}
.diagnostic-field input:focus,
.diagnostic-field select:focus,
.diagnostic-field textarea:focus {
border-color: #69d8d4;
background: #101d31;
}
.diagnostic-field input:focus-visible,
.diagnostic-field select:focus-visible,
.diagnostic-field textarea:focus-visible,
.diagnostic-choice input:focus-visible,
.diagnostic-submit:focus-visible,
.diagnostic-back-link:focus-visible,
.diagnostic-brand:focus-visible {
outline: 3px solid #8bd5ff;
outline-offset: 3px;
}
.diagnostic-fieldset {
min-width: 0;
margin: 0;
padding: 0;
border: 0;
}
.diagnostic-fieldset legend {
padding: 0;
}
.diagnostic-field-hint {
margin: -0.15rem 0 0.8rem;
color: #aebbd0;
font-size: 0.875rem;
line-height: 1.5;
}
.diagnostic-choice-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.6rem;
}
.diagnostic-choice {
min-height: 3.25rem;
display: flex;
align-items: center;
gap: 0.7rem;
margin: 0;
padding: 0.7rem 0.8rem;
border: 1px solid #344157;
border-radius: 0.25rem;
color: #d9e2ef;
background: #0c1525;
font-size: 0.875rem;
font-weight: 500;
line-height: 1.4;
cursor: pointer;
}
.diagnostic-choice:has(input:checked) {
border-color: #65d6d1;
background: #10232f;
color: #f4fbff;
}
.diagnostic-choice input {
width: 1.125rem;
height: 1.125rem;
flex: none;
margin: 0;
accent-color: #53cbc7;
}
.diagnostic-field-narrow {
max-width: 23rem;
}
.diagnostic-privacy-note {
margin: 0;
color: #aebbd0;
font-size: 0.875rem;
line-height: 1.55;
}
.diagnostic-submit {
min-height: 3.25rem;
display: inline-flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
padding: 0.8rem 1.1rem;
border: 1px solid #267b9c;
border-radius: 0.25rem;
color: #fff;
background: #17446b;
font: inherit;
font-size: 1rem;
font-weight: 700;
line-height: 1.3;
cursor: pointer;
transition: background-color 0.18s ease, border-color 0.18s ease;
}
.diagnostic-submit:hover {
border-color: #54c9c7;
background: #1a5575;
}
.diagnostic-status {
margin: 0;
padding: 0.9rem 1rem;
border: 1px solid #3c9b87;
border-radius: 0.25rem;
color: #d6fff2;
background: #0e302d;
font-size: 0.9375rem;
line-height: 1.5;
}
.diagnostic-status:focus {
outline: 3px solid #8bd5ff;
outline-offset: 3px;
}
@keyframes diagnostic-enter {
from {
opacity: 0;
transform: translateY(0.5rem);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@media screen and (max-width: 900px) {
.diagnostic-main {
padding-top: 2rem;
}
}
@media screen and (max-width: 800px) {
.diagnostic-field-grid,
.diagnostic-choice-grid {
grid-template-columns: minmax(0, 1fr);
}
}
@media screen and (max-width: 560px) {
.diagnostic-shell {
width: min(100% - 2rem, 88rem);
}
.diagnostic-header {
min-height: 4.5rem;
}
.diagnostic-brand img {
width: 8.75rem;
}
.diagnostic-back-link {
min-width: 8rem;
min-height: 2.75rem;
padding: 0 0.75rem;
font-size: 0.8125rem;
}
}
@media screen and (max-width: 360px) {
.diagnostic-brand img {
width: 6.75rem;
}
.diagnostic-back-link {
min-width: 7.5rem;
padding: 0 0.6rem;
font-size: 0.75rem;
}
.diagnostic-main {
padding-top: 1.5rem;
}
.diagnostic-form-panel {
padding: 1.125rem;
}
.diagnostic-form-heading {
align-items: flex-start;
flex-direction: column;
gap: 0.5rem;
margin-bottom: 1.25rem;
}
.diagnostic-form-heading h1,
.diagnostic-form-heading h2 {
font-size: 1.25rem;
}
.diagnostic-field-grid,
.diagnostic-choice-grid {
grid-template-columns: minmax(0, 1fr);
}
.diagnostic-field-narrow {
max-width: none;
}
}
@media (prefers-reduced-motion: reduce) {
.diagnostic-form-panel {
animation: none;
}
}
.about-person-card {
height: auto;
min-height: 0;
display: flex;
flex-direction: column;
padding: 1.25rem;
border-radius: 0.5rem;
text-align: left;
}
.about-person-image-wrap {
height: 13rem;
display: flex;
align-items: center;
justify-content: center;
border-radius: 0.25rem;
background: linear-gradient(145deg, #0d182b, #142239);
}
.about-person-image-wrap::after {
display: none;
}
.about-person-image {
position: static;
inset: auto;
width: min(100% - 3rem, 14rem);
height: auto;
object-fit: contain;
transform: none;
filter: none;
}
.about-person-caption {
display: none;
}
.about-person-overlay {
position: static;
inset: auto;
display: block;
padding: 1.25rem 0 0;
background: transparent;
opacity: 1;
visibility: visible;
transition: none;
}
.about-person-info {
transform: none;
}
.about-person-name {
font-size: 1.25rem;
}
.about-person-role {
font-size: 0.875rem;
letter-spacing: 0;
text-transform: none;
}
.about-person-description {
margin-top: 0.75rem;
font-size: 1rem;
line-height: 1.65;
}
.about-person-card:hover {
transform: none;
}
.about-person-card:hover .about-person-image {
transform: none;
filter: none;
}
.about-mission {
margin-top: clamp(3rem, 6vw, 5rem);
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
}
.about-mission-header {
max-width: 54rem;
margin: 0 auto clamp(2rem, 4vw, 3.5rem);
text-align: center;
}
.about-mission-kicker,
.about-pillar-index,
.methodology-eyebrow {
margin: 0 0 0.65rem;
color: #74d8d5;
font-size: 0.8125rem;
font-weight: 700;
line-height: 1.4;
}
.about-mission-kicker,
.methodology-eyebrow {
display: flex;
align-items: center;
justify-content: center;
gap: 0.6rem;
}
.about-mission-kicker span,
.methodology-eyebrow span {
width: 0.5rem;
height: 0.5rem;
flex: none;
border-radius: 50%;
background: #5ee7df;
}
.about-mission-title {
display: block;
max-width: 20ch;
margin: 0 auto;
color: #f1f5fb;
font-size: clamp(1.75rem, 1.45rem + 1.2vw, 2.5rem);
line-height: 1.2;
text-wrap: balance;
}
.about-mission-header > p:last-child {
max-width: 42rem;
margin: 0.75rem auto 0;
color: #bdc9da;
font-size: 1rem;
line-height: 1.6;
}
.about-pillars-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
border-top: 1px solid rgba(161, 181, 209, 0.2);
border-bottom: 1px solid rgba(161, 181, 209, 0.2);
}
.about-pillar {
min-width: 0;
padding: 1.5rem 1.25rem 1.75rem;
text-align: center;
}
.about-pillar:first-child {
padding-left: 1.25rem;
}
.about-pillar + .about-pillar {
border-left: 1px solid rgba(161, 181, 209, 0.2);
}
.about-pillar-index {
display: inline-block;
margin-bottom: 1.25rem;
color: #64d9d4;
}
.about-pillar h3 {
margin: 0 0 0.65rem;
color: #f1f5fb;
font-size: 1.125rem;
line-height: 1.35;
}
.about-pillar > p:last-child {
margin: 0;
color: #bdc9da;
font-size: 0.9375rem;
line-height: 1.6;
}
.about-mission-contact {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.35rem;
margin-top: 1.5rem;
padding-top: 1.25rem;
border-top: 1px solid rgba(161, 181, 209, 0.2);
}
.about-mission-contact p {
margin: 0;
color: #92a8c6;
font-size: 0.875rem;
font-weight: 600;
}
.about-mission-contact a {
color: #f1f5fb;
font-size: 1rem;
line-height: 1.5;
text-decoration: none;
overflow-wrap: anywhere;
}
.about-mission-contact a:hover {
color: #7fe5e0;
text-decoration: underline;
}
.about-mission-contact a:focus-visible {
outline: 3px solid #8bd5ff;
outline-offset: 3px;
}
.methodology-section {
background: #0b1423;
}
.methodology-header {
max-width: 54rem;
margin: 0 auto clamp(2rem, 4vw, 3.5rem);
text-align: center;
}
.methodology-eyebrow {
display: flex;
align-items: center;
justify-content: center;
gap: 0.6rem;
}
.methodology-eyebrow span {
width: 0.5rem;
height: 0.5rem;
flex: none;
border-radius: 50%;
background: #5ee7df;
}
.methodology-header h2 {
max-width: 20ch;
margin: 0 auto;
color: #f1f5fb;
font-size: clamp(1.75rem, 1.45rem + 1.2vw, 2.5rem);
line-height: 1.2;
text-wrap: balance;
}
.methodology-header > p:last-child {
max-width: 42rem;
margin: 0.75rem auto 0;
color: #bdc9da;
font-size: 1rem;
line-height: 1.6;
}
.methodology-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
border-top: 1px solid rgba(161, 181, 209, 0.2);
border-bottom: 1px solid rgba(161, 181, 209, 0.2);
}
.methodology-step {
min-width: 0;
padding: 1.5rem 1.25rem 1.75rem;
text-align: center;
}
.methodology-step:first-child {
padding-left: 1.25rem;
}
.methodology-step + .methodology-step {
border-left: 1px solid rgba(161, 181, 209, 0.2);
}
.methodology-number {
display: inline-block;
margin-bottom: 1.25rem;
color: #64d9d4;
font-size: 1rem;
font-weight: 700;
}
.methodology-step h3 {
margin: 0 0 0.65rem;
color: #f1f5fb;
font-size: 1.125rem;
line-height: 1.35;
}
.methodology-step p {
margin: 0;
color: #bdc9da;
font-size: 0.9375rem;
line-height: 1.6;
}
.footer-contact-email {
justify-self: end;
color: #f1f5fb;
font-size: 0.9375rem;
line-height: 1.5;
text-decoration: none;
overflow-wrap: anywhere;
}
.footer-contact-email:hover {
color: #7fe5e0;
text-decoration: underline;
}
@media screen and (max-width: 479px) {
.footer-content {
grid-template-columns: 1fr;
justify-items: center;
gap: 0.75rem;
}
.footer-brand,
.footer-contact-email {
justify-self: center;
}
.footer-logo {
width: 10rem;
}
}
@media screen and (max-width: 991px) {
.about-pillars-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.about-pillar:nth-child(3) {
padding-left: 1.25rem;
border-top: 1px solid rgba(161, 181, 209, 0.2);
border-left: 0;
}
.methodology-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.methodology-step:nth-child(3) {
padding-left: 0;
border-left: 0;
border-top: 1px solid rgba(161, 181, 209, 0.2);
}
.methodology-step:nth-child(4) {
border-top: 1px solid rgba(161, 181, 209, 0.2);
}
}
@media screen and (max-width: 767px) {
.about-pillars-grid {
grid-template-columns: minmax(0, 1fr);
}
.about-pillar,
.about-pillar + .about-pillar {
padding: 1.25rem 0;
border-left: 0;
}
.about-pillar + .about-pillar {
border-top: 1px solid rgba(161, 181, 209, 0.2);
}
.methodology-grid {
grid-template-columns: minmax(0, 1fr);
}
.methodology-step,
.methodology-step:first-child,
.methodology-step:nth-child(3) {
padding: 1.25rem 0;
border-left: 0;
}
.methodology-step + .methodology-step {
border-top: 1px solid rgba(161, 181, 209, 0.2);
}
}