@charset "UTF-8";
/*
Theme Name: Nestor Skills
Theme URI: 
Author: Nestor
Author URI: 
Description: 
Version: 1.0.0
License: 
License URI: 
Text Domain: 
Tags: 
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Root
# Typography
# UI
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Root
--------------------------------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,600;1,400;1,600&display=swap");

:root {
  --unit: 16px;
  --breakpoint-xs: 320px;
  --breakpoint-s: 480px;
  --breakpoint-m: 768px;
  --breakpoint-l: 1080px;
  --breakpoint-xl: 1440px;
  --bg: #fafafa;
  --white: #ffffff;
  --off-white: #f0f3ff;
  --light-grey: #acb4ce;
  --grey: #959cb6;
  --dark-grey: #3d4465;
  --off-black: #434349;
  --black: #000000;
  --lightest-primary: #e4e9fc;
  --primary: rgb(85, 120, 235);
  --light-primary: #708eee;
  --lightest-primary: rgba(221, 228, 251, 1);
  --lightest-complementary: #dde4fb;
  --complementary: rgb(100, 92, 161);
  --lightest-green: #dbf6f3;
  --green: rgb(29, 201, 183);
  --lightest-orange: #fff4dc;
  --orange: rgb(255, 184, 34);
  --yellow: rgb(255, 184, 34);
  --lightest-orange: #fff1d3;
  --lightest-yellow: #fff1d3;
  --lightest-red: #fddde2;
  --red: rgb(253, 57, 122);
  --elevation-0: 0 1px 0px rgba(0, 0, 0, 0.08);
  --elevation-1: 0 2px 8px rgba(0, 0, 0, 0.08);
  --elevation-2: 0 4px 16px rgba(0, 0, 0, 0.08);
  --elevation-3: 0 8px 24px rgba(0, 0, 0, 0.08);
  --info: #93a2dd;
}

html {
  scroll-behavior: smooth;
}

html,
body {
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-size: 16px;
  background-color: var(--bg);
  color: var(--dark-grey);
}

body {
  width: 100%;
  min-width: var(--breakpoint-xs);
  overflow-x: hidden;
}

@media (min-width: 960px) {
  body {
    font-size: 14px;
  }
}

body[data-overflow-lock="true"] {
  overflow-y: hidden;
}

figure {
  margin: 0;
  user-select: none;
}

fieldset {
  border: none;
  outline: none;
}

img {
  user-select: none;
}

* {
  /* perspective: 100vw; */
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

/*--------------------------------------------------------------
# Fonts
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Override
--------------------------------------------------------------*/

.wp-block-columns,
.wp-block-columns.ns-contain-xl {
  width: 100%;
  max-width: var(--breakpoint-xl);
  margin: 0 auto;
  padding: calc(var(--unit) * 2) 0;
  column-gap: var(--unit);
  row-gap: var(--unit);
}

.wp-block-columns.ns-contain-l {
  max-width: var(--breakpoint-l);
}

.wp-block-columns.ns-contain-m {
  max-width: var(--breakpoint-m);
}

.wp-block-columns.ns-contain-s {
  max-width: var(--breakpoint-s);
}

@media (min-width: 960px) {
  .wp-block-columns {
    padding: calc(var(--unit) * 4) 0;
  }
}

.wp-block-column {
  padding: var(--unit);
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
h1,
.ns-h1 {
  font-family: "Poppins", sans-serif;
  font-size: 3rem;
  font-weight: 600;
  line-height: 4rem;
  font-style: normal;
  margin: 0;
  padding: 0;
  text-wrap: balance;
}

blockquote,
h2,
.ns-h2 {
  font-family: "Poppins", sans-serif;
  font-size: 2rem;
  font-weight: 600;
  line-height: 3rem;
  font-style: normal;
  margin: 0;
  padding: 0;
  text-wrap: balance;
}

h3,
.ns-h3 {
  font-family: "Poppins", sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 2rem;
  font-style: normal;
  margin: 0;
  padding: 0;
  text-wrap: balance;
}

h4,
.ns-h4 {
  font-family: "Poppins", sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 2rem;
  font-style: normal;
  margin: 0;
  padding: 0;
  text-wrap: balance;
}

h5,
.ns-h5 {
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5rem;
  font-style: normal;
  margin: 0;
  padding: 0;
  text-wrap: balance;
}

h6,
.ns-h6 {
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5rem;
  font-style: normal;
  margin: 0;
  padding: 0;
  text-wrap: balance;
}

cite,
time,
p,
.ns-p {
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5rem;
  font-style: normal;
  margin: 0;
  padding: 0;
}

time,
p.ns-s,
.ns-p.ns-s,
cite {
  font-size: 0.875rem;
}

time,
cite {
  color: var(--grey);
}

p.ns-xs,
.ns-p.ns-xs {
  font-size: 0.75rem;
}

cite > strong,
p > strong,
.ns-p > strong {
  font-weight: 600;
}

a,
.ns-a {
  font-family: "Poppins", sans-serif;
  font-size: inherit;
  font-weight: 600;
  text-decoration: none;
  color: inherit;
}

/*--------------------------------------------------------------
# UI
--------------------------------------------------------------*/
.ns-card {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: fit-content;
  background-color: var(--white);
  border-radius: calc(var(--unit) * 1.5);
  padding: var(--unit);
  box-shadow: var(--elevation-2);
}

.ns-card[data-layout="columns"] {
  flex-direction: row;
}

.ns-nav {
  display: flex;
  width: 100%;
  height: calc(var(--unit) * 4);
  min-height: calc(var(--unit) * 4);
  align-items: center;
  column-gap: var(--unit);
}

.ns-nav > i {
  font-size: 1.5rem;
  margin: 0 var(--unit);
}

.ns-rows,
.ns-columns {
  display: flex;
  flex-direction: column;
}

.ns-rows.ns-reverse {
  flex-direction: column-reverse;
}

.ns-rows[data-layout="keep"] {
  flex-direction: column;
}

.ns-columns[data-layout="keep"] {
  flex-direction: row;
}

.ns-rows > * {
  flex: 1;
}

.ns-rows[data-children="free"] > *,
.ns-rows.ns-free > *,
.ns-columns[data-children="free"] > *,
.ns-columns.ns-free > * {
  flex: unset;
}

.ns-pad {
  padding: var(--unit);
}

.ns-rows-center {
  display: flex;
  justify-content: center;
}

.ns-rows-center > * {
  flex: unset;
}

.ns-columns-center {
  display: flex;
  align-items: center;
}

.ns-columns-center > * {
  flex: unset;
}

.ns-rows-gap {
  display: flex;
  row-gap: var(--unit);
}

.ns-columns-gap {
  display: flex;
  column-gap: var(--unit);
}

.ns-w-full {
  width: 100%;
}

.ns-pad-h {
  padding: 0 calc(var(--unit) * 0.5);
}

.ns-pad-v {
  padding: calc(var(--unit) * 0.5) 0;
}

.ns-columns.ns-pad-0 {
  padding: 0;
}

@media (min-width: 960px) {
  .ns-columns {
    flex-direction: row;
  }

  .ns-columns.ns-reverse {
    flex-direction: row-reverse;
  }

  .ns-columns > * {
    flex: 1;
  }
}

.ns-contain,
.ns-contain[data-contain="xl"] {
  width: 100%;
  max-width: var(--breakpoint-xl);
  margin: 0 auto;
  padding-left: var(--unit);
  padding-right: var(--unit);
}

.ns-contain[data-contain="l"] {
  max-width: var(--breakpoint-l);
}

.ns-contain[data-contain="m"] {
  max-width: var(--breakpoint-m);
}

.ns-contain[data-contain="s"] {
  max-width: var(--breakpoint-s);
}

@media (min-width: 960px) {
  .ns-contain {
    padding: 0 calc(var(--unit) * 2);
  }
}

ul,
ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

ul.ns-dots-nav {
  width: fit-content;
  height: fit-content;
  padding: var(--unit) 0;
  /* column-gap:  var(--unit); */
}

ul.ns-dots-nav,
ul.ns-dots-nav > li {
  display: flex;
}

ul.ns-dots-nav > li {
  width: calc(var(--unit) * 3);
  height: calc(var(--unit) * 3);
}

ul.ns-dots-nav > li > button {
  color: var(--grey);
  background-color: transparent;
  font-size: 1.2rem;
}

ul.ns-dots-nav > li > button:before {
  content: "○";
}

ul.ns-dots-nav > li > button[aria-selected="true"] {
  color: var(--dark-grey);
}

ul.ns-dots-nav > li > button[aria-selected="true"]:before {
  content: "●";
}

button {
  border: none;
  outline: none;
  appearance: none;
  cursor: pointer;
}

a.ns-button,
.ns-button {
  position: relative;
  display: flex;
  width: fit-content;
  min-width: fit-content; /* calc(var(--unit) * 3); */
  height: calc(var(--unit) * 3);
  min-height: calc(var(--unit) * 3);
  border-radius: calc(var(--unit) * 0.5);
  outline: 2px solid transparent;
  border: none;
  appearance: none;
  align-items: center;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  background-color: var(--white);
  cursor: pointer;
  column-gap: var(--unit);
  padding: 0 var(--unit);
  -webkit-tap-highlight-color: transparent;
  box-shadow: none;
  opacity: 1;
  color: inherit;
}

a.ns-button[hidden="true"],
.ns-button[hidden="true"] {
  display: none;
}

a.ns-button[data-size="s"],
.ns-button[data-size="s"] {
  height: calc(var(--unit) * 1.5);
  min-height: calc(var(--unit) * 1.5);
  font-size: 0.75rem;
  column-gap: calc(var(--unit) * 0.75);
  padding: 0 calc(var(--unit) * 0.75);
}

.ns-button,
.ns-button > span {
  text-align: left;
}

.ns-button > span,
.ns-button > i {
  color: inherit;
}

.ns-button > span {
  font-size: inherit;
}

.ns-button > i {
  font-size: 1.25rem;
}

a.ns-button.ns-primary,
.ns-button.ns-primary {
  outline-color: transparent;
  background-color: var(--primary);
  color: var(--white);
  box-shadow: var(--elevation-1);
}

a.ns-button.ns-primary-outline,
.ns-button.ns-primary-outline {
  outline-color: var(--primary);
  background-color: transparent;
  color: var(--primary);
}

a.ns-button.ns-complementary,
.ns-button.ns-complementary {
  outline-color: transparent;
  background-color: var(--complementary);
  color: var(--white);
}

a.ns-button.ns-complementary-outline,
.ns-button.ns-complementary-outline {
  outline-color: var(--complementary);
  background-color: transparent;
  color: var(--complementary);
}

a.ns-button.ns-red,
.ns-button.ns-red {
  outline-color: transparent;
  background-color: var(--red);
  color: var(--white);
}

a.ns-button.ns-red-outline,
.ns-button.ns-red-outline {
  outline-color: var(--red);
  background-color: transparent;
  color: var(--red);
}

a.ns-button.ns-white,
.ns-button.ns-white {
  outline-color: transparent;
  background-color: var(--white);
  color: var(--dark-grey);
}

a.ns-button.ns-white-outline,
.ns-button.ns-white-outline {
  outline-color: var(--white);
  background-color: transparent;
  color: var(--white);
}

a.ns-resource,
a.ns-main-menu-item,
a.ns-blog-post-item,
a.ns-button,
.ns-button {
  transform-origin: center center;
  /* transform: translate3d(0, 0, 0); */
  transform: scale(1);
  transition: transform 256ms ease-in-out, opacity 256ms ease-in-out;
  backface-visibility: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
}

a.ns-resource:hover,
a.ns-main-menu-item:hover,
a.ns-blog-post-item:hover,
a.ns-button:hover,
.ns-button:hover {
  /* transform: translate3d(0, 0, var(--unit)); */
}

@media (min-width: 960px) {
  a.ns-resource:hover,
  a.ns-main-menu-item:hover,
  a.ns-blog-post-item:hover,
  a.ns-button:hover,
  .ns-button:hover {
    cursor: pointer;
    transform: scale(1.016);
  }
}

a.ns-resource:focus,
a.ns-main-menu-item:focus,
a.ns-button:focus,
.ns-button:focus {
  /* transform: translate3d(0, 0, 0); */
  transform: scale(1);
}

a.ns-button[disabled],
.ns-button[disabled] {
  opacity: 0.64;
  cursor: default;
}

.ns-badge {
  display: flex;
  width: fit-content;
  min-height: calc(var(--unit) * 2);
  align-items: center;
  border-radius: var(--unit);
  background-color: var(--green);
  color: var(--dark-grey);
  font-weight: 400;
}

.ns-badge[hidden="true"] {
  display: none;
}

.ns-badge,
.ns-badge > span {
  padding: 0 calc(var(--unit) * 0.5);
  font-family: "Poppins", sans-serif;
  font-size: 0.75rem;
  font-weight: inherit;
}

.ns-badge > span {
  color: inherit;
  white-space: nowrap;
}

.ns-badge > i {
  margin: 0 var(--unit);
}

.ns-badge.ns-primary {
  background-color: var(--primary);
  color: var(--white);
}

.ns-badge.ns-green-inverse {
  background-color: var(--white);
  color: var(--green);
}

.ns-badge.ns-primary-inverse {
  background-color: var(--white);
  color: var(--primary);
}

.ns-badge.ns-article {
  background-color: var(--dark-grey);
  color: var(--white);
}

.ns-badge.ns-podcast {
  background-color: var(--red);
  color: var(--white);
}

.ns-badge.ns-community,
.ns-badge.ns-customer-story {
  background-color: var(--complementary);
  color: var(--white);
}

.ns-badge.ns-tag {
  background-color: var(--off-white);
  font-weight: 600;
}

.ns-elevation-none {
  box-shadow: none;
}

.ns-elevation-0 {
  box-shadow: var(--elevation-0);
}

.ns-elevation-1 {
  box-shadow: var(--elevation-1);
}

.ns-elevation-2 {
  box-shadow: var(--elevation-2);
}

.ns-page-banner {
  display: flex;
  width: 100%;
  /* height: calc(var(--unit) * 4); */
  min-height: calc(var(--unit) * 4);
  align-items: center;
  column-gap: var(--unit);
  background-color: var(--complementary);
  color: var(--white);
  padding: var(--unit);
}

.n-page-banner-content {
  width: 100%;
  max-width: var(--breakpoint-xl);
  padding: 0;
  margin: 0 auto;
  background: transparent;
}

.ns-emoji-icon > i {
  font-style: normal !important;
}

.ns-emoji-icon,
.ns-emoji-icon[data-size="s"] {
  display: flex;
  width: calc(var(--unit) * 2);
  height: calc(var(--unit) * 2);
  min-width: calc(var(--unit) * 2);
  min-height: calc(var(--unit) * 2);
  font-size: 1rem;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
}

.ns-emoji-icon[data-size="m"] {
  width: calc(var(--unit) * 3);
  height: calc(var(--unit) * 3);
  min-width: calc(var(--unit) * 3);
  min-height: calc(var(--unit) * 3);
  font-size: 1.5rem;
}

.ns-emoji-icon[data-size="l"] {
  width: calc(var(--unit) * 4);
  height: calc(var(--unit) * 4);
  min-width: calc(var(--unit) * 4);
  min-height: calc(var(--unit) * 4);
  font-size: 2rem;
}

.ns-footer {
  display: flex;
  flex-direction: column;
  background-color: var(--complementary);
  color: var(--white);
  padding: calc(var(--unit) * 2) 0;
}

.ns-footer,
.ns-footer > div.ns-columns,
.ns-footer > div.ns-columns > div {
  column-gap: var(--unit);
  row-gap: var(--unit);
}

.ns-footer > div.ns-columns > div {
  padding: calc(var(--unit) * 2);
  /* outline: 1px solid rgba(255, 255, 255, 0.08); */
  border-radius: var(--unit);
}

.ns-footer > div.ns-columns > div > * {
  flex: unset;
}

.ns-footer p {
  color: var(--grey);
}

.ns-footer .ns-footer-social {
  display: flex;
  column-gap: var(--unit);
  justify-content: flex-start;
}

@media (min-width: 960px) {
  .ns-footer .ns-footer-social {
    justify-content: flex-end;
  }
}

.ns-slant {
  position: relative;
}

.ns-slant:nth-child(n) {
  transform: rotate(-4deg);
}

.ns-sweep {
  --border-width: 1px;
}

.ns-sweep:after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: transparent;
  pointer-events: none;
  border: var(--border-width) solid;
  border-radius: inherit;
  overflow: hidden;
  opacity: 0;
}

@keyframes sweep {
  0% {
    border-color: var(--green);
    opacity: 0;
  }

  16% {
    border-color: var(--primary);
    opacity: 0.48;
  }

  32% {
    border-color: var(--red);
    opacity: 0;
  }

  100% {
    border-color: var(--green);
    opacity: 0;
  }
}

.ns-spacer {
  flex: 1 0 auto;
}

/*--------------------------------------------------------------
# Doodle
--------------------------------------------------------------*/
.ns-word-highlight {
  color: var(--green);
}

.ns-word-highlight::after {
  content: " ";
}

.ns-doodle-word-highlight {
  display: inline-block;
  width: fit-content;
  /* color: var(--green); */
  white-space: nowrap;
  text-shadow: -1px -1px 0 var(--bg), 1px -1px 0 var(--bg), -1px 1px 0 var(--bg),
    1px 1px 0 var(--bg);
  /* position: relative;
  transform: translate3d(0, 0, 0);
  z-index: 1; */
}

.ns-doodle-word-highlight-img {
  transform: translate(-50%, -50%);
  z-index: 0;
}

/* .ns-doodle-word-highlight::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 240px;
  height: 68px;
  transform: translate(-50%, -50%);
  content: url(/wp-content/themes/nestor-skills/inc/assets/doodles/highlight-word.svg);
  z-index: 0;
} */
/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/
/* 
# Hero
*/
.ns-hero,
.ns-vs-hero,
.ns-form-hero {
  position: relative;
  padding: calc(var(--unit) * 2) 0;
  background-position: 66% 50%;
  background-repeat: no-repeat;
}

.ns-vs-hero,
.ns-form-hero {
  background-color: var(--bg);
}

.ns-hero > header,
.ns-vs-hero > header,
.ns-form-hero > header {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: fit-content;
  row-gap: var(--unit);
}

@media (min-width: 960px) {
  .ns-hero > header,
  .ns-vs-hero > header,
  .ns-form-hero > header {
    flex-direction: row;
    height: 100%;
    height: 100vh;
    max-height: calc(var(--unit) * 42);
    column-gap: calc(var(--unit) * 2);
    padding: calc(var(--unit) * 2);
  }

  .ns-vs-hero > header,
  .ns-form-hero > header {
    /* height: fit-content; */
    height: fit-content;
    min-height: calc(var(--unit) * 28);
    min-height: calc(100dvh - var(--unit) * 26);
  }
}

.ns-hero > header > div,
.ns-vs-hero > header > div,
.ns-form-hero > header > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: calc(var(--unit) * 2);
}

.ns-hero > header > div.ns-square,
.ns-vs-hero > header > div.ns-square,
.ns-form-hero > header > div.ns-square {
  position: relative;
}

.ns-hero > header > div.ns-square .ns-ratio,
.ns-vs-hero > header > div.ns-square .ns-ratio,
.ns-form-hero > header > div.ns-square .ns-ratio {
  width: 100%;
  padding-top: calc(100% + var(--unit) * 5);
}

@media (min-width: 960px) {
  .ns-hero > header > div.ns-square .ns-ratio,
  .ns-vs-hero > header > div.ns-square .ns-ratio,
  .ns-form-hero > header > div.ns-square .ns-ratio {
    padding-top: 100%;
  }
}

.ns-hero > header > div.ns-square .ns-content,
.ns-vs-hero > header > div.ns-square .ns-content,
.ns-form-hero > header > div.ns-square .ns-content {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  flex-direction: column;
  row-gap: var(--unit);
}

.ns-hero > header > div.ns-square .ns-content > nav,
.ns-vs-hero > header > div.ns-square .ns-content > nav,
.ns-form-hero > header > div.ns-square .ns-content > nav {
  position: relative;
  overflow: visible;
}

.ns-hero > header > div.ns-square .ns-content > nav > figure.ns-hero-misc,
.ns-vs-hero > header > div.ns-square .ns-content > nav > figure.ns-hero-misc,
.ns-form-hero > header > div.ns-square .ns-content > nav > figure.ns-hero-misc {
  position: absolute;
  bottom: calc(var(--unit) * 3);
  right: 0;
  border-radius: var(--unit);
  box-shadow: var(--elevation-1);
}

.ns-hero
  > header
  > div.ns-square
  .ns-content
  > nav
  > figure.ns-hero-misc:before,
.ns-hero
  > header
  > div.ns-square
  .ns-content
  > nav
  > figure.ns-hero-misc:after {
  position: absolute;
  content: "✨";
}

.ns-hero
  > header
  > div.ns-square
  .ns-content
  > nav
  > figure.ns-hero-misc:before {
  font-size: 2.5rem;
  top: calc(var(--unit) * -2);
  left: calc(var(--unit) * 1);
}

.ns-hero
  > header
  > div.ns-square
  .ns-content
  > nav
  > figure.ns-hero-misc:after {
  font-size: 2.5rem;
  bottom: calc(var(--unit) * -1.5);
  right: calc(var(--unit) * 1);
}

.ns-hero > header > div.ns-square .ns-content > nav > figure.ns-hero-misc img {
  width: calc(var(--unit) * 16);
  height: calc(var(--unit) * 6);
  background-color: var(--white);
  object-fit: contain;
  border-radius: var(--unit);
}

@media (min-width: 960px) {
  .ns-hero > header > div.ns-square .ns-content {
    flex-direction: unset;
    row-gap: unset;
  }
}

.ns-hero > header > div.ns-square .ns-content > figure {
  position: relative;
  width: 100%;
  max-width: var(--breakpoint-s);
  height: fit-content;
  margin: 0 auto;
  overflow: visible;
}

.ns-hero > header > div.ns-square .ns-content > figure > img {
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 100%;
  overflow: hidden;
}

.ns-hero > header > div.ns-square .ns-content > figure > div {
  position: absolute;
}

.ns-hero
  > header
  > div.ns-square
  .ns-content
  > figure
  > div[data-doodle="kiss-kiss"] {
  top: var(--unit);
  right: 0;
}

.ns-hero
  > header
  > div.ns-square
  .ns-content
  > figure
  > div[data-doodle="swirly-arrow-bottom-left"] {
  bottom: var(--unit);
  left: calc(var(--unit) * 2);
}

.ns-hero .multi-line-fix {
  min-height: calc(var(--unit) * 8);
}

@media (min-width: 960px) {
  .ns-hero
    > header
    > div.ns-square
    .ns-content
    > figure
    > div[data-doodle="swirly-arrow-bottom-left"] {
    left: var(--unit);
  }
}

@media (min-width: 960px) {
  .ns-hero > header > div.ns-square .ns-content > nav {
    position: absolute;
    bottom: 0;
    left: 0;
  }
}

@media (min-width: 960px) {
  .ns-hero .multi-line-fix {
    min-height: unset;
  }
}

/* 
# Main Nav
*/
.ns-main-nav {
  min-width: var(--breakpoint-xs);
  height: calc(var(--unit) * 5);
  top: 0;
}

.ns-main-nav > div > button.ns-button-menu-cross {
  position: relative;
}

.ns-main-nav > div > button.ns-button-menu-cross > div {
  position: absolute;
  width: calc(var(--unit) * 1.5);
  height: calc(var(--unit) * 0.125);
  top: 50%;
  left: 50%;
  background-color: var(--dark-grey);
  transition: transform 256ms ease-in-out;
  transform-origin: center center;
}

.ns-main-nav > div > button.ns-button-menu-cross > div[data-first] {
  transform: rotate(0deg) translate3d(-50%, calc(var(--unit) * -0.5), 0);
}

.ns-main-nav
  > div
  > button.ns-button-menu-cross[aria-expanded="true"]
  > div[data-first] {
  transform: rotate(45deg) translate3d(-50%, calc(var(--unit) * 0.75), 0);
}

.ns-main-nav > div > button.ns-button-menu-cross > div[data-mid] {
  transform: rotate(0deg) translate3d(-50%, 0, 0);
}

.ns-main-nav
  > div
  > button.ns-button-menu-cross[aria-expanded="true"]
  > div[data-mid] {
  opacity: 0;
}

.ns-main-nav > div > button.ns-button-menu-cross > div[data-last] {
  transform: rotate(0deg) translate3d(-50%, calc(var(--unit) * 0.5), 0);
}

.ns-main-nav
  > div
  > button.ns-button-menu-cross[aria-expanded="true"]
  > div[data-last] {
  transform: rotate(-45deg) translate3d(-50%, calc(var(--unit) * -0.75), 0);
}

.ns-main-nav,
.ns-main-nav ~ div.ns-main-nav-content {
  position: sticky;
  background-color: var(--white);
  transform: translate3d(0, 0, 0);
  box-shadow: var(--elevation-0);
  z-index: 999;
}

/* .ns-main-nav[aria-expanded="true"] { } */
.ns-main-nav[aria-expanded="true"] ~ div.ns-main-nav-content {
  height: 100vh;
  height: calc(100vh - var(--unit) * 5);
  height: 100dvh;
  height: calc(100dvh - var(--unit) * 5);
  overflow-y: scroll;
  animation-fill-mode: forwards;
  /* justify-content: flex-start; */
  /* padding-bottom: calc(var(--unit) * 2); */
}

@media (max-width: 960px) {
  .ns-main-nav[aria-expanded="true"] ~ div.ns-main-nav-content > div {
    padding: var(--unit);
    box-shadow: var(--elevation-0);
  }

  .ns-main-nav[aria-expanded="true"]
    ~ div.ns-main-nav-content
    > div
    > button[aria-expanded="false"] {
    margin-bottom: 0;
  }

  .ns-main-nav[aria-expanded="true"] ~ div.ns-main-nav-content > div > button {
    font-size: 1.5rem;
    outline: none;
  }
}

@media (min-width: 960px) {
  .ns-main-nav[aria-expanded="true"] ~ div.ns-main-nav-content {
    /* height: var(--breakpoint-xs); */
    height: calc(var(--unit) * 22);
    overflow-y: hidden;
    /* padding-bottom: 0; */
  }
  .ns-main-nav[aria-expanded="true"]
    ~ div.ns-main-nav-content.ns-main-nav-content-xl {
    height: calc(var(--unit) * 24);
  }
}

.ns-main-nav ~ div.ns-main-nav-content {
  top: calc(var(--unit) * 5);
  width: 100%;
  height: 0;
  overflow: hidden;
  /* transition: height 256ms ease-in-out 256ms; */
}

@media (min-width: 960px) {
  .ns-main-nav ~ div.ns-main-nav-content {
    transition: height 256ms ease-in-out 256ms;
  }
}

/* .ns-main-nav~div.ns-main-nav-content, */
.ns-main-nav ~ div.ns-main-nav-content > div,
.ns-main-nav ~ div.ns-main-nav-content > div > div {
  column-gap: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 2);
}

@media (min-width: 960px) {
  .ns-main-nav ~ div.ns-main-nav-content,
  .ns-main-nav ~ div.ns-main-nav-content > div,
  .ns-main-nav ~ div.ns-main-nav-content > div > div {
    row-gap: var(--unit);
  }
}

.ns-main-nav ~ div.ns-main-nav-content > div {
  flex: unset;
  padding: calc(var(--unit) * 2) var(--unit);
  height: fit-content;
}

@media (min-width: 960px) {
  .ns-main-nav ~ div.ns-main-nav-content > div {
    display: none;
    flex: 1;
    height: inherit;
  }
}

.ns-main-nav ~ div.ns-main-nav-content > div[hidden] {
  display: none;
}

.ns-main-nav ~ div.ns-main-nav-content > div > button {
  width: 100%;
  margin-bottom: calc(var(--unit) * 2);
}

.ns-main-nav ~ div.ns-main-nav-content > div > button > span {
  flex: 1 0 auto;
}

.ns-main-nav ~ div.ns-main-nav-content > div > button + div,
.ns-main-nav ~ div.ns-main-nav-content > div > button + div > div {
  column-gap: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 2);
}

.ns-main-nav ~ div.ns-main-nav-content > div > button > i {
  transition: transform 256ms ease-in-out;
  transform: rotateZ(0deg);
}

.ns-main-nav
  ~ div.ns-main-nav-content
  > div
  > button[aria-expanded="true"]
  > i {
  transform: rotateZ(180deg);
}

.ns-main-nav ~ div.ns-main-nav-content > div > button + div,
.ns-main-nav
  ~ div.ns-main-nav-content
  > div
  > button[aria-expanded="false"]
  + div {
  display: none;
}

.ns-main-nav
  ~ div.ns-main-nav-content
  > div
  > button[aria-expanded="true"]
  + div {
  display: flex;
}

@media (min-width: 960px) {
  .ns-main-nav ~ div.ns-main-nav-content > div > button {
    display: none;
    visibility: hidden;
    margin-bottom: 0;
  }

  .ns-main-nav ~ div.ns-main-nav-content > div > button + div,
  .ns-main-nav
    ~ div.ns-main-nav-content
    > div
    > button[aria-expanded="false"]
    + div {
    display: flex;
  }
}

.ns-main-nav ~ div.ns-main-nav-content > div[aria-selected="true"] {
  display: flex;
}

.ns-main-nav > div > button,
.ns-main-nav > div > a {
  justify-self: flex-end;
}

.ns-main-nav > div > a {
  white-space: nowrap;
}

.ns-main-nav > div > div.ns-menu-horizontal {
  display: none;
  width: fit-content;
  column-gap: calc(var(--unit) * 2);
}

@media (min-width: 960px) {
  .ns-main-nav > div > div.ns-menu-horizontal {
    display: flex;
  }
}

.ns-main-nav > div > div.ns-menu-horizontal > * {
  flex: unset;
}

.ns-main-nav > div > div.ns-menu-horizontal > button[aria-selected="true"] {
  color: var(--primary);
}

@media (min-width: 960px) {
  #ns_main_nav_uuid_toggle {
    display: none;
  }
}

.ns-main-nav ~ div.ns-main-nav-content p.ns-s {
  /* padding: 0 var(--unit); */
  color: var(--grey);
}

.ns-main-nav ~ div.ns-main-nav-content .ns-main-menu-item {
  display: flex;
  column-gap: var(--unit);
  padding: 0 var(--unit);
  align-items: center;
}

.ns-main-nav ~ div.ns-main-nav-content .ns-main-menu-item > i {
  margin-right: var(--unit);
  font-size: 1.25rem;
}

.ns-main-nav ~ div.ns-main-nav-content .ns-main-menu-item .ns-rows > *,
.ns-main-nav ~ div.ns-main-nav-content .ns-main-menu-item .ns-emoji-icon {
  flex: unset;
}

.ns-main-nav .ns-logo {
  padding: 0;
}

@media (min-width: 960px) {
  .ns-main-nav .ns-logo {
    margin-right: var(--unit);
  }
}

@media (min-width: 384px) {
  .ns-main-nav .ns-logo[data-ui-min="true"] {
    display: none;
  }
}

.ns-main-nav .ns-logo[data-ui-min="false"] {
  display: none;
}

@media (min-width: 384px) {
  .ns-main-nav .ns-logo[data-ui-min="false"] {
    display: inline-block;
  }
}

/*
# Section Header
*/
.ns-section-header {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: calc(var(--unit) * 4) 0;
}

.ns-section-header > div {
  position: relative;
  row-gap: var(--unit);
}

@media (min-width: 960px) {
  .ns-section-header > div {
    align-items: center;
    text-align: center;
  }
}

.ns-section-header[data-bg="white"] {
  background-color: var(--white);
}

.ns-section-header > div > img {
  position: absolute;
  display: none;
  /* top: var(--unit); */
  bottom: calc(var(--unit) * -4);
  right: var(--unit);
  height: calc(var(--unit) * 4);
}

.ns-section-header[data-variant] > div > img {
  display: block;
}

@media (min-width: 960px) {
  .ns-section-header[data-variant="bang"] > div > img,
  .ns-section-header[data-variant="sparkles"] > div > img {
    right: unset;
    left: calc(var(--unit) * 2);
  }
}

@media (min-width: 960px) {
  .ns-section-header[data-variant="100"] > div > img,
  .ns-section-header[data-variant="bolt"] > div > img {
    right: calc(var(--unit) * 2);
  }
}

/*
# Integrations
*/
.ns-integrations {
  display: flex;
  flex-direction: column;
  height: calc(var(--unit) * 22);
  overflow: hidden;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

@keyframes integrations-carousel {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-100%);
  }
}

.ns-integrations-carousel {
  width: 100%;
  height: calc(var(--unit) * 12);
  min-height: calc(var(--unit) * 12);
  overflow: hidden;
  align-items: center;
}

.ns-integrations-carousel,
.ns-integrations-carousel > div {
  display: flex;
}

.ns-integrations-carousel > div {
  column-gap: calc(var(--unit) * 4);
  padding: 0 calc(var(--unit) * 2);
  width: fit-content;
  height: fit-content;
  transform: translateX(0);
  animation: integrations-carousel 16s linear infinite;
}

.ns-integrations-carousel > div[data-direction="reverse"] {
  animation: integrations-carousel 16s linear infinite reverse;
}

.ns-integrations-carousel > div > figure,
.ns-integrations-carousel > div > figure > img {
  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6);
  border-radius: var(--unit);
  box-shadow: var(--elevation-2);
}

.ns-integrations-carousel > div > figure > img {
  object-fit: contain;
}

/*
# CTA 
*/
.ns-cta {
  padding: calc(var(--unit) * 2) 0;
  background-position: 33% 50%;
  background-repeat: no-repeat;
}

.ns-cta > section {
  display: flex;
  flex-direction: column-reverse;
  width: 100%;
  height: fit-content;
  row-gap: var(--unit);
}

@media (min-width: 960px) {
  .ns-cta > section {
    flex-direction: row;
    height: 100%;
    height: 100vh;
    height: 100svh;
    max-height: calc(var(--unit) * 32);
    column-gap: calc(var(--unit) * 2);
  }
}

.ns-cta > section.ns-contain {
  max-width: var(--breakpoint-l);
}

.ns-cta > section > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: calc(var(--unit) * 2);
}

@media (min-width: 960px) {
  .ns-cta > section > div.ns-flex-2 {
    flex: 2;
  }
}

.ns-cta > section > div.ns-square {
  position: relative;
}

.ns-cta > section > div.ns-square .ns-ratio {
  width: 100%;
  padding-top: 100%;
}

.ns-cta > section > div.ns-square .ns-content {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

.ns-cta > section > div.ns-square .ns-content > figure {
  position: relative;
  width: 100%;
  max-width: var(--breakpoint-s);
  height: fit-content;
  margin: 0 auto;
  overflow: visible;
}

@media (min-width: 960px) {
  .ns-cta > section > div.ns-square .ns-content > figure {
    max-width: var(--breakpoint-xs);
  }
}

.ns-cta > section > div.ns-square .ns-content > figure > img {
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 100%;
  overflow: hidden;
}

.ns-cta > section > div.ns-square .ns-content > figure > div {
  position: absolute;
}

.ns-cta
  > section
  > div.ns-square
  .ns-content
  > figure
  > div[data-doodle="kiss-kiss"] {
  bottom: 0;
  right: var(--unit);
}

/*
# CTA Secondary
*/
.ns-cta-secondary {
  padding: calc(var(--unit) * 2);
  background-position: 66% 50%;
  background-repeat: no-repeat;
}

.ns-cta-secondary > section {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  width: 100%;
  height: fit-content;
  min-height: calc(var(--unit) * 20);
  row-gap: var(--unit);
  background-color: var(--primary);
  color: var(--white);
  padding: 0;
}

@media (min-width: 960px) {
  .ns-cta-secondary {
    padding: calc(var(--unit) * 4) calc(var(--unit) * 2);
  }

  .ns-cta-secondary > section {
    flex-direction: row;
    height: fit-content;
    min-height: calc(var(--unit) * 20);
    /* 
    height: 100vh;
    height: 100svh;
    max-height: calc(var(--unit) * 24); */
    column-gap: calc(var(--unit) * 2);
  }
}

.ns-cta-secondary > section.ns-contain {
  max-width: var(--breakpoint-l);
}

.ns-cta-secondary > section > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: calc(var(--unit) * 2);
}

.ns-cta-secondary > section > div.ns-flex-2 {
  padding: calc(var(--unit) * 2);
}

@media (min-width: 960px) {
  .ns-cta-secondary > section > div.ns-flex-2 {
    flex: 2;
  }
}

.ns-cta-secondary > section > div.ns-square {
  position: relative;
}

.ns-cta-secondary > section > div.ns-square .ns-ratio {
  width: 100%;
  padding-top: 100%;
}

.ns-cta-secondary > section > div.ns-square .ns-content {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: visible;
}

.ns-cta-secondary > section > div.ns-square .ns-content > figure {
  position: absolute;
  top: calc(var(--unit) * -1);
  left: calc(var(--unit) * -1);
  width: 100%;
  width: calc(100% + calc(var(--unit) * 2));
  height: 100%;
  height: calc(100% + calc(var(--unit) * 2));
  overflow: visible;
}

@media (min-width: 960px) {
  /* .ns-cta-secondary>section>div.ns-square .ns-content>figure {
  } */
}

.ns-cta-secondary > section > div.ns-square .ns-content > figure > img {
  width: 100%;
  height: auto;
  object-fit: contain;
  /* border-radius: 100%; */
  overflow: hidden;
}

.ns-cta-secondary > section > div.ns-square .ns-content > figure > div {
  position: absolute;
}

.ns-cta-secondary
  > section
  > div.ns-square
  .ns-content
  > figure
  > div[data-doodle="kiss-kiss"] {
  bottom: 0;
  right: var(--unit);
}

/*
# Logo
*/
.ns-logo {
  display: inline-block;
  padding: 0 calc(var(--unit) * 0.5);
  box-sizing: border-box;
  text-align: center;
}

.ns-logo > svg {
  fill: var(--primary);
  width: auto;
}

.ns-logo-s,
.ns-logo-s > svg {
  height: var(--unit);
}

.ns-logo-m,
.ns-logo-m > svg {
  height: calc(var(--unit) * 1.5);
}

.ns-logo-l,
.ns-logo-l > svg {
  height: calc(var(--unit) * 2);
}

/*
# Logos Carousel
*/
@keyframes logos-carousel {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-100%);
  }
}

.ns-logos-carousel {
  width: 100%;
  height: calc(var(--unit) * 10);
  background-color: var(--white);
  overflow: hidden;
  align-items: center;
  padding-bottom: calc(var(--unit) * 2);
}

.ns-logos-carousel,
.ns-logos-carousel > div {
  display: flex;
}

.ns-logos-carousel > div {
  column-gap: calc(var(--unit) * 8);
  padding: 0 calc(var(--unit) * 4);
  width: fit-content;
  height: fit-content;
  transform: translateX(0);
}

.ns-logos-carousel > div > figure,
.ns-logos-carousel > div > figure > img {
  width: calc(var(--unit) * 8);
  height: calc(var(--unit) * 6);
}

.ns-logos-carousel > div > figure > img {
  object-fit: contain;
}

/*
* Solutions
*/
.ns-solutions {
  background-color: var(--white);
  padding: calc(var(--unit) * 2) 0;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.ns-solutions > div {
  column-gap: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 2);
}

.ns-solutions > div > div {
  row-gap: calc(var(--unit) * 2);
}

.ns-card-solution {
  row-gap: var(--unit);
  box-shadow: var(--elevation-1);
}

.ns-card-solution > header,
.ns-card-solution > figure {
  width: 100%;
}

.ns-card-solution > header {
  flex-direction: column;
}

@media (min-width: 960px) {
  .ns-card-solution > header {
    flex-direction: row;
  }
}

.ns-card-solution > header,
.ns-card-solution > header > div {
  display: flex;
}

.ns-card-solution > header > div {
  flex-direction: column;
  min-height: calc(var(--unit) * 6);
  justify-content: center;
  padding: var(--unit);
  row-gap: var(--unit);
}

.ns-card-solution > header > div > p {
  color: var(--grey);
}

.ns-card-solution > header > div.ns-card-solution-icon {
  flex: 0 0 calc(var(--unit) * 6);
  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6);
  font-size: 2rem;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  box-shadow: var(--elevation-2);
  border: var(--unit) solid var(--white);
  background-color: var(--off-white);
}

.ns-card-solution > figure {
  background-color: var(--off-white);
  flex: 1 0 auto;
}

.ns-card-solution > figure,
.ns-card-solution > figure > img {
  width: 100%;
  height: var(--breakpoint-xs);
  border-radius: var(--unit);
}

.ns-card-solution > figure > img {
  object-fit: contain;
}

/*
* Use Cases
*/
.ns-featured-use-cases {
  display: flex;
  flex-direction: column;
  /* column-reverse; */
  background-position: 33% 50%;
  background-repeat: no-repeat;
  height: fit-content;
  overflow: hidden;
  /* @media (min-width: 960px) {
      flex-direction: column;
  } */
}

.ns-featured-use-cases > section {
  display: flex;
  flex-direction: column-reverse;
  width: 100%;
  height: fit-content;
  row-gap: var(--unit);
}

@media (min-width: 960px) {
  .ns-featured-use-cases > section {
    flex-direction: row;
    /* height: 100%;
      height: 100vh;
      height: 100svh;
      max-height: calc(var(--unit) * 32); */
    column-gap: calc(var(--unit) * 2);
  }
}

.ns-featured-use-cases > section > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: calc(var(--unit) * 2);
}

.ns-featured-use-cases > section > div .ns-badge-use-case {
  background-color: var(--off-white);
  box-shadow: var(--elevation-2);
}

.ns-featured-use-cases > section > div.ns-highlight-use-case {
  min-height: calc(var(--unit) * 30);
}

.ns-featured-use-cases > section > div.ns-highlight-use-case > figure {
  background-color: var(--off-white);
}

.ns-featured-use-cases > section > div.ns-highlight-use-case > figure,
.ns-featured-use-cases > section > div.ns-highlight-use-case > figure > img {
  width: 100%;
  max-width: calc(var(--unit) * 16);
  height: calc(var(--unit) * 8);
  border-radius: var(--unit);
}

.ns-featured-use-cases > section > div.ns-square {
  position: relative;
  min-height: calc(var(--unit) * 24);
}

@media (min-width: 960px) {
  .ns-featured-use-cases > section > div.ns-square {
    min-height: unset;
  }
}

.ns-featured-use-cases > section > div.ns-square .ns-ratio {
  width: 100%;
  padding-top: 100%;
}

.ns-featured-use-cases > section > div.ns-square .ns-content {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: visible;
}

.ns-featured-use-cases > section > div.ns-square .ns-content > figure {
  position: relative;
  width: 100%;
  /* width: calc(var(--unit) * 16); */
  max-width: var(--breakpoint-xs);
  height: fit-content;
  margin: 0 auto;
  overflow: visible;
  /* @media (min-width: 960px) {
    width: 100%;
  } */
}

.ns-featured-use-cases > section > div.ns-square .ns-content > figure > img {
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 100%;
  overflow: hidden;
}

.ns-featured-use-cases > section > div.ns-square .ns-content > figure > div {
  position: absolute;
}

.ns-featured-use-cases
  > section
  > div.ns-square
  .ns-content
  > figure
  > div[data-doodle="ee"] {
  bottom: 0;
  left: 0;
}

.ns-featured-use-cases
  > section
  > div.ns-square
  .ns-content
  > figure
  > div[data-doodle="!!"] {
  top: calc(var(--unit) * 2);
  right: calc(var(--unit) * 2);
}

.ns-use-case-floating,
.ns-use-case-floating div,
.ns-use-case-floating button {
  width: calc(var(--unit) * 5);
  height: calc(var(--unit) * 5);
}

.ns-use-case-floating,
.ns-use-case-floating > div {
  position: absolute;
}

.ns-use-case-floating {
  top: 50%;
  left: 50%;
  overflow: visible;
  transform: translate(-50%, -50%);
}

.ns-use-case-floating > div {
  top: 0;
  left: 0;
}

/* TODO: iterate length js */
.ns-use-case-floating > div:nth-child(1) {
  transform: rotate(0deg);
}

.ns-use-case-floating > div:nth-child(1) > div > button {
  transform: rotate(0deg);
}

.ns-use-case-floating > div:nth-child(2) {
  transform: rotate(72deg);
}

.ns-use-case-floating > div:nth-child(2) > div > button {
  transform: rotate(-72deg);
}

.ns-use-case-floating > div:nth-child(3) {
  transform: rotate(144deg);
}

.ns-use-case-floating > div:nth-child(3) > div > button {
  transform: rotate(-144deg);
}

.ns-use-case-floating > div:nth-child(4) {
  transform: rotate(216deg);
}

.ns-use-case-floating > div:nth-child(4) > div > button {
  transform: rotate(-216deg);
}

.ns-use-case-floating > div:nth-child(5) {
  transform: rotate(288deg);
}

.ns-use-case-floating > div:nth-child(5) > div > button {
  transform: rotate(-288deg);
}

.ns-use-case-floating > div > div {
  transform: translate(calc(var(--unit) * 8), 0);
}

@media (min-width: 480px) {
  .ns-use-case-floating > div > div {
    transform: translate(calc(var(--unit) * 12), 0);
  }
}

@media (min-width: 1280px) {
  .ns-use-case-floating > div > div {
    transform: translate(calc(var(--unit) * 16), 0);
  }
}

.ns-use-case-floating > div > div > button {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  font-size: 2rem;
  background-color: var(--off-white);
  border: var(--unit) solid var(--white);
  outline: 2px solid transparent;
}

.ns-use-case-floating > div > div > button[aria-selected="true"] {
  outline-color: var(--primary);
  box-shadow: var(--elevation-2);
}

.ns-featured-use-cases-list ul {
  column-gap: var(--unit);
  row-gap: var(--unit);
  padding: calc(var(--unit) * 2) 0;
}

.ns-featured-use-cases-list ul li {
  display: flex;
  flex-direction: column;
  border-radius: calc(var(--unit) * 0.5);
}

.ns-featured-use-cases-list ul li a,
.ns-featured-use-cases-list ul li button {
  width: 100%;
  height: fit-content;
  padding: var(--unit);
  flex: 1;
}

/*
* Testimonials
*/
.ns-testimonials-container {
  background-position: 50% 100%;
  background-repeat: no-repeat;
}

.ns-testimonials {
  position: relative;
  display: grid;
  grid-auto-flow: column;
  gap: calc(var(--unit) * 2);
  width: 100vw;
  min-width: var(--breakpoint-xs);
  max-width: var(--breakpoint-xl);
  margin: 0 auto;
  height: fit-content;
  box-sizing: border-box;
  overflow-y: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  padding: calc(var(--unit) * 2);
}

.ns-testimonials::-webkit-scrollbar {
  display: none;
}

.ns-testimonials > div {
  width: 100vw;
  min-width: var(--breakpoint-xs);
  max-width: calc(100vw - var(--unit) * 5);
  height: 100%;
  scroll-snap-align: center;
  user-select: none;
  -webkit-user-drag: none;
  column-gap: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 2);
}

@media (min-width: 1440px) {
  .ns-testimonials > div {
    max-width: calc(var(--breakpoint-xl) - var(--unit) * 5);
  }
}

.ns-testimonials > div.ns-contain {
  padding: 0;
}

.ns-testimonials > div > div.ns-card {
  position: relative;
  height: 100%;
}

.ns-testimonials > div > div.ns-testimonial-avatar {
  max-height: var(--breakpoint-xs);
  padding: 0;
}

.ns-testimonials > div > div.ns-testimonial-avatar > figure,
.ns-testimonials > div > div.ns-testimonial-avatar > figure > img {
  width: 100%;
  height: 100%;
  min-height: calc(var(--unit) * 16);
  max-height: var(--breakpoint-xs);
  border-radius: var(--unit);
}

.ns-testimonials > div > div.ns-testimonial-avatar > figure > img {
  object-fit: cover;
}

.ns-testimonials > div > div.ns-testimonial-avatar > nav {
  position: absolute;
  padding: calc(var(--unit) * 1.5);
  bottom: 0;
  left: 0;
  color: var(--white);
}

.ns-testimonials > div > div.ns-testimonial-quote i {
  font-size: 1.25rem;
}

.ns-testimonials > div > div.ns-testimonial-quote,
.ns-testimonials > div > div.ns-testimonial-achievement {
  padding: calc(var(--unit) * 1.5);
  row-gap: var(--unit);
}

.ns-testimonials > div > div.ns-testimonial-achievement {
  background-color: var(--off-white);
}

.ns-testimonials > div > div.ns-testimonial-achievement figure,
.ns-testimonials > div > div.ns-testimonial-achievement img {
  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6);
  border-radius: 100%;
}

/*
# Resource 
*/
.ns-resource {
  flex: 1;
  width: 100%;
  max-width: var(--breakpoint-m);
  height: fit-content;
  border-radius: var(--unit);
  box-shadow: var(--elevation-2);
  overflow: hidden;
  column-gap: var(--unit);
  max-height: calc(var(--unit) * 16);
}

.ns-resource figure,
.ns-resource img {
  width: 100%;
  height: 100%;
  max-height: calc(var(--unit) * 16);
}

@media (min-width: 960px) {
  .ns-resource figure,
  .ns-resource img {
    max-height: calc(var(--unit) * 16);
  }
}

.ns-resource figure {
  background-color: var(--off-white);
  position: relative;
}

.ns-resource img {
  object-fit: cover;
}

.ns-resource figure > span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: calc(var(--unit) * 4);
  height: calc(var(--unit) * 4);
  background: rgba(255, 255, 255, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(var(--unit) * 2);
  border-radius: 100%;
  padding-left: calc(var(--unit) / 2);
}

.ns-resource figure > div {
  max-height: 25%;
  max-width: 25%;
  position: absolute;
  bottom: calc(var(--unit) / 2);
  right: calc(var(--unit) / 2);
  display: flex;
  justify-content: end;
  padding: calc(var(--unit) / 4);
}

.ns-resource > div {
  row-gap: var(--unit);
  position: relative;
}

.ns-resource > div > * {
  flex: unset;
}

.ns-resource > div .ns-badge {
  margin-top: var(--unit);
  margin-left: var(--unit);
  /* box-shadow: var(--elevation-1); */
}

@media (min-width: 960px) {
  .ns-resource > div .ns-badge {
    margin-left: 0;
  }
}

.ns-resource > div > h5 {
  flex: 1 0 auto;
  justify-self: center;
}

.ns-resource > div > h5,
.ns-resource > div > h5 > span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.ns-resource > div > i {
  position: absolute;
  font-size: 1.5rem;
  top: var(--unit);
  right: var(--unit);
}

/* 
# Resources
*/
.ns-resources {
  padding: calc(var(--unit) * 2) 0;
  background-color: var(--white);
  background: linear-gradient(0deg, var(--bg) 0%, var(--white) 100%);
}

.ns-resources > div,
.ns-resources > div > div {
  column-gap: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 2);
}

.ns-resources > div .ns-resource {
  margin-bottom: var(--unit);
}

@media (min-width: 960px) {
  .ns-resources > div [data-content="featured"] .ns-resource {
    max-height: calc(var(--unit) * 12);
  }
}

.ns-resources > div .ns-resource {
  margin-bottom: var(--unit);
}

.ns-resources > div .ns-resource:last-child {
  margin-bottom: 0;
}

/*
# G2
*/
.ns-g2 {
  background-color: var(--white);
  background-position: 25% 50%;
  background-repeat: no-repeat;
}

.ns-g2,
.ns-g2-badges-container {
  padding: calc(var(--unit) * 2) 0;
}

@media (min-width: 960px) {
  .ns-g2-badges-container {
    flex: 1.5;
  }
}

.ns-g2-badges {
  flex-direction: row;
}

@media (min-width: 960px) {
  .ns-g2-badges {
    flex-direction: column;
  }
}

.ns-g2 > div,
.ns-g2 > div > div,
.ns-g2-badges-container > div {
  column-gap: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 2);
}

.ns-g2 > div > div {
  column-gap: calc(var(--unit) * 4);
}

.ns-g2-badges-container > div,
.ns-g2-badges {
  row-gap: calc(var(--unit) * 4);
}

.ns-g2-badge,
.ns-g2-badge > img {
  width: 100%;
}

.ns-g2-badge {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
}

.ns-g2-badge > img {
  max-width: calc(var(--unit) * 8);
  height: auto;
}

.ns-g2-review {
  display: flex;
  align-items: center;
}

.ns-g2-review[hidden] {
  display: none;
}

.ns-g2-review > div > div {
  width: 100%;
  height: fit-content;
  overflow: hidden;
}

.ns-g2-review > div > div > div,
.ns-g2-review > div > div > div > div {
  width: var(--breakpoint-xs);
}

@media (min-width: 960px) {
  .ns-g2-review > div > div > div,
  .ns-g2-review > div > div > div > div {
    width: var(--breakpoint-s);
  }
}

.ns-g2-review > div > div > div {
  display: grid;
  grid-auto-flow: column;
  gap: var(--unit);
  overflow-y: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
}

.ns-g2-review > div > div > div::-webkit-scrollbar {
  display: none;
}

.ns-g2-review > div > div > div > div {
  display: flex;
  flex-direction: column;
  padding: var(--unit);
  justify-content: center;
  row-gap: var(--unit);
  scroll-snap-align: center;
  user-select: none;
  -webkit-user-drag: none;
}

.ns-g2-review .ns-dots-nav {
  padding: 0;
}

.ns-g2-review cite {
  color: var(--grey);
}

.ns-g2-review .ns-g2-stars {
  margin-right: var(--unit);
  white-space: nowrap;
}

.ns-g2-stars > span {
  display: none;
}

@media (min-width: 960px) {
  .ns-g2-stars > span {
    display: inline-block;
  }
}

/*
* Solution hero
*/
.ns-solution-hero,
.ns-webinar-hero {
  position: relative;
}

/* .ns-solution-hero {
  height: 100%;
  height: calc(100% - calc(var(--unit) * 5));
  height: 100vh;
  height: calc(100vh - calc(var(--unit) * 5));
  height: 100dvh;
  height: calc(100dvh - calc(var(--unit) * 5));
  min-height: var(--breakpoint-s);
  max-height: var(--breakpoint-l);
} */

.ns-solution-hero,
.ns-webinar-hero,
.ns-solution-hero > *,
.ns-webinar-hero > header {
  width: 100%;
  flex: unset;
}

.ns-solution-hero > header,
.ns-webinar-hero > header {
  row-gap: calc(var(--unit) * 2);
  background-position: 50% 0%;
  background-repeat: no-repeat;
}

.ns-solution-hero > header > h1,
.ns-webinar-hero > header > h1 {
  max-width: var(--breakpoint-m);
  margin: 0 auto;
}

.ns-solution-hero > header,
.ns-webinar-hero > header,
.ns-solution-hero > div,
.ns-webinar-hero > div {
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: calc(var(--unit) * 4) 0;
}

.ns-solution-hero > figure,
.ns-webinar-hero > .ns-gated-video {
  max-width: var(--breakpoint-l);
  margin: 0 auto;
}

.ns-solution-hero > figure {
  display: flex;
  flex-direction: column;
  min-height: var(--breakpoint-xs);
  max-height: var(--breakpoint-s);
  background-color: var(--white);
}

.ns-solution-hero > figure,
.ns-solution-hero > figure > img {
  flex: 1 0 auto;
  border-top-left-radius: var(--unit);
  border-top-right-radius: var(--unit);
  padding: 0;
}

.ns-webinar-hero > .ns-gated-video {
  padding: 0;
}

.ns-webinar-hero > .ns-gated-video > div,
.ns-webinar-hero > .ns-gated-video > div > div,
.ns-webinar-hero > .ns-gated-video > div > div[data-type="form"] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.ns-webinar-hero > .ns-gated-video > div > div > figure {
  width: 100%;
  background-color: var(--off-white);
}

.ns-webinar-hero > .ns-gated-video > div > div > figure > img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.ns-solution-hero > figure > nav {
  padding: 0 var(--unit);
}

.ns-solution-hero > figure > img {
  width: 100%;
  object-fit: contain;
  background-color: var(--off-white);
}

.ns-solution-hero > header > *,
.ns-webinar-hero > header > * {
  flex: unset;
}

.ns-solution-hero > div {
  display: flex;
  flex-direction: column;
  row-gap: calc(var(--unit) * 2);
  background-color: var(--white);
}

.ns-solution-hero > div > div {
  max-width: var(--breakpoint-l);
}

.ns-solution-hero > div > .ns-nav {
  justify-content: center;
}

.ns-misc-window-buttons {
  display: flex;
  width: fit-content;
  column-gap: var(--unit);
  align-items: center;
  padding: 0 var(--unit);
}

.ns-misc-window-buttons > span {
  width: calc(var(--unit) * 0.75);
  height: calc(var(--unit) * 0.75);
  border-radius: 100%;
  background-color: var(--off-white);
}

/*
* Blog Page
*/
/*
* Blog Post
*/
/*
* Blog Post Hero
*/
.ns-webinar-hero {
  padding-bottom: calc(var(--unit) * 2);
}

.ns-blog-post-hero + nav,
.ns-webinar-hero + nav {
  position: sticky;
  top: calc(var(--unit) * 6);
  z-index: 1;
  margin-bottom: calc(var(--unit) * 2);
}

.ns-blog-post-hero-misc time {
  padding: 0 var(--unit);
}

.ns-blog-post-hero-misc i {
  font-size: inherit;
  margin-right: calc(var(--unit) * 0.5);
}

.ns-author p.ns-s {
  color: var(--grey);
}

.ns-author > figure,
.ns-author > figure > img {
  width: calc(var(--unit) * 4);
  height: calc(var(--unit) * 4);
  border-radius: 100%;
}

.ns-author > figure {
  max-width: calc(var(--unit) * 4);
}

.ns-author > figure > img {
  object-fit: cover;
}

.ns-blog-post-hero + nav > .ns-card,
.ns-webinar-hero + nav > .ns-card {
  flex-direction: row;
  width: fit-content;
}

.ns-blog-post-hero + nav > .ns-card > i,
.ns-blog-post-hero + nav > .ns-card > span,
.ns-webinar-hero + nav > .ns-card > i,
.ns-webinar-hero + nav > .ns-card > span {
  color: var(--light-grey);
}

.ns-blog-post {
  padding: 0;
  background-color: var(--white);
  min-height: var(--breakpoint-m);
  border-radius: var(--unit);
}

/* .ns-blog-post,
.ns-blog-post>aside,
.ns-blog-post>article {
} */
.ns-blog-post > aside,
.ns-blog-post > div {
  padding: calc(var(--unit) * 2);
}

@media (min-width: 960px) {
  .ns-blog-post > aside {
    max-width: calc(var(--unit) * 24);
  }
}

.ns-blog-post > div {
  display: flex;
  flex-direction: column;
  max-width: var(--breakpoint-l);
}

.ns-blog-post > div h1,
.ns-blog-post > div .ns-h1,
.ns-blog-post > div h2,
.ns-blog-post > div .ns-h2,
.ns-blog-post > div h3,
.ns-blog-post > div .ns-h3,
.ns-blog-post > div h4,
.ns-blog-post > div .ns-h4 {
  margin: calc(var(--unit) * 2) 0;
}

.ns-blog-post > div h1:not(:first-child),
.ns-blog-post > div .ns-h1:not(:first-child),
.ns-blog-post > div h2:not(:first-child),
.ns-blog-post > div .ns-h2:not(:first-child),
.ns-blog-post > div h3:not(:first-child),
.ns-blog-post > div .ns-h3:not(:first-child),
.ns-blog-post > div h4:not(:first-child),
.ns-blog-post > div .ns-h4:not(:first-child) {
  margin-top: calc(var(--unit) * 3);
}

.ns-blog-post > div h5,
.ns-blog-post > div .ns-h5,
.ns-blog-post > div h6,
.ns-blog-post > div .ns-h6,
.ns-blog-post > div p,
.ns-blog-post > div .ns-p,
.ns-blog-post > div ul,
.ns-blog-post > div ol {
  margin-bottom: calc(var(--unit) * 1);
}

.ns-blog-post > div p,
.ns-blog-post > div .ns-p {
  font-size: var(--unit);
  line-height: 1.5;
}

/* .ns-blog-post>div figure,
.ns-blog-post>div img {
  border-radius: calc(var(--unit) * 1.5);
} */

.ns-blog-post > div img {
  width: 100%;
  height: auto;
}

.ns-blog-post > div ul,
.ns-blog-post > div ol,
.ns-blog-post > div li {
  padding: calc(var(--unit) * 0.5);
  font-size: var(--unit);
}

.ns-blog-post > div ul {
  list-style-type: disc;
  list-style-position: inside;
}

.ns-blog-post > div ol {
  list-style-type: decimal;
  list-style-position: inside;
}

.ns-blog-post > div ul ul,
.ns-blog-post > div ol ul {
  list-style-type: circle;
  list-style-position: inside;
  margin-left: var(--unit);
}

.ns-blog-post > div ol ol,
.ns-blog-post > div ul ol {
  list-style-type: lower-latin;
  list-style-position: inside;
  margin-left: var(--unit);
}

.ns-blog-post > div a {
  color: var(--primary);
  text-decoration: underline;
}

.ns-blog-post > div a:hover {
  color: var(--complementary);
}

.ns-blog-post-hero {
  background-position: 50% 100%;
  background-repeat: no-repeat;
}

.ns-blog-page-hero {
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.ns-blog-post-hero,
.ns-blog-page-hero {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: fit-content;
  padding: calc(var(--unit) * 2) 0;
  overflow: hidden;
}

.ns-blog-page-hero[data-featured="true"] {
  min-height: var(--breakpoint-s);
  /* @media (min-width: 960px) {
    height: 100%;
    height: calc(100% - calc(var(--unit) * 12));
    height: 100vh;
    height: calc(100vh - calc(var(--unit) * 12));
    height: 100dvh;
    height: calc(100dvh - calc(var(--unit) * 12));
    max-height: calc(var(--unit) * 32);
  } */
}

.ns-blog-page-hero[data-featured="false"] > header {
  display: none;
}

.ns-blog-post-hero > header,
.ns-blog-page-hero > header {
  flex: 1;
  align-items: center;
  /* z-index: 1; */
}

.ns-blog-post-hero > header > div,
.ns-blog-page-hero > header > div {
  position: relative;
  width: 100%;
}

.ns-blog-post-hero > header figure.ns-figure,
.ns-blog-page-hero > header figure.ns-figure {
  max-width: var(--breakpoint-m);
  background-color: var(--off-white);
}

.ns-blog-post-hero > header figure.ns-figure,
.ns-blog-page-hero > header figure.ns-figure,
.ns-blog-post-hero > header figure.ns-figure:before,
.ns-blog-page-hero > header figure.ns-figure:before,
.ns-blog-post-hero > header figure.ns-figure > img,
.ns-blog-page-hero > header figure.ns-figure > img,
.ns-blog-post-hero > header figure.ns-figure > iframe,
.ns-blog-page-hero > header figure.ns-figure > iframe {
  width: 100%;
  border-radius: var(--unit);
}

.ns-blog-post-hero > header figure.ns-figure,
.ns-blog-page-hero > header figure.ns-figure {
  position: relative;
}

.ns-blog-post-hero > header figure.ns-figure:before,
.ns-blog-page-hero > header figure.ns-figure:before {
  display: block;
  content: "";
  padding-top: 56%;
}

.ns-blog-post-hero > header figure.ns-figure > img,
.ns-blog-page-hero > header figure.ns-figure > img,
.ns-blog-post-hero > header figure.ns-figure > iframe,
.ns-blog-page-hero > header figure.ns-figure > iframe {
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
}

.ns-blog-post-hero > header,
.ns-blog-page-hero > header,
.ns-blog-post-hero > header > div > div,
.ns-blog-page-hero > header > div > div,
.ns-blog-post-hero > header > div > div > div,
.ns-blog-page-hero > header > div > div > div {
  column-gap: var(--unit);
  row-gap: var(--unit);
}

.ns-blog-post-hero > header,
.ns-blog-page-hero > header {
  column-gap: calc(var(--unit) * 2);
}

.ns-join-newsletter {
  padding: var(--unit);
}

@media (min-width: 960px) {
  .ns-join-newsletter[data-sticky="true"] {
    position: sticky;
    top: calc(var(--unit) * 5);
    z-index: 1;
  }
}

.ns-join-newsletter > nav {
  row-gap: var(--unit);
  height: fit-content;
}

.ns-join-newsletter > nav .ns-spacer {
  flex: 1 0 auto;
}

.ns-blog-posts {
  flex-direction: column;
  row-gap: var(--unit);
  background-color: var(--white);
  padding: var(--unit) 0;
}

.ns-blog-posts > .ns-section-header {
  padding-bottom: 0;
}

.ns-blog-posts,
.ns-blog-posts > ul {
  display: flex;
}

.ns-blog-posts > ul {
  flex-wrap: wrap;
}

.ns-blog-posts > ul,
.ns-blog-posts > ul li {
  padding: var(--unit);
}

@media (min-width: 960px) {
  .ns-blog-posts > ul,
  .ns-blog-posts > ul li {
    padding: calc(var(--unit) * 2);
  }
}

.ns-blog-posts > ul li {
  width: 100%;
  margin: 0;
}

@media (min-width: 960px) {
  .ns-blog-posts > ul li {
    flex: 0 0 33%;
  }
}

.ns-blog-posts-load-more {
  justify-content: center;
}

.ns-blog-post-item {
  display: flex;
  flex-direction: column;
  flex: 1;
  max-width: var(--breakpoint-m);
  height: fit-content;
  /* box-shadow: var(--elevation-2); */
  column-gap: var(--unit);
  row-gap: var(--unit);
  overflow: hidden;
}

.ns-blog-post-item,
.ns-blog-post-item > figure,
.ns-blog-post-item > div,
.ns-blog-post-item > figure:before,
.ns-blog-post-item > figure > img {
  width: 100%;
}

.ns-blog-post-item > figure,
.ns-blog-post-item > figure > img {
  border-radius: var(--unit);
}

.ns-blog-post-item > figure {
  position: relative;
  background-color: var(--off-white);
  height: fit-content;
}

.ns-blog-post-item > figure:before {
  display: block;
  content: "";
  padding-top: 56%;
}

.ns-blog-post-item > figure > div.ns-badge {
  position: absolute;
  top: var(--unit);
  right: var(--unit);
}

.ns-blog-post-item > figure > img {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  object-fit: cover;
}

.ns-blog-post-item > div {
  display: flex;
  flex-direction: column;
  row-gap: var(--unit);
  padding: var(--unit);
}

.ns-blog-post-item > div time {
  padding: 0 var(--unit);
}

.ns-blog-post-item > div i {
  font-size: inherit;
  margin-right: calc(var(--unit) * 0.5);
}

.ns-tabs {
  box-shadow: var(--elevation-0);
  overflow: hidden;
}

.ns-tabs,
.ns-tabs ul {
  width: 100%;
  height: calc(var(--unit) * 5);
}

.ns-tabs ul {
  display: flex;
  column-gap: calc(var(--unit) * 2);
  align-items: center;
  overflow-y: scroll;
}

.ns-tabs ul > li {
  width: fit-content;
}

.ns-tabs > ul::-webkit-scrollbar {
  display: none;
}

.ns-tabs ul > li > i {
  font-size: 1.25rem;
  margin: 0 0 0 var(--unit);
}

.ns-tabs ul > li > a {
  background-color: transparent;
  padding: 0;
}

/*
* Banner
*/
.ns-banner {
  padding: var(--unit) 0;
  background-color: var(--dark-grey);
  color: var(--white);
  box-sizing: border-box;
}

.ns-banner > div {
  justify-content: center;
}

.ns-banner > div,
.ns-banner > div > div {
  align-items: center;
}

/* .ns-banner > div > div {
  text-align: center;
} 
@media (min-width: 960px) {
  .ns-banner > div > div {
    text-align: left;
  }
} */
.ns-banner > div > figure,
.ns-banner > div > figure > img {
  width: auto;
  max-width: calc(var(--unit) * 16);
  height: fit-content;
  max-height: calc(var(--unit) * 2);
}

.ns-banner[data-variant="ai"] .ns-banner-text,
.ns-banner[data-variant="ai"] a.ns-button {
  -webkit-text-fill-color: transparent;
  background: linear-gradient(
    to bottom right,
    var(--red) 0%,
    var(--orange) 100%
  );
  background-clip: text;
}

.ns-banner[data-variant="ai"] .ns-banner-text {
  font-weight: 500;
}

.ns-banner[data-variant="ai"] a.ns-button {
  outline: 1px solid var(--orange);
}

/*
* 2 columns sections
*/
.ns-2cols-section {
  position: relative;
}

.ns-2cols-section > div,
.ns-2cols-section > div > div {
  padding: calc(var(--unit) * 1);
}

.ns-2cols-section > div {
  column-gap: var(--unit);
  row-gap: var(--unit);
}

.ns-2cols-section div[data-figure],
.ns-2cols-section div[data-figure] > figure {
  display: flex;
  align-items: center;
  justify-content: center;
}

.ns-2cols-section div[data-figure] > figure,
.ns-2cols-section div[data-figure] > figure > img,
.ns-2cols-section div[data-figure] > figure > video {
  width: 100%;
  height: 100%;
}

.ns-2cols-section div[data-figure] > figure > img,
.ns-2cols-section div[data-figure] > figure > video {
  max-width: var(--breakpoint-s);
  max-height: var(--breakpoint-s);
  object-fit: contain;
}

/*
* Form container
*/
.ns-form {
  background-color: var(--white);
  padding: calc(var(--unit) * 2) 0;
  background-position: 44% 50%;
  background-repeat: no-repeat;
}

.ns-form > div {
  column-gap: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 2);
}

.ns-form > div > div {
  padding: var(--unit);
}

.ns-form figure {
  border-radius: var(--unit);
}

.ns-form figure > img {
  width: 100%;
  border-radius: var(--unit);
}

.ns-form .ns-card {
  padding: calc(var(--unit) * 2);
}

.ns-form ul,
.ns-form ul > li {
  row-gap: calc(var(--unit) * 1);
  column-gap: calc(var(--unit) * 1);
}

.ns-form ul,
.ns-form ul > li {
  display: flex;
  padding: 0;
  margin: 0;
}

.ns-form ul {
  flex-direction: column;
}

.ns-form ul > li {
  align-items: center;
  text-align: left;
  justify-content: flex-start;
}

.ns-form .ns-form-html p,
.ns-form .ns-form-html ul,
.ns-form .ns-form-html ol {
  margin-bottom: calc(var(--unit) * 2);
}

.ns-form .ns-form-html a {
  color: var(--primary);
  text-decoration: underline;
}

.ns-form .ns-form-html a:hover {
  color: var(--complementary);
}

/*
# Text container
*/
.ns-text-container h1,
.ns-text-container .ns-h1,
.ns-text-container h2,
.ns-text-container .ns-h2,
.ns-text-container h3,
.ns-text-container .ns-h3,
.ns-text-container h4,
.ns-text-container .ns-h4 {
  margin: calc(var(--unit) * 2) 0;
}

.ns-text-container h1:not(:first-child),
.ns-text-container .ns-h1:not(:first-child),
.ns-text-container h2:not(:first-child),
.ns-text-container .ns-h2:not(:first-child),
.ns-text-container h3:not(:first-child),
.ns-text-container .ns-h3:not(:first-child),
.ns-text-container h4:not(:first-child),
.ns-text-container .ns-h4:not(:first-child) {
  margin-top: calc(var(--unit) * 3);
}

.ns-text-container h5,
.ns-text-container .ns-h5,
.ns-text-container h6,
.ns-text-container .ns-h6,
.ns-text-container p,
.ns-text-container .ns-p,
.ns-text-container ul,
.ns-text-container ol {
  margin-bottom: calc(var(--unit) * 1);
}

.ns-text-container p,
.ns-text-container .ns-p {
  font-size: var(--unit);
  line-height: 1.5;
}

.ns-text-container img {
  width: 100%;
  height: auto;
}

.ns-text-container ul,
.ns-text-container ol,
.ns-text-container li {
  padding: calc(var(--unit) * 0.5);
  font-size: var(--unit);
}

.ns-text-container ul {
  list-style-type: disc;
  list-style-position: inside;
}

.ns-text-container ol {
  list-style-type: decimal;
  list-style-position: inside;
}

.ns-text-container ul ul,
.ns-text-container ol ul {
  list-style-type: circle;
  list-style-position: inside;
  margin-left: var(--unit);
}

.ns-text-container ol ol,
.ns-text-container ul ol {
  list-style-type: lower-latin;
  list-style-position: inside;
  margin-left: var(--unit);
}

.ns-text-container a {
  color: var(--primary);
  text-decoration: underline;
}

.ns-text-container a:hover {
  color: var(--complementary);
}

/* 
# Overides for plugins 
*/
.ajax-load-more-wrap {
  width: 100%;
}

.alm-reveal {
  display: flex;
  flex-wrap: wrap;
}

.alm-btn-wrap {
  display: flex;
  width: 100%;
  height: calc(var(--unit) * 4);
  min-height: calc(var(--unit) * 4);
  align-items: center;
  justify-content: center;
  column-gap: var(--unit);
}

.alm-btn-wrap > i {
  font-size: 1.5rem;
  margin: 0 var(--unit);
}

.ns-toc #ez-toc-container {
  width: 100%;
  position: sticky;
  top: calc(var(--unit) * 8);
  margin-top: var(--unit);
  border: none;
  background: var(--white);
  box-shadow: none;
  -webkit-box-shadow: none;
  display: block;
  overflow-y: scroll;
  max-height: calc(100vh - var(--unit) * 9);
}

.ns-toc * {
  /* Firefox */
  scrollbar-width: auto;
  scrollbar-color: var(--off-white) var(--white);
}

.ns-toc *::-webkit-scrollbar {
  /* Chrome, Edge, and Safari */
  width: 16px;
}

.ns-toc *::-webkit-scrollbar-track {
  background: var(--white);
}

.ns-toc *::-webkit-scrollbar-thumb {
  background-color: var(--off-white);
  border-radius: 10px;
  border: 3px solid var(--white);
}

.ns-toc #ez-toc-container * {
  letter-spacing: -0.4px !important;
}

.ns-toc #ez-toc-container .ez-toc-title-container {
  margin-bottom: 1rem;
}

.ns-toc #ez-toc-container .ez-toc-title-container > p {
  cursor: default;
  font-size: 0.9rem;
  text-transform: uppercase;
  font-weight: 500;
}

.ns-toc #ez-toc-container .ez-toc-list a {
  width: 100%;
  border-bottom: 1px solid var(--off-white);
  padding: 0.5rem 0.3rem;
  color: #332954;
  font-weight: 400;
  font-size: 0.9rem;
  text-decoration: none;
  /* transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; */
  transform-origin: center center;
  transform: scale(1);
  transition: transform 256ms ease-in-out, opacity 256ms ease-in-out;
  backface-visibility: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
}

.ns-toc #ez-toc-container .ez-toc-list a:hover {
  border-bottom: 1px solid var(--green);
  /* background-color: var(--lightest-green); */
}

@media (min-width: 960px) {
  .ns-toc #ez-toc-container .ez-toc-list a:hover {
    cursor: pointer;
    transform: scale(1.016);
  }
}

.ns-toc #ez-toc-container .ez-toc-list a:focus {
  transform: scale(1);
}

.ns-toc #ez-toc-container ul ul {
  margin-left: 0.75rem;
}

.ns-toc #ez-toc-container .ez-toc-list a.ez-toc-heading-2 {
  font-size: 0.85rem;
}

.ez-toc-section {
  scroll-margin-top: calc(var(--unit) * 9);
}

.ns-blog-post #ez-toc-container {
  display: none;
}

.ns-blog-post > .ns-toc #ez-toc-container {
  display: block;
}

/*
* Backward compatibility
*/
.n-container {
  overflow: auto;
}

.n-container p,
.ns-blog-post > div ul,
.ns-blog-post > div ol {
  margin-bottom: calc(var(--unit) * 1);
}

.n-feature-grid {
  flex-direction: column;
  row-gap: var(--unit);
  background-color: var(--white);
  padding: var(--unit) 0;
}

.n-feature-grid,
.n-feature-grid > ul {
  display: flex;
}

.n-feature-grid > ul {
  flex-wrap: wrap;
  justify-content: center;
}

.n-feature-grid > ul,
.n-feature-grid > ul li {
  padding: var(--unit);
}

@media (min-width: 960px) {
  .n-feature-grid > ul,
  .n-feature-grid > ul li {
    padding: calc(var(--unit) * 2);
  }
}

.n-feature-grid > ul li {
  width: 100%;
  margin: 0;
}

@media (min-width: 960px) {
  .n-feature-grid > ul li {
    flex: 0 0 33%;
  }
}

.n-feature-box,
.n-page-section {
  position: relative;
}

.n-feature-box > div > div,
.n-page-section > div > div {
  padding: calc(var(--unit) * 2);
}

.n-feature-box figure > img,
.n-page-section figure > img {
  width: 100%;
  object-fit: contain;
  height: 100%;
  border-radius: var(--unit);
}

.ns-links-table {
  display: flex;
  justify-content: center;
}

.ns-links-table > table {
  border-spacing: 70px 15px;
}

.ns-quote {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: var(--breakpoint-l);
  margin: calc(var(--unit) * 2) auto;
  column-gap: var(--unit);
  row-gap: var(--unit);
  box-sizing: border-box;
  padding: calc(var(--unit) * 4) calc(var(--unit) * 2);
  background-color: var(--lightest-primary);
  border-radius: calc(var(--unit) * 1.5);
}

.ns-quote i {
  font-style: normal;
}

/* .ns-quote h3 {
  text-wrap: unset;
} */
@media (min-width: 960px) {
  .ns-quote {
    flex-direction: row-reverse;
    padding: calc(var(--unit) * 4);
  }
}

.ns-quote > figure,
.ns-quote > figure > img {
  width: calc(var(--unit) * 8);
  height: calc(var(--unit) * 8);
  border-radius: 100%;
  overflow: hidden;
}

.ns-quote > figure {
  flex: calc(var(--unit) * 8) 0 0;
  margin: 0 auto;
  align-self: center;
}

@media (min-width: 960px) {
  .ns-quote > figure {
    margin: unset;
  }
}

.ns-quote > figure > img {
  object-fit: cover;
}

.ns-quote > blockquote {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: fit-content;
  padding: 0 var(--unit);
  box-sizing: border-box;
}

.ns-quote > blockquote > cite {
  color: var(--off-black);
  font-weight: 600;
}

.ns-quote > blockquote > span {
  display: block;
  font-size: 2rem;
  margin-top: calc(var(--unit) * 2);
}

/* .ns-quote>blockquote>p {
  margin: 0 !important;
  font-size: 2rem;
} */

.ns-quote > span,
.ns-quote > i {
  position: absolute;
  font-size: 2.5rem;
}

.ns-quote > span.ns-start-quote,
.ns-quote > i.ns-start-quote {
  top: calc(var(--unit) * -1.5);
  left: var(--unit);
}

.ns-quote > span.ns-end-quote,
.ns-quote > i.ns-end-quote {
  bottom: calc(var(--unit) * -1.5);
  right: var(--unit);
}

.ns-quote > blockquote > i.ns-end-quote {
  transform: rotate(180deg);
}

.ns-footer-privacy-btn-offset {
  margin-right: calc(var(--unit) * 5);
}

@media (max-width: 320px) {
  .ns-hide-on-min-width {
    display: none;
  }
}

.ns-differentiators {
  min-height: var(--breakpoint-s);
}

.ns-differentiators {
  background-position: 66% 0%;
  background-repeat: no-repeat;
}

.ns-differentiators > div > div,
.ns-differentiators > div > div > div {
  column-gap: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 2);
}

.ns-differentiators > div > div > figure,
.ns-differentiators > div > div > figure > img {
  width: 100%;
  height: var(--breakpoint-xs);
  border-radius: var(--unit);
}

.ns-differentiators > div > div > figure {
  max-width: var(--breakpoint-m);
  background-color: var(--off-white);
  margin: 0 auto;
}

.ns-differentiators > div > div > figure.ns-s,
.ns-differentiators > div > div > figure.ns-s > img {
  width: auto;
  height: calc(var(--unit) * 3);
  margin: 0;
}

.ns-differentiators > div > div > figure[data-bg="none"] {
  background-color: transparent;
}

.ns-differentiators > div > div > figure > img {
  object-fit: cover;
}

.ns-differentiators > div > div > figure > img[data-fit="contain"] {
  object-fit: contain;
}

.ns-differentiators .ns-card {
  padding: calc(var(--unit) * 2);
  height: inherit;
  flex: 1;
  justify-content: center;
}

.ns-differentiators .ns-card,
.ns-differentiators .ns-card ul,
.ns-differentiators .ns-card ul > li {
  row-gap: calc(var(--unit) * 2);
  column-gap: calc(var(--unit) * 2);
}

.ns-differentiators .ns-card ul,
.ns-differentiators .ns-card ul > li {
  display: flex;
  padding: 0;
  margin: 0;
}

.ns-differentiators .ns-card ul {
  flex-direction: column;
}

.ns-differentiators .ns-card ul > li {
  align-items: center;
  text-align: left;
  justify-content: flex-start;
}

.ns-differentiators .ns-card .ns-p.ns-s {
  color: var(--grey);
  font-style: italic;
  margin-right: calc(var(--unit) * 0.5);
}

.ns-differentiators .ns-card.ns-wrap {
  position: relative;
}

.ns-differentiators .ns-wrap div > i {
  margin-right: var(--unit);
}

.ns-differentiators .ns-wrap .ns-emoji-icon {
  margin-right: var(--unit);
}

.ns-differentiators .ns-wrap + i {
  font-size: 1.25rem;
  margin: 0 auto;
  color: var(--dark-grey);
}

.ns-differentiators .ns-wrap > div {
  color: inherit;
  display: flex;
  align-items: center;
}

.ns-differentiators .ns-wrap .ns-float-logo {
  position: absolute;
  width: fit-content;
  height: fit-content;
  top: 0;
  left: 0;
  transform: translate(calc(var(--unit) * 4), calc(-100% - var(--unit)));
}

.ns-differentiators .ns-highlight {
  color: var(--primary);
}

.ns-key-insight {
  position: relative;
  max-width: var(--breakpoint-l);
  margin: calc(var(--unit) * 2) auto;
  padding: calc(var(--unit) * 4) calc(var(--unit) * 2);
  background-color: var(--lightest-green);
  overflow: hidden;
  border-radius: calc(var(--unit) * 1.5);
  align-items: center;
}

.ns-key-insight,
.ns-key-insight > div {
  display: flex;
  flex-direction: column;
  width: 100%;
  column-gap: var(--unit);
  row-gap: var(--unit);
  box-sizing: border-box;
}

.ns-key-insight > div > span {
  font-size: 2rem;
}

.ns-key-insight > div > p {
  text-wrap: balance;
}

.ns-key-insight > div > h2 > span,
.ns-key-insight > div > h3 > span,
.ns-key-insight > div > h5 > span {
  color: var(--green);
  opacity: 0;
  animation: fadeIn 0.64s ease-in-out forwards;
}

.ns-key-insight > div i {
  font-style: normal;
}

.ns-key-insight > aside {
  position: relative;
  width: 100%;
  height: fit-content;
  max-width: calc(var(--unit) * 16);
  margin: 0 auto;
}

.ns-key-insight > aside::before {
  display: block;
  content: "";
  padding-top: 100%;
}

.ns-key-insight > aside > div {
  position: absolute;
  top: 0;
  left: 0;
  padding: calc(var(--unit) * 2);
}

.ns-key-insight > aside > div,
.ns-key-insight > aside > div > div {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

.ns-key-insight > aside > div > div {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  background-color: var(--white);
  color: var(--green);
}

.ns-key-insight > aside > div > div:before {
  content: "";
  position: absolute;
  border-radius: 50%;
  inset: 0;
  background: conic-gradient(
    var(--green) calc(var(--p) * 1%),
    rgba(0, 0, 0, 0) 0
  );
  -webkit-mask: radial-gradient(
    farthest-side,
    rgba(0, 0, 0, 0) calc(99% - var(--unit)),
    #000 calc(100% - var(--unit))
  );
  mask: radial-gradient(
    farthest-side,
    rgba(0, 0, 0, 0) calc(99% - var(--unit)),
    #000 calc(100% - var(--unit))
  );
}

@media (min-width: 960px) {
  .ns-key-insight {
    flex-direction: row;
    padding: calc(var(--unit) * 4);
  }
}

.ns-use-case-hero {
  min-height: calc(var(--unit) * 40);
}

.ns-use-case-hero,
.ns-use-case-hero > header,
.ns-use-case-hero > header > div,
.ns-use-case-hero > header > figure {
  box-sizing: border-box;
}

.ns-use-case-hero {
  position: relative;
  width: 100%;
  padding: calc(var(--unit) * 2) 0;
  overflow: hidden;
}

.ns-use-case-hero:before {
  position: absolute;
  left: 0;
  bottom: 0;
  content: "";
  width: 100%;
  height: 50vh;
  transform: skew(0, -6.4deg) translateY(66%);
  background-color: var(--bg);
  z-index: 0;
}

.ns-use-case-hero[data-straight-end="true"]:before {
  content: none;
}

.ns-use-case-hero > header {
  position: relative;
  align-items: center;
  z-index: 1;
}

.ns-use-case-hero > header > div {
  display: flex;
  flex-direction: column;
  row-gap: var(--unit);
  height: fit-content;
}

.ns-use-case-hero > header > div .ns-badge {
  background-color: var(--white);
  color: var(--off-black);
}

.ns-use-case-hero > header > figure,
.ns-use-case-hero > header > figure > img {
  width: 100%;
}

.ns-use-case-hero > header > figure > img {
  object-fit: contain;
}

@media (min-width: 960px) {
  .ns-use-case-hero {
    padding: calc(var(--unit) * 2);
  }
}

.ns-card-list {
  display: flex;
  flex-direction: column;
  padding: calc(var(--unit) * 2) 0;
  box-sizing: border-box;
  align-items: center;
}

.ns-card-list,
.ns-card-list .ns-rows,
.ns-card-list .ns-columns {
  column-gap: var(--unit);
  row-gap: var(--unit);
}

.ns-card-list .ns-card {
  padding: calc(var(--unit) * 2);
  height: unset;
  justify-content: center;
}

iframe.hs-form-iframe {
}

iframe.hs-form-iframe,
iframe.hs-form-iframe input,
iframe.hs-form-iframe .hs-input,
iframe.hs-form-iframe p {
  font-family: "Poppins", sans-serif !important;
}

.ns-gated-video {
  position: relative;
  /* padding-bottom: 66.66%; */
  height: fit-content;
  margin-bottom: calc(var(--unit) * 1.5);
}

.ns-gated-video,
.ns-gated-video > div,
.ns-gated-video > div > div {
  width: 100%;
}

.ns-gated-video > div,
.ns-gated-video > div > div {
  /* height: fit-content; */
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.ns-gated-video > div > div {
  background-color: var(--white);
  box-sizing: border-box;
  border-radius: calc(var(--unit) * 1.5);
  background-color: var(--off-white);
}

@media (min-width: 960px) {
  .ns-gated-video > div > div {
    padding: calc(var(--unit) * 1.5);
  }
}

.ns-gated-video > div > div[data-type="form"] {
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: calc(var(--unit) * 0.75);
  background-color: rgba(0, 0, 0, 0.48);
  row-gap: calc(var(--unit) * 0.5);
  padding: calc(var(--unit) * 1.5);
}

.ns-gated-video > div > div[data-type="form"] > div {
  width: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
}

@media (min-width: 960px) {
  .ns-gated-video > div > div[data-type="form"] > div {
    padding: calc(var(--unit) * 1.5);
  }
}

.ns-gated-video > div > div[data-type="form"] > h3 {
  color: var(--white);
  margin: 0;
}

.ns-gated-video > div > div[hidden="true"] {
  opacity: 0;
  visibility: hidden;
  display: none;
}

.ns-gated-video > div > div > video {
  width: 100%;
  height: auto;
  border-radius: calc(var(--unit) * 0.75);
}

.ns-bullet-accordion {
  column-gap: var(--unit);
  row-gap: var(--unit);
  padding: calc(var(--unit) * 2) 0;
  /* background-position: 33% 66%; */
  background-repeat: no-repeat;
}

@media (min-width: 960px) {
  .ns-bullet-accordion {
    padding: calc(var(--unit) * 4) 0;
  }
}

.ns-bullet-accordion > figure,
.ns-bullet-accordion > div {
}

.ns-bullet-accordion > figure {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: var(--unit);
  box-sizing: border-box;
}

@media (min-width: 960px) {
  .ns-bullet-accordion > figure {
    position: sticky;
    top: calc(var(--unit) * 4);
    align-self: flex-start;
    /* <-- this is the fix */
  }

  .ns-bullet-accordion > figure[data-section-title="true"] {
    padding: calc(var(--unit) * 2) var(--unit);
  }

  .ns-bullet-accordion > figure[data-section-label="true"] {
    padding: calc(var(--unit) * 5) var(--unit);
  }
}

.ns-bullet-accordion > figure img {
  width: 100%;
  max-width: calc(var(--unit) * 32);
  object-fit: contain;
}

.ns-bullet-accordion > div {
  row-gap: var(--unit);
}

.ns-bullet-accordion > div .ns-section-header {
  padding: var(--unit) 0;
}

@media (min-width: 960px) {
  .ns-bullet-accordion[data-image-position="left"]
    > div
    .ns-section-header
    > div {
    align-items: flex-start;
  }

  .ns-bullet-accordion[data-image-position="left"]
    > div
    .ns-section-header
    > div
    * {
    text-align: left;
  }
}

@media (min-width: 960px) {
  .ns-bullet-accordion[data-image-position="right"]
    > div
    .ns-section-header
    > div {
    align-items: flex-end;
  }

  .ns-bullet-accordion[data-image-position="right"]
    > div
    .ns-section-header
    > div
    * {
    text-align: right;
  }
}

.ns-bullet-accordion > div > ol,
.ns-bullet-accordion > div > ol > li {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.ns-bullet-accordion > div > ol {
  padding: var(--unit);
  row-gap: var(--unit);
}

.ns-bullet-accordion > div > ol > li {
  padding: var(--unit);
  row-gap: var(--unit);
  border-radius: calc(var(--unit) * 0.75);
  background-color: var(--white);
  transition: background-color 0.32s ease-in-out;
}

.ns-bullet-accordion > div > ol > li[aria-expanded="true"] {
  background-color: var(--off-white);
}

.ns-bullet-accordion > div > ol > li[aria-expanded="false"] {
  cursor: pointer;
}

.ns-bullet-accordion
  > div
  > ol
  > li[aria-expanded="false"]
  button[data-expanded="true"] {
  display: none;
}

.ns-bullet-accordion > div > ol > li[aria-expanded="true"] button {
  background-color: transparent;
}

.ns-bullet-accordion > div > ol > li[aria-expanded="false"] button {
  outline: none;
}

.ns-bullet-accordion
  > div
  > ol
  > li[aria-expanded="true"]
  button[data-expanded="false"] {
  display: none;
}

.ns-bullet-accordion > div > ol > li div {
  overflow: hidden;
  transition: height 0.32s ease-in-out;
}

.ns-bullet-accordion > div > ol > li[aria-expanded="false"] div {
  height: 0;
  display: none;
}

.ns-bullet-accordion > div > ol > li[aria-expanded="true"] div {
  height: fit-content;
}

.ns-bullet-accordion > div > ol > li > nav,
.ns-bullet-accordion > div > ol > li > div {
  display: flex;
  width: 100%;
}

.ns-bullet-accordion > div > ol > li > nav {
  align-items: center;
  column-gap: var(--unit);
  min-height: calc(var(--unit) * 3);
}

.ns-bullet-accordion > div > ol > li > nav > h5 {
  color: var(--dark-grey);
  margin: 0;
}

.ns-bullet-accordion > div > ol > li > div {
  padding-left: calc(var(--unit) * 4);
}

.ns-bullet-accordion > div > ol > li > div > p {
  color: var(--dark-grey);
  padding: 0 0 var(--unit) 0;
  margin: 0;
}

.ns-usp-list {
  padding: var(--unit);
  row-gap: var(--unit);
}

.ns-usp-list .ns-section-header {
  padding: calc(var(--unit) * 2) var(--unit);
}

/* 
.ns-usp-list .ns-section-header,
.ns-usp-list .ns-section-header>div {
  align-items: flex-start;
}
.ns-usp-list .ns-section-header * {
  text-align: left;
} 
*/
@media (min-width: 960px) {
  .ns-usp-list {
    padding: calc(var(--unit) * 4) var(--unit);
  }
}

.ns-usp-list,
.ns-usp-list ul,
.ns-usp-list li {
  width: 100%;
  box-sizing: border-box;
}

.ns-usp-list,
.ns-usp-list > ul,
.ns-usp-list li {
  padding: var(--unit);
}

.ns-usp-list > ul > ul {
}

.ns-usp-list > ul > ul > li,
.ns-usp-list > ul > ul > li > div {
  display: flex;
}

.ns-usp-list > ul > ul > li {
  column-gap: var(--unit);
}

.ns-usp-list > ul > ul > li > div {
  flex-direction: column;
  width: 100%;
  padding: calc(var(--unit) * 0.25) 0;
  row-gap: var(--unit);
  box-sizing: border-box;
}

.ns-usp-list > ul > ul > li > div > p {
  color: var(--grey);
}

.ns-cards {
  width: 100%;
  padding: var(--unit);
  row-gap: var(--unit);
}

/* columns */
.ns-cards > div {
  column-gap: var(--unit);
  row-gap: var(--unit);
}

.ns-cards .ns-card {
  height: auto;
}

.ns-cards .ns-card > figure,
.ns-cards .ns-card > figure > img {
  width: 100%;
}

.ns-cards .ns-card > figure {
  height: fit-content;
  padding: var(--unit);
}

.ns-cards .ns-card > figure > img {
  max-height: calc(var(--unit) * 24);
  object-fit: contain;
}

.ns-cards .ns-card > div {
  display: flex;
  flex-direction: column;
  row-gap: var(--unit);
  padding: var(--unit);
  flex: 1 0 auto;
}

.ns-cards .ns-card > div > p {
  color: var(--grey);
}

.ns-cards .ns-card > nav {
  padding: var(--unit);
}

.ns-text-header-container {
  width: 100%;
  height: fit-content;
  padding: calc(var(--unit) * 2) 0;
}

@media (min-width: 960px) {
  .ns-text-header-container {
    padding: calc(var(--unit) * 4) 0;
  }
}

.ns-text-header-container[data-variant="primary"] {
  background-color: var(--lightest-primary);
  color: var(--primary);
}

.ns-text-header-container[data-variant="secondary"] {
  background-color: var(--lightest-secondary);
  color: var(--secondary);
}

.ns-text-header-container[data-variant="complementary"] {
  background-color: var(--lightest-complementary);
  color: var(--complementary);
}

.ns-text-header-container[data-variant="accent"] {
  background-color: var(--lightest-accent);
  color: var(--accent);
}

.ns-text-header {
  column-gap: var(--unit);
  row-gap: var(--unit);
  background-color: inherit;
  color: inherit;
}

.ns-text-header,
.ns-text-header-title,
.ns-text-header-content {
  width: 100%;
  padding: var(--unit);
}

.ns-text-header-title,
.ns-text-header-content {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: var(--unit);
}

.ns-text-header-title > div[data-doodle] {
  position: absolute;
  top: calc(var(--unit) * -2);
  /* bottom: var(--unit); */
  right: var(--unit);
}

.ns-text-header-content p {
  color: var(--grey);
}

@media (min-width: 960px) {
  .ns-text-header-title {
  }

  .ns-text-header-content {
    flex: 2;
  }
}

.ns-people {
  padding: calc(var(--unit) * 2) 0;
  /* background-position: 66% 33%; */
  background-repeat: no-repeat;
}

.ns-people .ns-section-header {
  padding: calc(var(--unit) * 2) var(--unit);
}

@media (min-width: 960px) {
  .ns-people {
    padding: calc(var(--unit) * 4) 0;
  }
}

.ns-people ol {
  display: flex;
  padding: var(--unit);
  box-sizing: border-box;
}

.ns-people > ol {
  row-gap: var(--unit);
}

.ns-people > ol > ol {
  flex-direction: column;
  column-gap: var(--unit);
  row-gap: var(--unit);
}

@media (min-width: 960px) {
  .ns-people > ol {
    row-gap: 0;
  }

  .ns-people > ol > ol {
    flex-direction: row;
    row-gap: var(--unit);
  }
}

.ns-people ol li {
  display: flex;
  flex-direction: column;
  height: auto;
  row-gap: var(--unit);
  column-gap: var(--unit);
  padding: var(--unit);
  box-sizing: border-box;
}

@media (min-width: 960px) {
  .ns-people ol li[data-layout="horizontal"] {
    flex-direction: row;
  }
}

.ns-people ol li > figure,
.ns-people ol li > figure > img {
  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6);
  flex: 0 0 calc(var(--unit) * 6);
  background-color: var(--lightest-primary);
  border-radius: 100%;
  overflow: hidden;
}

.ns-people ol li > figure > img {
}

.ns-people ol li > div {
  display: flex;
  flex-direction: column;
  flex: 1;
  row-gap: var(--unit);
}

.ns-people ol li > div > nav {
  padding: var(--unit);
}

.ns-people ol li > div > nav > div {
  flex: 1 0 auto;
}

.ns-people ol li > div > nav > div > legend {
  color: var(--complementary);
}

.ns-people ol li .ns-card {
  border-top-left-radius: 0;
}

.ns-people ol li .ns-card p {
  color: var(--grey);
}

/*
# Polaroids Carousel
*/
@keyframes polaroid-carousel {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-100%);
  }
}

.ns-polaroid-carousel {
  width: 100%;
  height: calc(var(--unit) * 32);
  background-color: var(--bg);
  overflow: hidden;
  align-items: center;
  padding-bottom: calc(var(--unit) * 2);
  /* background-color: var(--white); */
}

.ns-polaroid-carousel,
.ns-polaroid-carousel > div {
  display: flex;
}

.ns-polaroid-carousel > div {
  column-gap: calc(var(--unit) * 4);
  padding: 0 calc(var(--unit) * 4);
  width: fit-content;
  height: fit-content;
  transform: translateX(0);
}

.ns-polaroid-carousel > div > figure {
  background-color: var(--white);
  padding-bottom: calc(var(--unit) * 4);
  box-shadow: var(--elevation-2);
}

.ns-polaroid-carousel > div > figure {
  position: relative;
  width: calc(var(--unit) * 14);
  height: calc(var(--unit) * 18);
  padding: var(--unit) var(--unit) calc(var(--unit) * 4) var(--unit);
}

.ns-polaroid-carousel > div > figure > img {
  object-fit: cover;
  width: calc(var(--unit) * 12);
  height: calc(var(--unit) * 12);
}

.ns-polaroid-carousel > div > figure > div {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  height: calc(var(--unit) * 5);
  left: 0;
  bottom: 0;
}

.ns-polaroid-carousel > div > figure > div > p {
  font-family: "Gloria Hallelujah", cursive;
  font-weight: 400;
  font-style: normal;
  font-size: 1rem;
  text-transform: capitalize;
}

.ns-investors {
  /* background-color: var(--white); */
  padding: calc(var(--unit) * 2) 0;
}

@media (min-width: 960px) {
  .ns-investors {
    padding: calc(var(--unit) * 4) 0;
  }
}

.ns-investors > .ns-section-header {
  padding-top: 0;
}

.ns-investors > div.ns-content {
  align-items: center;
  justify-content: space-evenly;
  row-gap: var(--unit);
  column-gap: var(--unit);
}

.ns-investors > div.ns-content > figure {
  flex: 1;
  width: 100%;
  max-width: calc(var(--unit) * 12);
  height: fit-content;
  /* max-height: calc(var(--unit) * 4); */
}

@media (min-width: 960px) {
  .ns-investors > div.ns-content > figure {
    max-width: calc(var(--unit) * 12);
  }
}

.ns-investors > div.ns-content > figure > img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

/*
# Testimonial Highlight
*/
.ns-testimonial-highlight {
  flex-direction: column;
  padding: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 1);
  column-gap: calc(var(--unit) * 1);
}

@media (min-width: 960px) {
  .ns-testimonial-highlight {
    flex-direction: row;
    padding-top: calc(var(--unit) * 1);
  }
}

.ns-testimonial-highlight,
.ns-testimonial-highlight > div,
.ns-testimonial-highlight > div > div {
  display: flex;
}

@media (max-width: 480px) {
  .ns-testimonial-highlight > div > div {
    flex-direction: column;
  }
}

.ns-testimonial-highlight > div {
  flex-direction: column;
  flex: 1;
  width: 100%;
  column-gap: calc(var(--unit) * 1);
  row-gap: calc(var(--unit) * 1);
  align-items: center;
}

@media (min-width: 960px) {
  .ns-testimonial-highlight > div {
    flex-direction: row;
  }
}

.ns-testimonial-highlight > div:first-child {
  position: relative;
}

@media (min-width: 960px) {
  .ns-testimonial-highlight > div:first-child {
    flex: 1.5;
  }

  .ns-testimonial-highlight > div:first-child:before,
  .ns-testimonial-highlight > div:first-child:after {
    content: "";
    position: absolute;
    top: 50%;
    width: 1px;
    height: calc(var(--unit) * 2);
    background-color: var(--grey);
  }

  .ns-testimonial-highlight > div:first-child:before {
    right: calc(var(--unit) * 1);
    transform: translateY(-50%) rotate(16deg);
  }

  .ns-testimonial-highlight > div:first-child:after {
    right: calc(calc(var(--unit) * 1) - calc(var(--unit) * 0.25));
    transform: translateY(-50%) rotate(16deg);
  }
}

.ns-testimonial-highlight > div > div.company,
.ns-testimonial-highlight > div > div.logos {
  width: 100%;
}

.ns-testimonial-highlight > div > div.company {
  position: relative;
}

@media (min-width: 960px) {
  .ns-testimonial-highlight > div > div.company {
    flex: 0 0 calc(var(--unit) * 11);
  }
}

.ns-testimonial-highlight > div > div.testimonial {
  flex-direction: column;
}

.ns-testimonial-highlight > div > div.testimonial legend {
  color: var(--grey);
}

.ns-testimonial-highlight > div > div.testimonial h5 i:first-child {
  margin-right: calc(var(--unit) * 0.25);
}

.ns-testimonial-highlight > div > div.testimonial h5 i:last-child {
  margin-left: calc(var(--unit) * 0.25);
}

.ns-testimonial-highlight > div > div.logos {
  justify-content: space-around;
}

@media (min-width: 960px) {
  .ns-testimonial-highlight > div > div.logos {
    max-width: calc(var(--unit) * 32);
    justify-content: space-between;
  }
}

.ns-testimonial-highlight > div > div.company > figure {
  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6);
  outline: 1px solid var(--off-white);
  border-radius: 100%;
  background-color: var(--white);
}

.ns-testimonial-highlight > div > div.company > figure > img {
  width: calc(var(--unit) * 4);
  height: calc(var(--unit) * 4);
  margin: calc(var(--unit) * 1);
}

.ns-testimonial-highlight > div > div.company > figure.author {
  position: absolute;
  top: 0;
  left: calc(var(--unit) * 5);
}

.ns-testimonial-highlight > div > div.company > figure.author > img {
  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6);
  margin: 0;
  border-radius: 100%;
  overflow: hidden;
}

.ns-testimonial-highlight > div > div.logos > figure,
.ns-testimonial-highlight > div > div.logos > figure > img {
  width: calc(var(--unit) * 8);
  height: calc(var(--unit) * 6);
  object-fit: contain;
}

@media (min-width: 960px) {
  .ns-testimonial-highlight > div > div.logos {
    padding: 0 calc(var(--unit) * 1);
  }

  .ns-testimonial-highlight > div > div.logos > figure,
  .ns-testimonial-highlight > div > div.logos > figure > img {
    width: calc(var(--unit) * 6);
    height: calc(var(--unit) * 4);
  }
}

/*
# Request Demo Hero
*/
.ns-request-demo-hero {
  padding: calc(var(--unit) * 2);
  column-gap: calc(var(--unit) * 1);
  background-position: 75% 50%;
  background-repeat: no-repeat;
}

.ns-request-demo-hero,
.ns-request-demo-hero > div {
  display: flex;
  flex-direction: column;
  width: 100%;
  row-gap: calc(var(--unit) * 1);
}

.ns-request-demo-hero > div:last-child {
  max-width: calc(var(--unit) * 24);
  margin: 0 auto;

  & div[data-doodle] {
    position: absolute;
    pointer-events: none;
  }

  & div[data-doodle="kiss-kiss"] {
    top: calc(var(--unit) * -2);
    right: calc(var(--unit) * -1);
  }

  & div[data-doodle="ee"] {
    bottom: calc(var(--unit) * 1);
    left: calc(var(--unit) * -4);
  }
}

.ns-request-demo-hero > div p,
.ns-request-demo-hero > div legend {
  color: var(--grey);
}

.ns-request-demo-hero > div legend {
  font-size: 0.8rem;
  padding: 0 calc(var(--unit) * 1);
}

.ns-request-demo-hero > div legend a {
  text-decoration: underline;
}

.ns-request-demo-hero > div > ul,
.ns-request-demo-hero > div > ul > li {
  display: flex;
}

.ns-request-demo-hero > div > ul {
  flex-direction: column;
  padding: calc(var(--unit) * 2) 0;
  row-gap: calc(var(--unit) * 1);
}

.ns-request-demo-hero > div > ul > li {
  padding: 0 calc(var(--unit) * 1);
}

.ns-request-demo-hero > div > ul > li > p {
  padding: calc(var(--unit) * 0.25) calc(var(--unit) * 1);
}

@media (min-width: 960px) {
  .ns-request-demo-hero {
    padding-top: calc(var(--unit) * 4);
    flex-direction: row;
  }

  .ns-request-demo-hero > div {
    flex: 1;
  }

  .ns-request-demo-hero > div > ul > li:nth-child(2) {
    padding-left: calc(var(--unit) * 2);
  }

  .ns-request-demo-hero > div > ul > li:nth-child(3) {
    padding-left: calc(var(--unit) * 3);
  }

  .ns-request-demo-hero > div > ul > li:nth-child(4) {
    padding-left: calc(var(--unit) * 4);
  }

  .ns-request-demo-hero > div:first-child {
    flex: 1.5;
  }

  .ns-request-demo-hero > div:last-child {
    max-width: calc(var(--unit) * 32);
    padding: 0 calc(var(--unit) * 2);
    margin: unset;
  }
}

/*
# Why Card Grid
*/
.ns-why-card-grid {
  padding-bottom: calc(var(--unit) * 2);
}

.ns-why-card-grid ol,
.ns-compliancy ol {
  padding: calc(var(--unit) * 2) 0;
  row-gap: calc(var(--unit) * 1);
  column-gap: calc(var(--unit) * 1);
}

.ns-why-card-grid ol li {
  row-gap: calc(var(--unit) * 2);
  padding: calc(var(--unit) * 2);
}

.ns-why-card-grid ol li.title {
  background-color: var(--primary);
  color: var(--white);
}

.ns-why-card-grid ol li.why {
  background-color: var(--lightest-primary);
}

/*
# Compliancy
*/
.ns-compliancy ol li {
  align-items: center;
  padding: 0 calc(var(--unit) * 2);
}

.ns-compliancy ol li.title {
  padding: calc(var(--unit) * 2);
}

.ns-compliancy ol li figure,
.ns-compliancy ol li figure img {
  width: calc(var(--unit) * 10);
  height: auto;
}

.ns-compliancy ol li figure img {
  object-fit: contain;
}

@media (min-width: 960px) {
  .ns-compliancy ol li {
    align-self: center;
  }
}

/*
# AI HERO
*/
.ns-ai-hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: calc(var(--unit) * 2) 0;
  box-sizing: border-box;
  background-position: 66% 50%;
  background-repeat: no-repeat;
  width: 100%;
  width: 100vw;
  height: fit-content;
}

@media (min-width: 960px) {
  .ns-ai-hero {
    height: calc(100% - calc(var(--unit) * 12));
    height: calc(100vh - calc(var(--unit) * 12));
    max-height: calc(var(--unit) * 48);
  }
}

.ns-ai-hero > header {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.ns-ai-text-gradient {
  background: linear-gradient(
    to bottom right,
    rgb(253, 57, 122) 0%,
    rgb(255, 184, 34) 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ns-ai-feature-panels {
  display: flex;
  width: 100%;
  min-height: calc(var(--unit) * 16);
  column-gap: calc(var(--unit) * 4);
  row-gap: calc(var(--unit) * 4);
  align-items: center;
  justify-content: space-evenly;
  margin: calc(var(--unit) * 4) auto calc(var(--unit) * 2) auto;
  /* padding-bottom: calc(var(--unit) * 4); */
}

.ns-ai-feature-panel {
  position: relative;
  padding: 0;
  max-width: 100%;
  width: calc(var(--unit) * 16);
  /* min-height: calc(var(--unit) * 8); */
  background-color: var(--white);
  border-radius: var(--unit);
  box-shadow: var(--elevation-1);
  transition: width 256ms ease-in-out, max-width 256ms ease-in-out,
    height 256ms ease-in-out;
}

@media (min-width: 960px) {
  .ns-ai-feature-panel {
    width: 100%;
    width: 100vw;
    max-width: calc(var(--unit) * 16);
  }
}

.ns-ai-feature-panel::after {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  pointer-events: none;
  top: calc(var(--unit) * 1.5);
  transform-origin: center center;
  transform: scale(0.96) translateZ(0);
  filter: blur(var(--unit));
  background: linear-gradient(
    to left,
    rgb(253, 57, 122),
    rgb(255, 184, 34),
    rgb(253, 57, 122),
    rgb(255, 184, 34),
    rgb(253, 57, 122)
  );
  background-size: 200% 200%;
  z-index: 0;
  transition: opacity 256ms ease-in-out;
}

.ns-ai-feature-panel[data-active="true"] {
  width: calc(var(--unit) * 24);
}

@media (min-width: 960px) {
  .ns-ai-feature-panel[data-active="true"] {
    width: 100%;
    max-width: calc(var(--unit) * 24);
  }
}

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

  100% {
    background-position: 200% 50%;
  }
}

.ns-ai-feature-panel[data-active="true"]::after {
  opacity: 1;
  animation: animateGlow 2.4s linear infinite;
}

.ns-ai-feature-panel > div {
  padding-top: 66%;
}

.ns-ai-feature-panel > video {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: var(--unit);
  top: 0;
  left: 0;
  object-fit: cover;
  z-index: 1;
}

.ns-ai-avatar,
.ns-ai-avatar-standalone {
  position: relative;
  overflow: visible;
}

.ns-ai-avatar-standalone[data-size="s"],
.ns-ai-avatar-standalone[data-size="s"] > img,
.ns-ai-avatar-standalone[data-size="s"] > video {
  width: calc(var(--unit) * 3);
  height: calc(var(--unit) * 3);
}

.ns-ai-avatar-standalone[data-size="s"] > div,
.ns-ai-avatar-standalone[data-size="s"] > div > img,
.ns-ai-avatar-standalone[data-size="s"] > div > video {
  width: calc(var(--unit) * 2);
  height: calc(var(--unit) * 2);
}

.ns-ai-avatar-standalone[data-size="m"],
.ns-ai-avatar-standalone[data-size="m"] > img,
.ns-ai-avatar-standalone[data-size="m"] > video {
  width: calc(var(--unit) * 4);
  height: calc(var(--unit) * 4);
}

.ns-ai-avatar-standalone[data-size="m"] > div,
.ns-ai-avatar-standalone[data-size="m"] > div > img,
.ns-ai-avatar-standalone[data-size="m"] > div > video {
  width: calc(var(--unit) * 3);
  height: calc(var(--unit) * 3);
}

.ns-ai-avatar-standalone[data-size="l"],
.ns-ai-avatar-standalone[data-size="l"] > img,
.ns-ai-avatar-standalone[data-size="l"] > video {
  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6);
}

.ns-ai-avatar-standalone[data-size="l"] > div,
.ns-ai-avatar-standalone[data-size="l"] > div > img,
.ns-ai-avatar-standalone[data-size="l"] > div > video {
  width: calc(var(--unit) * 4);
  height: calc(var(--unit) * 4);
}

.ns-ai-avatar {
  margin-top: calc(var(--unit) * 3);
  margin-bottom: calc(var(--unit) * 1);
}

.ns-ai-avatar,
.ns-ai-avatar > img,
.ns-ai-avatar > video {
  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6);
}

.ns-ai-avatar > img,
.ns-ai-avatar-standalone > img,
.ns-ai-avatar > video,
.ns-ai-avatar-standalone > video {
  border-radius: 100%;
  object-fit: cover;
}

.ns-ai-avatar > div,
.ns-ai-avatar-standalone > div {
  position: absolute;
  bottom: 0;
  right: calc(var(--unit) * -1);
}

.ns-ai-avatar > div,
.ns-ai-avatar > div > img,
.ns-ai-avatar > div > video {
  width: calc(var(--unit) * 3);
  height: calc(var(--unit) * 3);
}

.ns-ai-avatar-menu {
  position: relative;
  overflow: visible;
  margin: 0;
}

.ns-ai-avatar-menu,
.ns-ai-avatar-menu > img,
.ns-ai-avatar-menu > video {
  width: calc(var(--unit) * 4);
  height: calc(var(--unit) * 4);
}

.ns-ai-avatar-menu > img,
.ns-ai-avatar-menu > video {
  border-radius: 100%;
  object-fit: cover;
}

.ns-ai-avatar-menu > div {
  position: absolute;
  bottom: 0;
  right: calc(var(--unit) * -1);
}

.ns-ai-avatar-menu > div,
.ns-ai-avatar-menu > div > img,
.ns-ai-avatar-menu > div > video {
  width: calc(var(--unit) * 2);
  height: calc(var(--unit) * 2);
}

/*
# VS TABLE
*/
.ns-vs-table {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: calc(var(--unit) * 4) calc(var(--unit) * 2);
  box-sizing: border-box;
  background-color: var(--white);
  background-position: 66% 50%;
  background-repeat: no-repeat;
  width: 100%;
  width: 100vw;
}

.ns-vs-table[data-section-header="true"] {
  padding-top: 0;
}

.ns-vs-table > ul {
  display: flex;
  flex-direction: column-reverse;
  /* max-width: calc(var(--unit) * 48); */
  background-color: var(--white);
  border-radius: var(--unit);
  box-shadow: var(--elevation-2);
  overflow: hidden;
  padding: 0;
  margin: 0;
}

@media (min-width: 960px) {
  .ns-vs-table > ul {
    flex-direction: row-reverse;
  }
}

.ns-vs-table > ul > ol,
.ns-vs-table > ul > ol > li {
  display: flex;
  min-height: calc(var(--unit) * 5);
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

.ns-vs-table > ul > ol {
  flex-direction: column;
}

.ns-vs-table > ul > ol > li {
  align-items: center;
  column-gap: calc(var(--unit) * 1);
  padding: 0 calc(var(--unit) * 1);
  box-shadow: var(--elevation-0);
}

.ns-vs-table > ul > ol > li:last-child {
  box-shadow: none;
}

.ns-vs-table-header {
  background-color: var(--off-white);
  height: calc(var(--unit) * 4);
  min-height: unset !important;
}

.ns-vs-table-header > h6 {
  font-weight: 600;
  padding: 0 calc(var(--unit) * 0.5);
}

/*
# NS TABLE
*/
.ns-table {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: calc(var(--unit) * 4) calc(var(--unit) * 2);
  box-sizing: border-box;
  background-color: var(--white);
  background-position: 66% 50%;
  background-repeat: no-repeat;
  width: 100%;
  width: 100vw;
}

.ns-table[data-section-header="true"] {
  padding-top: 0;
}

.ns-table > ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: calc(var(--unit) * 64);
  background-color: var(--white);
  border-radius: var(--unit);
  box-shadow: var(--elevation-2);
  overflow: hidden;
  padding: 0;
  margin: 0;
}

@media (max-width: 960px) {
  .ns-table > ul {
    grid-template-columns: 1fr;
  }
}

.ns-table > ul > li {
  display: flex;
  min-height: calc(var(--unit) * 5);
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

.ns-table > ul > li {
  align-items: center;
  column-gap: calc(var(--unit) * 1);
  padding: calc(var(--unit) * 1);
  box-shadow: var(--elevation-0);
}

.ns-table-header {
  background-color: var(--off-white);
  height: calc(var(--unit) * 4);
  min-height: unset !important;
}

.ns-table-header > h6 {
  font-weight: 600;
  padding: 0 calc(var(--unit) * 0.5);
}

/*
# NS MODAL
*/

.ns-modal,
.ns-modal > div {
  width: 100%;
  width: 100vw;
}

.ns-modal {
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  height: 100vh;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.16);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transform: translate3d(0, 0, 0);
  z-index: 999;
}

.ns-modal > div {
  box-shadow: var(--elevation-1);
  border-radius: var(--unit);
  color: var(--dark-grey);
  background-color: var(--white);
  max-width: calc(var(--unit) * 24);
  height: fit-content;
}

/*
# AI DEMO
*/

.ns-vs-comparison-bullet {
  border-bottom: 1px solid var(--off-white);
}

.ns-vs-comparison-bullet:last-child {
  border-bottom: none;
}

.ns-legend {
  margin: 0;
  line-height: 1.5;
  font-size: 0.75rem;
}

.ns-legend,
.nst-legend {
  color: var(--grey);
}

.ns-ai-demo {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: calc(var(--unit) * 2) calc(var(--unit) * 1) calc(var(--unit) * 4)
    calc(var(--unit) * 1);
  box-sizing: border-box;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  width: 100%;
  width: 100vw;
  min-height: calc(var(--unit) * 24);
  height: fit-content;
  max-height: unset;
}

.ns-ai-demo-section-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: calc(var(--unit) * 4);
  column-gap: calc(var(--unit) * 0.5);
  row-gap: calc(var(--unit) * 0.5);
}

.ns-ai-demo-panel {
  position: relative;
  width: 100%;
  max-width: calc(var(--unit) * 64);
  height: fit-content;
  max-height: unset;
}

.ns-ai-demo-panel > div {
  position: relative;
  width: 100%;
  height: fit-content;
  max-height: calc(var(--unit) * 40);
  overflow: hidden;
  background-color: var(--white);
  outline: 1px solid var(--off-white);
  border-radius: var(--unit);
  z-index: 1;
}

.ns-ai-demo-panel::before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  pointer-events: none;
  top: calc(var(--unit) * 1.5);
  transform-origin: center center;
  transform: scale(0.96) translateZ(0);
  filter: blur(var(--unit));
  background: linear-gradient(
    to left,
    rgb(253, 57, 122),
    rgb(255, 184, 34),
    rgb(253, 57, 122),
    rgb(255, 184, 34),
    rgb(253, 57, 122)
  );
  background-size: 200% 200%;
  transition: opacity 256ms ease-in-out;
  z-index: 0;
}

.ns-ai-demo-panel[data-active="true"]::before {
  opacity: 1;
  animation: animateGlow 2.4s linear infinite;
}

.nst-suggestion-icon {
  fill: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><linearGradient id='grad'><stop offset='0%' stop-color='var(--red)'/><stop offset='100%' stop-color='var(--yellow)'/></linearGradient></svg>#grad")
    var(--red);
}

.nst-suggestion-icon,
.nst-suggestion-icon[data-size="m"] {
  width: calc(var(--unit) * 1.5);
  height: calc(var(--unit) * 1.5);
  flex: 0 0 calc(var(--unit) * 1.5);
}

.nst-suggestion-icon[data-size="s"] {
  width: calc(var(--unit) * 1);
  height: calc(var(--unit) * 1);
  flex: 0 0 calc(var(--unit) * 1);
}

.nst-suggestion-icon[data-size="l"] {
  width: calc(var(--unit) * 2);
  height: calc(var(--unit) * 2);
  flex: 0 0 calc(var(--unit) * 2);
}

.nst-spacer {
  flex-grow: 1;
  min-width: 0;
  min-height: 0;
}

.nst-spacer[data-fixed="true"] {
  width: calc(var(--unit) * 1);
  height: calc(var(--unit) * 1);
  flex: 0 0 calc(var(--unit) * 1);
}

.nst-ai-operation-bubble {
  flex-direction: column;
  z-index: 1;
}

.nst-ai-operation-bubble,
.nst-ai-operation-bubble > div {
  display: flex;
  width: 100%;
  height: fit-content;
}

.nst-ai-operation-bubble > div {
  align-items: flex-start;
  column-gap: calc(var(--unit) * 0.5);
}

.nst-ai-common-bubble-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--unit) * 1.5);
  height: calc(var(--unit) * 1.5);
  flex: 0 0 calc(var(--unit) * 1.5);
  border-radius: 100%;
  overflow: hidden;
  border: 1px solid var(--off-white);
}

.nst-ai-common-bubble-indicator[data-variant="placeholder"] {
  background-color: var(--off-white);
  border-color: var(--white);
}

.nst-ai-common-bubble-indicator[data-variant="placeholder"] > div {
  position: relative;
  display: flex;
  column-gap: calc(var(--unit) * 0.125);
}

.nst-ai-common-bubble-indicator[data-variant="placeholder"] > div > span {
  width: calc(var(--unit) * 0.125);
  height: calc(var(--unit) * 0.125);
  border-radius: 100%;
  background-color: var(--dark-grey);
}

@keyframes bounceUp {
  0% {
    transform: translate3d(0, 0, 0);
  }

  33% {
    transform: translate3d(0, 100%, 0);
  }

  66% {
    transform: translate3d(0, -100%, 0);
  }

  100% {
    transform: translate3d(0, 0, 0);
  }
}

.nst-ai-common-bubble-indicator[data-variant="placeholder"]
  > div
  > span:nth-child(1) {
  animation: 1024ms bounceUp infinite;
  animation-delay: 256ms;
}

.nst-ai-common-bubble-indicator[data-variant="placeholder"]
  > div
  > span:nth-child(2) {
  animation: 1024ms bounceUp infinite;
  animation-delay: 512ms;
}

.nst-ai-common-bubble-indicator[data-variant="placeholder"]
  > div
  > span:nth-child(3) {
  animation: 1024ms bounceUp infinite;
  animation-delay: 768ms;
}

.nst-ai-common-bubble-indicator[data-variant="default"],
.nst-ai-common-bubble-indicator[data-variant="success"],
.nst-ai-common-bubble-indicator[data-variant="failure"],
.nst-ai-common-bubble-indicator[data-variant="warning"],
.nst-ai-common-bubble-indicator[data-variant="output"] {
  overflow: hidden;
}

.nst-ai-common-bubble-indicator[data-variant="default"] {
  background-color: var(--primary);
  color: var(--white);
}

.nst-ai-common-bubble-indicator[data-variant="success"] {
  background-color: var(--green);
  color: var(--white);
}

.nst-ai-common-bubble-indicator[data-variant="warning"] {
  background-color: var(--yellow);
  color: var(--white);
}

.nst-ai-common-bubble-indicator[data-variant="failure"] {
  background-color: var(--red);
  color: var(--white);
}

.nst-ai-common-bubble-indicator[data-variant="output"] {
  background-color: var(--white);
  border-color: var(--dark-grey);
  color: var(--dark-grey);
}

.nst-ai-common-bubble-indicator + div {
  max-width: calc(var(--unit) * 64);
}

.nst-ai-common-bubble {
  width: fit-content;
  min-width: calc(var(--unit) * 2);
  height: fit-content;
  min-height: calc(var(--unit) * 2);
  border-radius: var(--unit);
  border: 1px solid var(--off-white);
  background-color: var(--white);
  border-top-left-radius: 0;
  opacity: 0;
  animation: 256ms fadeIn forwards;
  padding: calc(var(--unit) * 0.5);
}

.nst-ai-common-bubble,
.nst-ai-common-bubble > p {
  margin: 0;
}

.nst-ai-common-bubble > p {
  padding: 0 calc(var(--unit) * 0.5);
  color: var(--dark-grey);
  /* white-space: pre-wrap; */
}

.nst-ai-common-bubble > p > strong {
  font-weight: 500;
}

.nst-extracted-skill-set-from-job-role-description {
  opacity: 0;
  animation: 256ms fadeIn forwards;
  background-color: var(--white);
  border: 1px solid var(--off-white);
  border-radius: var(--unit);
  border-top-left-radius: 0;
  overflow: visible;
  width: calc(100% - calc(var(--unit) * 2));
  height: calc(var(--unit) * 4);
  transition: height 256ms ease-in-out;
}

.nst-extracted-skill-set-from-job-role-description[data-toolbar="true"] {
  min-height: calc(var(--unit) * 7);
  height: fit-content;
}

.nst-extracted-skill-set-from-job-role-description,
.nst-extracted-skill-set-from-job-role-description > div,
.nst-extracted-skill-set-from-job-role-description > nav {
  position: relative;
}

.nst-extracted-skill-set-from-job-role-description > div {
  width: 100%;
  display: block;
  overflow: hidden;
}

.nst-extracted-skill-set-from-job-role-description > div > ul {
  display: flex;
  list-style: none;
  transition: transform 256ms ease-in-out;
}

.nst-extracted-skill-set-from-job-role-description > div > ul,
.nst-extracted-skill-set-from-job-role-description > div > ul > li {
  width: 100%;
  height: fit-content;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.nst-extracted-skill-set-from-job-role-description > div > ul > li {
  flex: 1;
  flex-direction: column;
  overflow: hidden;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item {
  flex-direction: column;
  height: fit-content;
  padding: calc(var(--unit) * 0.5);
  row-gap: calc(var(--unit) * 0.5);
}

@media (min-width: 960px) {
  .nst-extracted-skill-set-from-job-role-description
    .nst-extracted-skill-set-from-job-role-description-item {
    flex-direction: row;
    height: calc(var(--unit) * 4);
    padding: 0 calc(var(--unit) * 0.5);
  }
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div {
  display: flex;
  flex-direction: column;
  row-gap: calc(var(--unit) * 0.25);
  width: 100%;
  flex: 1;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div
  > * {
  text-transform: capitalize;
  margin: 0;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div
  > h6 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  line-height: 1.5;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div:first-of-type {
  flex: 2;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div:last-of-type {
  flex-direction: row;
  justify-content: flex-start;
}

@media (min-width: 960px) {
  .nst-extracted-skill-set-from-job-role-description
    .nst-extracted-skill-set-from-job-role-description-item
    > div:last-of-type {
    justify-content: flex-end;
  }
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div:last-of-type
  > i,
.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div:last-of-type
  > legend {
  font-size: 0.8rem;
  color: var(--green);
  width: fit-content;
  line-height: 1;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div:last-of-type
  > legend {
  padding-right: calc(var(--unit) * 1);
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div:last-of-type[data-already-assigned="true"]
  > i,
.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div:last-of-type[data-already-assigned="true"]
  > legend {
  color: var(--info);
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div
  > div {
  display: flex;
  row-gap: calc(var(--unit) * 0.5);
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div[data-source]
  .nst-badge
  > span
  > i {
  display: block;
  font-style: normal;
  color: var(--info);
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div[data-source="0"]
  .nst-badge,
.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div[data-source="0"]
  .nst-badge
  > span {
  color: var(--primary);
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div[data-source="1"]
  .nst-badge,
.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div[data-source="1"]
  .nst-badge
  > span {
  color: var(--yellow);
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div[data-source="2"]
  .nst-badge,
.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-item
  > div[data-source="2"]
  .nst-badge
  > span {
  color: var(--green);
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-nav {
  border-top: 1px solid var(--off-white);
  height: fit-content;
  min-height: calc(var(--unit) * 3);
  column-gap: 0;
  padding: calc(var(--unit) * 0.5);
  flex-direction: column;
  align-items: flex-start;
}

@media (min-width: 960px) {
  .nst-extracted-skill-set-from-job-role-description
    .nst-extracted-skill-set-from-job-role-nav {
    height: calc(var(--unit) * 3);
    flex-direction: row;
    padding: 0 calc(var(--unit) * 0.5);
    align-items: center;
  }
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-nav
  > legend {
  padding: 0 calc(var(--unit) * 1);
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-nav
  .nst-select.nst-skill-level-select {
  outline: none;
  background: none;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-nav
  .nst-select.nst-skill-level-select,
.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-nav
  .nst-select.nst-skill-level-select
  + .nst-select-options {
  cursor: pointer;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-nav
  .nst-select.nst-skill-level-select
  + .nst-select-options
  > ol,
.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-nav
  .nst-select.nst-skill-level-select
  + .nst-select-options
  > ol
  > li {
  cursor: pointer;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-nav
  .nst-select.nst-skill-level-select
  + .nst-select-options
  > .nst-label {
  display: none !important;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-cycle-btn {
  border: none;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-cycle-btn,
.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-cycle-btn[disabled] {
  background-color: transparent !important;
  background: none !important;
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-cycle-btn
  > i {
  color: var(--grey);
}

.nst-extracted-skill-set-from-job-role-description
  .nst-extracted-skill-set-from-job-role-description-cycle-btn:hover
  > i {
  color: var(--dark-grey);
}

.nst-extract-skills-from-job-role-description {
  width: 100%;
}

.nst-extract-skills-from-job-role-description > ol {
  display: flex;
  flex-direction: column;
  row-gap: calc(var(--unit) * 1);
  padding: calc(var(--unit) * 1);
  list-style: none;
}

.nst-extract-skills-from-job-role-description > ol,
.nst-extract-skills-from-job-role-description > ol > li {
  width: 100%;
  overflow-x: hidden;
  height: fit-content;
  box-sizing: border-box;
  overflow: visible;
  margin: 0;
}

.nst-extract-skills-from-job-role-description > ol > li {
  padding: 0;
  z-index: 1;
}

.nst-extract-skills-from-job-role-description > ol > li[data-highlight="true"] {
  background-color: var(--lightest-primary);
  border-radius: var(--unit);
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(1) {
  z-index: 99;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(2) {
  z-index: 98;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(3) {
  z-index: 97;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(4) {
  z-index: 96;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(5) {
  z-index: 95;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(6) {
  z-index: 94;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(7) {
  z-index: 93;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(8) {
  z-index: 92;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(9) {
  z-index: 91;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(10) {
  z-index: 90;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(11) {
  z-index: 89;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(12) {
  z-index: 88;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(13) {
  z-index: 87;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(14) {
  z-index: 86;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(15) {
  z-index: 85;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(16) {
  z-index: 84;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(17) {
  z-index: 83;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(18) {
  z-index: 82;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(19) {
  z-index: 81;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(20) {
  z-index: 80;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(21) {
  z-index: 79;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(22) {
  z-index: 78;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(23) {
  z-index: 77;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(24) {
  z-index: 76;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(25) {
  z-index: 75;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(26) {
  z-index: 74;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(27) {
  z-index: 73;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(28) {
  z-index: 72;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(29) {
  z-index: 71;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(30) {
  z-index: 70;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(31) {
  z-index: 69;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(32) {
  z-index: 68;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(33) {
  z-index: 67;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(34) {
  z-index: 66;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(35) {
  z-index: 65;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(36) {
  z-index: 64;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(37) {
  z-index: 63;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(38) {
  z-index: 62;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(39) {
  z-index: 61;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(40) {
  z-index: 60;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(41) {
  z-index: 59;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(42) {
  z-index: 58;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(43) {
  z-index: 57;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(44) {
  z-index: 56;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(45) {
  z-index: 55;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(46) {
  z-index: 54;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(47) {
  z-index: 53;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(48) {
  z-index: 52;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(49) {
  z-index: 51;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(50) {
  z-index: 50;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(51) {
  z-index: 49;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(52) {
  z-index: 48;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(53) {
  z-index: 47;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(54) {
  z-index: 46;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(55) {
  z-index: 45;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(56) {
  z-index: 44;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(57) {
  z-index: 43;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(58) {
  z-index: 42;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(59) {
  z-index: 41;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(60) {
  z-index: 40;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(61) {
  z-index: 39;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(62) {
  z-index: 38;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(63) {
  z-index: 37;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(64) {
  z-index: 36;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(65) {
  z-index: 35;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(66) {
  z-index: 34;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(67) {
  z-index: 33;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(68) {
  z-index: 32;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(69) {
  z-index: 31;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(70) {
  z-index: 30;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(71) {
  z-index: 29;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(72) {
  z-index: 28;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(73) {
  z-index: 27;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(74) {
  z-index: 26;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(75) {
  z-index: 25;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(76) {
  z-index: 24;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(77) {
  z-index: 23;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(78) {
  z-index: 22;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(79) {
  z-index: 21;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(80) {
  z-index: 20;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(81) {
  z-index: 19;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(82) {
  z-index: 18;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(83) {
  z-index: 17;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(84) {
  z-index: 16;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(85) {
  z-index: 15;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(86) {
  z-index: 14;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(87) {
  z-index: 13;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(88) {
  z-index: 12;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(89) {
  z-index: 11;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(90) {
  z-index: 10;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(91) {
  z-index: 9;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(92) {
  z-index: 8;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(93) {
  z-index: 7;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(94) {
  z-index: 6;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(95) {
  z-index: 5;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(96) {
  z-index: 4;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(97) {
  z-index: 3;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(98) {
  z-index: 2;
}

.nst-extract-skills-from-job-role-description > ol > li:nth-child(99) {
  z-index: 1;
}

.nst-ai-operation-status {
  height: 0%;
  min-height: fit-content;
  transition: height 256ms ease-in;
  background-color: var(--off-white);
  outline: 1px solid var(--white);
  interpolate-size: allow-keywords;
  max-width: calc(100% - var(--unit));
  margin: calc(var(--unit) * 0.5) auto;
}

.nst-ai-operation-status,
.nst-ai-operation-status > progress {
  width: 100%;
  border-radius: var(--unit);
  padding: 0;
}

.nst-ai-operation-status > nav > p > span {
  display: flex;
  flex-wrap: wrap;
}

.nst-ai-operation-status > nav > p > span > strong {
  padding: 0 calc(var(--unit) * 0.5);
}

.nst-ai-operation-status > progress {
  display: block;
  margin: 0;
}

.nst-ai-operation-status > progress:not([value]) {
  /* style rules */
}

.nst-ai-operation-status > progress:not([value])::-webkit-progress-bar {
  background-color: var(--off-white);
  border-radius: var(--unit);
}

.nst-ai-operation-status > progress:not([value])::-webkit-progress-value {
  background-color: var(--primary);
  border-radius: var(--unit);
}

.nst-ai-operation-status > progress:not([value])::-moz-progress-bar {
  /* style rules */
}

.rotateZ360 {
  animation: rotateZ360 1.6s infinite linear;
}

.nst-ai-operation-status button.ns-button[disabled="true"] {
  animation: rotateZ360 1.6s infinite linear;
  pointer-events: none;
}

.nst-ai-operation-status button.ns-button[disabled="false"] {
  pointer-events: all;
}

.nst-toolbar {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  align-items: center;
  min-height: calc(var(--unit) * 4);
  height: calc(var(--unit) * 4);
  column-gap: calc(var(--unit) * 0.5);
  padding: 0 calc(var(--unit) * 0.5);
}

.nst-toolbar[data-variant="inline"] {
  min-height: calc(var(--unit) * 3);
  height: calc(var(--unit) * 3);
  padding: 0;
}

.nst-toolbar[data-sticky="true"] {
  position: sticky;
  background-color: var(--white);
  z-index: 1;
}

.nst-toolbar[data-pad="0"] {
  padding: 0;
}

.nst-toolbar[data-gap="0"] {
  column-gap: 0;
}

.nst-toolbar > svg.lucide,
.nst-toolbar > i.nst-icon {
  margin: calc(var(--unit) * 0.75);
}

.nst-toolbar > svg.lucide + .nst-toolbar > svg.lucide > h5,
.nst-toolbar > i.nst-icon + .nst-toolbar > i.nst-icon > h5,
.nst-toolbar > svg.lucide + .nst-toolbar > svg.lucide > h6,
.nst-toolbar > i.nst-icon + .nst-toolbar > i.nst-icon > h6,
.nst-toolbar > svg.lucide + .nst-toolbar > svg.lucide > p,
.nst-toolbar > i.nst-icon + .nst-toolbar > i.nst-icon > p {
  padding-left: calc(var(--unit) * 0.25);
}

.nst-toolbar h5,
.nst-toolbar h6 {
  font-weight: 600;
}

.nst-toolbar h5,
.nst-toolbar h6,
.nst-toolbar p {
  padding-top: 0;
  padding-bottom: 0;
}

.nst-toolbar h5,
.nst-toolbar h6,
.nst-toolbar p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.nst-toolbar h5 + svg.lucide,
.nst-toolbar h6 + svg.lucide,
.nst-toolbar p + svg.lucide,
.nst-toolbar h5 + i.nst-icon,
.nst-toolbar h6 + i.nst-icon,
.nst-toolbar p + i.nst-icon {
  margin-left: calc(var(--unit) * 0.25);
}

.nst-toolbar > * {
  margin-top: 0;
  margin-bottom: 0;
}

button[data-ui-kit-reset="true"],
a[data-ui-kit-reset="true"] {
  text-decoration: none;
  appearance: none;
  border: none;
  outline: none;
  background-color: transparent;
  color: var(--dark-grey);
  font-size: 1rem;
  font-weight: 600;
  user-select: none;
}

button[data-ui-kit-reset="true"]:not([data-outline="true"]):focus,
a[data-ui-kit-reset="true"]:not([data-outline="true"]):focus {
  outline: none;
}

a[data-ui-kit-reset="true"] {
  color: var(--primary);
}

a[data-ui-kit-reset="true"]:hover {
  color: var(--dark-primary);
}

.nst-button,
.nst-anchor {
  color: var(--dark-grey);
  font-size: 1rem;
  font-weight: 600;
  user-select: none;
  display: flex;
  align-items: center;
  width: fit-content;
  min-width: fit-content;
  height: calc(var(--unit) * 3);
  justify-content: center;
  outline: 1px solid transparent;
  border-radius: calc(var(--unit) * 2);
  cursor: pointer;
  transition: outline-color 256ms ease-in-out,
    background-color 256ms ease-in-out, color 256ms ease-in-out;
}

.nst-button:not([data-outline="true"]):focus,
.nst-anchor:not([data-outline="true"]):focus {
  outline: none;
}

.nst-button,
.nst-anchor,
.nst-button > span,
.nst-anchor > span {
  padding: 0 calc(var(--unit) * 0.5);
}

.nst-button,
.nst-anchor,
.nst-button > span,
.nst-anchor > span,
.nst-button > strong,
.nst-anchor > strong,
.nst-button > span > strong,
.nst-anchor > span > strong {
  overflow: hidden;
  text-overflow: ellipsis;
}

.nst-button > strong,
.nst-anchor > strong,
.nst-button > span > strong,
.nst-anchor > span > strong {
  white-space: nowrap;
}

.nst-button > span,
.nst-anchor > span {
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
  white-space: nowrap;
  min-width: fit-content;
}

.ns-data-hide-on-mobile {
  display: none;
  visibility: hidden;
}

.nst-button > span[data-hide-on-mobile="true"],
.nst-anchor > span[data-hide-on-mobile="true"] {
  display: none;
  visibility: hidden;
}

@media (min-width: 960px) {
  .ns-data-hide-on-mobile {
    display: initial;
    visibility: unset;
  }

  .nst-button > span[data-hide-on-mobile="true"],
  .nst-anchor > span[data-hide-on-mobile="true"] {
    display: initial;
    visibility: unset;
  }
}

.nst-button > svg.lucide,
.nst-anchor > svg.lucide,
.nst-button > i.nst-icon,
.nst-anchor > i.nst-icon {
  margin: calc(var(--unit) * 0.5);
  justify-self: center;
}

.nst-button[data-children="false"],
.nst-anchor[data-children="false"] {
  min-width: calc(var(--unit) * 3);
}

.nst-button[data-children="false"] > svg.lucide,
.nst-anchor[data-children="false"] > svg.lucide,
.nst-button[data-children="false"] > i.nst-icon,
.nst-anchor[data-children="false"] > i.nst-icon {
  margin: calc(var(--unit) * 0.25);
}

.nst-button:hover,
.nst-anchor:hover {
  color: var(--black);
}

.nst-button:focus,
.nst-anchor:focus {
  outline-color: inherit;
}

.nst-button[data-flat="true"],
.nst-anchor[data-flat="true"],
.nst-button[data-outline="true"],
.nst-anchor[data-outline="true"] {
  color: var(--off-black);
  background-color: transparent;
}

.nst-button[data-flat="true"]:not([data-flat="true"]),
.nst-anchor[data-flat="true"]:not([data-flat="true"]),
.nst-button[data-outline="true"]:not([data-flat="true"]),
.nst-anchor[data-outline="true"]:not([data-flat="true"]) {
  background-color: var(--black);
}

.nst-button[data-outline="true"],
.nst-anchor[data-outline="true"] {
  outline: 1px solid var(--off-white);
  background-color: rgba(0, 0, 0, 0);
}

.nst-button[data-outline="true"]:hover,
.nst-anchor[data-outline="true"]:hover {
  background-color: rgba(85, 120, 235, 0.08);
}

.nst-button[data-variant="primary"],
.nst-anchor[data-variant="primary"] {
  color: var(--white);
  background-color: var(--primary);
}

.nst-button[data-variant="primary"][data-flat="true"],
.nst-anchor[data-variant="primary"][data-flat="true"] {
  color: var(--primary);
  background-color: transparent;
}

.nst-button[data-variant="primary"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="primary"]:hover:not([data-flat="true"]) {
  background-color: var(--primary-highlight);
}

.nst-button[data-variant="primary"]:hover[data-flat="true"],
.nst-anchor[data-variant="primary"]:hover[data-flat="true"] {
  color: var(--primary-highlight);
}

.nst-button[data-variant="interaction"],
.nst-anchor[data-variant="interaction"] {
  color: var(--white);
  background-color: var(--primary-interaction);
}

.nst-button[data-variant="interaction"][data-flat="true"],
.nst-anchor[data-variant="interaction"][data-flat="true"] {
  color: var(--primary-interaction);
  background-color: transparent;
}

.nst-button[data-variant="interaction"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="interaction"]:hover:not([data-flat="true"]) {
  background-color: var(--primary-highlight);
}

.nst-button[data-variant="interaction"]:hover[data-flat="true"],
.nst-anchor[data-variant="interaction"]:hover[data-flat="true"] {
  color: var(--primary-highlight);
}

.nst-button[data-variant="accent"],
.nst-anchor[data-variant="accent"] {
  color: var(--dark-grey);
  background-color: var(--accent);
}

.nst-button[data-variant="accent"][data-flat="true"],
.nst-anchor[data-variant="accent"][data-flat="true"],
.nst-button[data-variant="accent"][data-outline="true"],
.nst-anchor[data-variant="accent"][data-outline="true"] {
  color: var(--accent);
  background-color: transparent;
}

.nst-button[data-variant="accent"][data-outline="true"],
.nst-anchor[data-variant="accent"][data-outline="true"] {
  outline-color: var(--accent);
}

.nst-button[data-variant="accent"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="accent"]:hover:not([data-flat="true"]) {
  background-color: var(--accent-highlight);
}

.nst-button[data-variant="accent"]:hover[data-flat="true"],
.nst-anchor[data-variant="accent"]:hover[data-flat="true"],
.nst-button[data-variant="accent"]:hover[data-outline="true"],
.nst-anchor[data-variant="accent"]:hover[data-outline="true"] {
  color: var(--accent-highlight);
}

.nst-button[data-variant="accent"]:hover[data-outline="true"],
.nst-anchor[data-variant="accent"]:hover[data-outline="true"] {
  outline-color: var(--accent-highlight);
}

.nst-button[data-variant="complementary"],
.nst-anchor[data-variant="complementary"] {
  color: var(--white);
  background-color: var(--complementary);
}

.nst-button[data-variant="complementary"][data-flat="true"],
.nst-anchor[data-variant="complementary"][data-flat="true"],
.nst-button[data-variant="complementary"][data-outline="true"],
.nst-anchor[data-variant="complementary"][data-outline="true"] {
  color: var(--complementary);
  background-color: transparent;
}

.nst-button[data-variant="complementary"][data-outline="true"],
.nst-anchor[data-variant="complementary"][data-outline="true"] {
  outline-color: var(--complementary);
}

.nst-button[data-variant="complementary"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="complementary"]:hover:not([data-flat="true"]) {
  background-color: var(--complementary-highlight);
}

.nst-button[data-variant="complementary"]:hover[data-flat="true"],
.nst-anchor[data-variant="complementary"]:hover[data-flat="true"],
.nst-button[data-variant="complementary"]:hover[data-outline="true"],
.nst-anchor[data-variant="complementary"]:hover[data-outline="true"] {
  color: var(--complementary-highlight);
}

.nst-button[data-variant="complementary"]:hover[data-outline="true"],
.nst-anchor[data-variant="complementary"]:hover[data-outline="true"] {
  outline-color: var(--complementary-highlight);
}

.nst-button[data-variant="success"],
.nst-anchor[data-variant="success"],
.nst-button[data-variant="green"],
.nst-anchor[data-variant="green"] {
  color: var(--white);
  background-color: var(--green);
}

.nst-button[data-variant="success"][data-flat="true"],
.nst-anchor[data-variant="success"][data-flat="true"],
.nst-button[data-variant="green"][data-flat="true"],
.nst-anchor[data-variant="green"][data-flat="true"],
.nst-button[data-variant="success"][data-outline="true"],
.nst-anchor[data-variant="success"][data-outline="true"],
.nst-button[data-variant="green"][data-outline="true"],
.nst-anchor[data-variant="green"][data-outline="true"] {
  color: var(--green);
  background-color: transparent;
}

.nst-button[data-variant="success"][data-outline="true"],
.nst-anchor[data-variant="success"][data-outline="true"],
.nst-button[data-variant="green"][data-outline="true"],
.nst-anchor[data-variant="green"][data-outline="true"] {
  outline-color: var(--green);
}

.nst-button[data-variant="success"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="success"]:hover:not([data-flat="true"]),
.nst-button[data-variant="green"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="green"]:hover:not([data-flat="true"]) {
  background-color: var(--green-highlight);
}

.nst-button[data-variant="success"]:hover[data-flat="true"],
.nst-anchor[data-variant="success"]:hover[data-flat="true"],
.nst-button[data-variant="green"]:hover[data-flat="true"],
.nst-anchor[data-variant="green"]:hover[data-flat="true"],
.nst-button[data-variant="success"]:hover[data-outline="true"],
.nst-anchor[data-variant="success"]:hover[data-outline="true"],
.nst-button[data-variant="green"]:hover[data-outline="true"],
.nst-anchor[data-variant="green"]:hover[data-outline="true"] {
  color: var(--green-highlight);
}

.nst-button[data-variant="success"]:hover[data-outline="true"],
.nst-anchor[data-variant="success"]:hover[data-outline="true"],
.nst-button[data-variant="green"]:hover[data-outline="true"],
.nst-anchor[data-variant="green"]:hover[data-outline="true"] {
  outline-color: var(--green-highlight);
}

.nst-button[data-variant="failure"],
.nst-anchor[data-variant="failure"],
.nst-button[data-variant="danger"],
.nst-anchor[data-variant="danger"],
.nst-button[data-variant="red"],
.nst-anchor[data-variant="red"] {
  color: var(--white);
  background-color: var(--red);
}

.nst-button[data-variant="failure"][data-flat="true"],
.nst-anchor[data-variant="failure"][data-flat="true"],
.nst-button[data-variant="danger"][data-flat="true"],
.nst-anchor[data-variant="danger"][data-flat="true"],
.nst-button[data-variant="red"][data-flat="true"],
.nst-anchor[data-variant="red"][data-flat="true"],
.nst-button[data-variant="failure"][data-outline="true"],
.nst-anchor[data-variant="failure"][data-outline="true"],
.nst-button[data-variant="danger"][data-outline="true"],
.nst-anchor[data-variant="danger"][data-outline="true"],
.nst-button[data-variant="red"][data-outline="true"],
.nst-anchor[data-variant="red"][data-outline="true"] {
  color: var(--red);
  background-color: transparent;
}

.nst-button[data-variant="failure"][data-outline="true"],
.nst-anchor[data-variant="failure"][data-outline="true"],
.nst-button[data-variant="danger"][data-outline="true"],
.nst-anchor[data-variant="danger"][data-outline="true"],
.nst-button[data-variant="red"][data-outline="true"],
.nst-anchor[data-variant="red"][data-outline="true"] {
  outline-color: var(--red);
}

.nst-button[data-variant="failure"]:hover,
.nst-anchor[data-variant="failure"]:hover,
.nst-button[data-variant="danger"]:hover,
.nst-anchor[data-variant="danger"]:hover,
.nst-button[data-variant="red"]:hover,
.nst-anchor[data-variant="red"]:hover {
  background-color: var(--red-highlight);
}

.nst-button[data-variant="failure"]:hover[data-flat="true"],
.nst-anchor[data-variant="failure"]:hover[data-flat="true"],
.nst-button[data-variant="danger"]:hover[data-flat="true"],
.nst-anchor[data-variant="danger"]:hover[data-flat="true"],
.nst-button[data-variant="red"]:hover[data-flat="true"],
.nst-anchor[data-variant="red"]:hover[data-flat="true"],
.nst-button[data-variant="failure"]:hover[data-outline="true"],
.nst-anchor[data-variant="failure"]:hover[data-outline="true"],
.nst-button[data-variant="danger"]:hover[data-outline="true"],
.nst-anchor[data-variant="danger"]:hover[data-outline="true"],
.nst-button[data-variant="red"]:hover[data-outline="true"],
.nst-anchor[data-variant="red"]:hover[data-outline="true"] {
  color: var(--red-highlight);
  background-color: transparent;
}

.nst-button[data-variant="failure"]:hover[data-outline="true"],
.nst-anchor[data-variant="failure"]:hover[data-outline="true"],
.nst-button[data-variant="danger"]:hover[data-outline="true"],
.nst-anchor[data-variant="danger"]:hover[data-outline="true"],
.nst-button[data-variant="red"]:hover[data-outline="true"],
.nst-anchor[data-variant="red"]:hover[data-outline="true"] {
  outline-color: var(--red-highlight);
}

.nst-button[data-variant="warning"],
.nst-anchor[data-variant="warning"],
.nst-button[data-variant="yellow"],
.nst-anchor[data-variant="yellow"] {
  color: var(--dak-grey);
  background-color: var(--yellow);
}

.nst-button[data-variant="warning"][data-flat="true"],
.nst-anchor[data-variant="warning"][data-flat="true"],
.nst-button[data-variant="yellow"][data-flat="true"],
.nst-anchor[data-variant="yellow"][data-flat="true"],
.nst-button[data-variant="warning"][data-outline="true"],
.nst-anchor[data-variant="warning"][data-outline="true"],
.nst-button[data-variant="yellow"][data-outline="true"],
.nst-anchor[data-variant="yellow"][data-outline="true"] {
  color: var(--yellow);
  background-color: transparent;
}

.nst-button[data-variant="warning"][data-outline="true"],
.nst-anchor[data-variant="warning"][data-outline="true"],
.nst-button[data-variant="yellow"][data-outline="true"],
.nst-anchor[data-variant="yellow"][data-outline="true"] {
  outline-color: var(--yellow);
}

.nst-button[data-variant="warning"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="warning"]:hover:not([data-flat="true"]),
.nst-button[data-variant="yellow"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="yellow"]:hover:not([data-flat="true"]) {
  background-color: var(--yellow-highlight);
}

.nst-button[data-variant="warning"]:hover[data-flat="true"],
.nst-anchor[data-variant="warning"]:hover[data-flat="true"],
.nst-button[data-variant="yellow"]:hover[data-flat="true"],
.nst-anchor[data-variant="yellow"]:hover[data-flat="true"],
.nst-button[data-variant="warning"]:hover[data-outline="true"],
.nst-anchor[data-variant="warning"]:hover[data-outline="true"],
.nst-button[data-variant="yellow"]:hover[data-outline="true"],
.nst-anchor[data-variant="yellow"]:hover[data-outline="true"] {
  color: var(--yellow-highlight);
}

.nst-button[data-variant="warning"]:hover[data-outline="true"],
.nst-anchor[data-variant="warning"]:hover[data-outline="true"],
.nst-button[data-variant="yellow"]:hover[data-outline="true"],
.nst-anchor[data-variant="yellow"]:hover[data-outline="true"] {
  outline-color: var(--yellow-highlight);
}

.nst-button[data-variant="info"],
.nst-anchor[data-variant="info"] {
  color: var(--white);
  background-color: var(--info);
}

.nst-button[data-variant="info"][data-flat="true"],
.nst-anchor[data-variant="info"][data-flat="true"],
.nst-button[data-variant="info"][data-outline="true"],
.nst-anchor[data-variant="info"][data-outline="true"] {
  color: var(--info);
  background-color: transparent;
}

.nst-button[data-variant="info"][data-outline="true"],
.nst-anchor[data-variant="info"][data-outline="true"] {
  outline-color: var(--info);
}

.nst-button[data-variant="info"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="info"]:hover:not([data-flat="true"]) {
  background-color: var(--info-highlight);
}

.nst-button[data-variant="info"]:hover[data-flat="true"],
.nst-anchor[data-variant="info"]:hover[data-flat="true"],
.nst-button[data-variant="info"]:hover[data-outline="true"],
.nst-anchor[data-variant="info"]:hover[data-outline="true"] {
  color: var(--info-highlight);
}

.nst-button[data-variant="info"]:hover[data-outline="true"],
.nst-anchor[data-variant="info"]:hover[data-outline="true"] {
  outline-color: var(--info-highlight);
}

.nst-button[data-variant="light"],
.nst-anchor[data-variant="light"] {
  color: var(--primary-interaction);
  background-color: var(--white);
}

.nst-button[data-variant="light"][data-flat="true"],
.nst-anchor[data-variant="light"][data-flat="true"],
.nst-button[data-variant="light"][data-outline="true"],
.nst-anchor[data-variant="light"][data-outline="true"] {
  color: var(--primary-interaction);
  background-color: transparent;
  outline: 1px solid var(--off-white) !important;
}

.nst-button[data-variant="light"][data-outline="true"],
.nst-anchor[data-variant="light"][data-outline="true"] {
  outline-color: var(--primary-interaction);
}

.nst-button[data-variant="light"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="light"]:hover:not([data-flat="true"]) {
  background-color: var(--off-white);
}

.nst-button[data-variant="light"]:hover[data-flat="true"],
.nst-anchor[data-variant="light"]:hover[data-flat="true"],
.nst-button[data-variant="light"]:hover[data-outline="true"],
.nst-anchor[data-variant="light"]:hover[data-outline="true"] {
  color: var(--black);
}

.nst-button[data-variant="light"]:hover[data-outline="true"],
.nst-anchor[data-variant="light"]:hover[data-outline="true"] {
  outline-color: var(--black);
}

.nst-button[data-variant="dark"],
.nst-anchor[data-variant="dark"] {
  color: var(--off-white);
  background-color: var(--dark-grey);
}

.nst-button[data-variant="dark"][data-flat="true"],
.nst-anchor[data-variant="dark"][data-flat="true"],
.nst-button[data-variant="dark"][data-outline="true"],
.nst-anchor[data-variant="dark"][data-outline="true"] {
  color: var(--off-white);
  background-color: transparent;
}

.nst-button[data-variant="dark"][data-outline="true"],
.nst-anchor[data-variant="dark"][data-outline="true"] {
  outline-color: var(--dark-grey);
  color: var(--dak-grey);
}

.nst-button[data-variant="dark"][data-outline="true"]:hover,
.nst-anchor[data-variant="dark"][data-outline="true"]:hover {
  color: var(--white);
  background-color: var(--dark-grey);
}

.nst-button[data-variant="dark"][data-flat="true"],
.nst-anchor[data-variant="dark"][data-flat="true"] {
  color: var(--dak-grey);
}

.nst-button[data-variant="dark"]:hover
  self:not([data-flat="true"], [data-outline="true"]),
.nst-anchor[data-variant="dark"]:hover
  self:not([data-flat="true"], [data-outline="true"]) {
  background-color: var(--off-black);
}

.nst-button[data-variant="link"],
.nst-anchor[data-variant="link"] {
  color: var(--white);
  background-color: var(--link);
}

.nst-button[data-variant="link"][data-flat="true"],
.nst-anchor[data-variant="link"][data-flat="true"],
.nst-button[data-variant="link"][data-outline="true"],
.nst-anchor[data-variant="link"][data-outline="true"] {
  color: var(--link);
  background-color: transparent;
}

.nst-button[data-variant="link"][data-outline="true"],
.nst-anchor[data-variant="link"][data-outline="true"] {
  outline-color: var(--link);
}

.nst-button[data-variant="link"]:hover:not([data-flat="true"]),
.nst-anchor[data-variant="link"]:hover:not([data-flat="true"]) {
  background-color: var(--link-highlight);
}

.nst-button[data-variant="link"]:hover[data-flat="true"],
.nst-anchor[data-variant="link"]:hover[data-flat="true"],
.nst-button[data-variant="link"]:hover[data-outline="true"],
.nst-anchor[data-variant="link"]:hover[data-outline="true"] {
  color: var(--link-highlight);
}

.nst-button[data-variant="link"]:hover[data-outline="true"],
.nst-anchor[data-variant="link"]:hover[data-outline="true"] {
  outline-color: var(--link-highlight);
}

.nst-button[data-block="true"],
.nst-anchor[data-block="true"] {
  width: 100%;
  justify-content: flex-start;
}

@media (max-width: 960px) {
  .nst-button[data-hide-on-mobile="true"],
  .nst-anchor[data-hide-on-mobile="true"] {
    display: none;
  }
}

@media (min-width: 960px) {
  .nst-button[data-hide-on-desktop="true"],
  .nst-anchor[data-hide-on-desktop="true"] {
    display: none;
  }
}

.nst-button[data-text-size="s"],
.nst-anchor[data-text-size="s"] {
  min-width: calc(var(--unit) * 0.265);
  height: calc(var(--unit) * 0.265);
}

.nst-button[data-text-size="s"] .nst-icon,
.nst-anchor[data-text-size="s"] .nst-icon {
  font-size: calc(var(--unit) * 1);
  margin-top: calc(var(--unit) * 0.25);
}

.nst-button[disabled] > i,
.nst-anchor[disabled] > i,
.nst-button[aria-disabled="true"] > i,
.nst-anchor[aria-disabled="true"] > i,
.nst-button[disabled] > span,
.nst-anchor[disabled] > span,
.nst-button[aria-disabled="true"] > span,
.nst-anchor[aria-disabled="true"] > span {
  opacity: 0.48;
}

.nst-button[data-variant="primary"][data-outline="true"],
.nst-anchor[data-variant="primary"][data-outline="true"] {
  outline-color: var(--off-white);
  color: var(--primary);
  background-color: var(--white);
}

.nst-button[data-variant="primary"][data-outline="true"]:hover,
.nst-anchor[data-variant="primary"][data-outline="true"]:hover {
  outline-color: var(--primary);
  background-color: var(--white);
}

.nst-button[data-variant="warning"][data-outline="true"],
.nst-anchor[data-variant="warning"][data-outline="true"] {
  outline-color: var(--off-white);
  color: var(--warning);
  background-color: var(--white);
}

.nst-button[data-variant="warning"][data-outline="true"]:hover,
.nst-anchor[data-variant="warning"][data-outline="true"]:hover {
  outline-color: var(--warning);
  background-color: var(--white);
}

.nst-button[data-variant="success"][data-outline="true"],
.nst-anchor[data-variant="success"][data-outline="true"] {
  outline-color: var(--off-white);
  color: var(--success);
}

.nst-button[data-variant="success"][data-outline="true"]:hover,
.nst-anchor[data-variant="success"][data-outline="true"]:hover {
  outline-color: var(--success);
  background-color: var(--white);
}

.nst-ai-springboard {
  display: flex;
  flex-direction: column;
  background: radial-gradient(
        circle at 100% 100%,
        var(--white) 0,
        var(--white) calc(var(--unit) * 0.5) - 1px,
        transparent calc(var(--unit) * 0.5) - 1px
      )
      0% 0% / calc(var(--unit) * 0.5) calc(var(--unit) * 0.5) no-repeat,
    radial-gradient(
        circle at 0 100%,
        var(--white) 0,
        var(--white) calc(var(--unit) * 0.5) - 1px,
        transparent calc(var(--unit) * 0.5) - 1px
      )
      100% 0% / calc(var(--unit) * 0.5) calc(var(--unit) * 0.5) no-repeat,
    radial-gradient(
        circle at 100% 0,
        var(--white) 0,
        var(--white) calc(var(--unit) * 0.5) - 1px,
        transparent calc(var(--unit) * 0.5) - 1px
      )
      0% 100% / calc(var(--unit) * 0.5) calc(var(--unit) * 0.5) no-repeat,
    radial-gradient(
        circle at 0 0,
        var(--white) 0,
        var(--white) calc(var(--unit) * 0.5) - 1px,
        transparent calc(var(--unit) * 0.5) - 1px
      )
      100% 100% / calc(var(--unit) * 0.5) calc(var(--unit) * 0.5) no-repeat,
    linear-gradient(var(--white), var(--white)) 50% 50% /
      calc(100% - calc(var(--unit) * 0.125)) calc(100% - calc(var(--unit) * 1))
      no-repeat,
    linear-gradient(var(--white), var(--white)) 50% 50% /
      calc(100% - calc(var(--unit) * 1)) calc(100% - calc(var(--unit) * 0.125))
      no-repeat,
    linear-gradient(135deg, var(--red) 0%, var(--yellow) 100%);
  border-radius: calc(var(--unit) * 2);
  padding: 1px;
  box-sizing: border-box;
  border-radius: calc(var(--unit) * 2);
  transition: width 256ms ease-out, height 256ms ease-out;
}

.nst-ai-springboard[aria-expanded="true"] {
  width: 100%;
  min-width: unset;
}

.nst-ai-springboard .nst-ai-springboard-content {
  padding: 0 0 calc(var(--unit) * 1) 0;
}

.nst-ai-springboard,
.nst-ai-springboard-action {
  width: 0%;
  min-width: fit-content;
  min-height: fit-content;
}

.nst-ai-springboard-action {
  display: flex;
  column-gap: calc(var(--unit) * 0.5);
  align-items: center;
}

.nst-ai-springboard-action,
.nst-ai-springboard-action > span {
  position: relative;
  padding: 0 calc(var(--unit) * 0.5);
}

.nst-ai-springboard-action > span {
  display: flex;
  flex-direction: column;
  line-height: 1.5;
  text-align: right;
  color: var(--red);
  background: var(--red);
  background: linear-gradient(
    to bottom right,
    var(--red) 0%,
    var(--yellow) 100%
  );
}

.nst-ai-springboard-action > span,
.nst-ai-springboard-action > span > legend {
  font-weight: 600;
  text-align: right;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.nst-ai-springboard-action > span > legend {
  font-size: 0.625rem;
  padding: 0;
  line-height: 1;
  align-self: flex-end;
  color: var(--dark-grey);
}

.nst-ai-springboard > nav.nst-toolbar {
  position: sticky;
  top: 0;
  z-index: 1;
  background-color: var(--white);
  box-shadow: var(--elevation-0);
}

.nst-ai-springboard > div {
  z-index: 0;
}

.nst-page-tabs,
.nst-section-tabs {
  display: flex;
  box-sizing: border-box;
  column-gap: calc(var(--unit) * 0.5);
}

.nst-section-tabs {
  width: 100%;
}

.nst-page-tabs,
.nst-section-tabs,
.nst-page-tabs > ol,
.nst-section-tabs > ol {
  max-width: 100%;
}

.nst-page-tabs > ol,
.nst-section-tabs > ol {
  display: inline-flex;
  list-style: none;
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  flex: 1 0 auto;
  /* max-width: calc(100% - calc(var(--unit) * 3.5)); */
}

.nst-page-tabs > ol:has(+ .nst-select-wrap > .nst-button[hidden]),
.nst-section-tabs > ol:has(+ .nst-select-wrap > .nst-button[hidden]) {
  max-width: 100%;
}

.nst-page-tabs > ol,
.nst-section-tabs > ol,
.nst-page-tabs > ol > li,
.nst-section-tabs > ol > li {
  height: calc(var(--unit) * 3);
  padding: 0;
  margin: 0;
}

.nst-page-tabs > ol > li,
.nst-section-tabs > ol > li {
  display: inline;
}

.nst-page-tabs > ol::-webkit-scrollbar,
.nst-section-tabs > ol::-webkit-scrollbar {
  display: none;
}

.nst-page-tabs .nst-select-options .nst-page-tab,
.nst-section-tabs .nst-select-options .nst-page-tab,
.nst-page-tabs .nst-select-options .nst-section-tab,
.nst-section-tabs .nst-select-options .nst-section-tab {
  width: 100%;
}

.nst-page-tabs {
  height: calc(var(--unit) * 4);
  background-color: transparent;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
  align-items: flex-end;
  padding-right: 0;
}

.nst-page-tabs,
.nst-page-tabs > ol {
  width: 100%;
}

.nst-page-tabs > ol {
  column-gap: calc(var(--unit) * 0.5);
}

.nst-page-tabs[data-sticky="true"] {
  background-color: transparent;
}

.nst-page-tabs[data-sticky="true"] > ol {
  background-color: var(--bg);
}

.nst-section-tabs {
  height: calc(var(--unit) * 3);
}

.nst-section-tabs,
.nst-section-tabs > ol {
  width: fit-content;
  border-radius: calc(var(--unit) * 1.5);
}

.nst-section-tabs > ol {
  position: relative;
  background-color: var(--lightest-primary);
}

.nst-section-tabs
  .nst-select-options
  .nst-section-tab:not([aria-selected="true"]) {
  background-color: transparent;
}

.nst-page-tab,
.nst-section-tab {
  display: flex;
  width: fit-content;
  height: calc(var(--unit) * 3);
  margin: 0;
  align-items: center;
  text-decoration: none;
  cursor: pointer;
}

.nst-page-tab > svg.lucide,
.nst-section-tab > svg.lucide,
.nst-page-tab > i.nst-icon,
.nst-section-tab > i.nst-icon {
  margin: calc(var(--unit) * 0.5);
}

.nst-page-tab .nst-text-block,
.nst-section-tab .nst-text-block,
.nst-page-tab .nst-text-block > span,
.nst-section-tab .nst-text-block > span {
  width: fit-content;
  white-space: nowrap;
}

.nst-page-tab[aria-selected="true"],
.nst-section-tab[aria-selected="true"] {
  cursor: default;
}

.nst-page-tab {
  padding: 0 calc(var(--unit) * 0.5);
  box-shadow: inset 0 0 0 0 var(--light-grey);
  transition: color 256ms ease-in-out, box-shadow 256ms ease-in-out;
  color: var(--dark-grey);
}

.nst-page-tab:not([aria-selected="true"]):hover,
.nst-page-tab:not([aria-selected="true"]):focus {
  box-shadow: inset 0 -4px 0 -2px var(--light-primary);
}

.nst-page-tab:not([aria-selected="true"]):hover > svg.lucide,
.nst-page-tab:not([aria-selected="true"]):focus > svg.lucide,
.nst-page-tab:not([aria-selected="true"]):hover > i.nst-icon,
.nst-page-tab:not([aria-selected="true"]):focus > i.nst-icon,
.nst-page-tab:not([aria-selected="true"]):hover .nst-text-block,
.nst-page-tab:not([aria-selected="true"]):focus .nst-text-block,
.nst-page-tab:not([aria-selected="true"]):hover .nst-text-block > span,
.nst-page-tab:not([aria-selected="true"]):focus .nst-text-block > span {
  stroke: var(--light-primary);
  color: var(--light-primary);
}

.nst-page-tab[aria-selected="true"] {
  box-shadow: inset 0 -4px 0 -2px var(--primary);
}

.nst-page-tab[aria-selected="true"] > svg.lucide,
.nst-page-tab[aria-selected="true"] > i.nst-icon,
.nst-page-tab[aria-selected="true"] .nst-text-block,
.nst-page-tab[aria-selected="true"] .nst-text-block > span {
  stroke: var(--primary);
  color: var(--primary);
}

.nst-page-tab[aria-selected="true"] {
  box-shadow: inset 0 -4px 0 -2px var(--primary);
}

.nst-section-tab {
  padding: 0 calc(var(--unit) * 1);
  background-color: var(--lightest-primary);
  transition: color 256ms ease-in-out, background-color 256ms ease-in-out;
  border-radius: calc(var(--unit) * 1.5);
}

.nst-section-tab:hover,
.nst-section-tab:focus {
  color: var(--primary);
}

.nst-section-tab[aria-selected="true"] {
  background-color: var(--primary);
}

.nst-section-tab[aria-selected="true"] > svg.lucide,
.nst-section-tab[aria-selected="true"] > i.nst-icon,
.nst-section-tab[aria-selected="true"] .nst-text-block,
.nst-section-tab[aria-selected="true"] .nst-text-block > span {
  stroke: var(--white);
  color: var(--white);
}

.nst-section-tab[aria-selected="true"] {
  background-color: var(--primary);
}

.nst-options-toggle {
  display: flex;
  gap: 1px;
  align-items: center;
  justify-content: center;
  background-color: var(--off-white);
  border-radius: calc(var(--unit) * 2);
  border: 1px solid var(--off-white);
  height: calc(var(--unit) * 3);
  overflow: hidden;
}

.nst-options-toggle label {
  cursor: pointer;
  padding: 0 calc(var(--unit) * 1);
  margin: 0;
  line-height: calc(var(--unit) * 3);
  font-weight: 600;
  color: var(--grey);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: calc(var(--unit) * 12);
  background-color: var(--white);
  user-select: none;
}

.nst-options-toggle label:hover {
  background-color: var(--off-white);
}

.nst-options-toggle label[aria-selected="true"] {
  color: var(--primary);
  background-color: transparent;
}

.nst-options-toggle[data-size="m"] {
  height: calc(var(--unit) * 2);
}

.nst-options-toggle[data-size="m"] label {
  line-height: calc(var(--unit) * 2);
}

.nst-text-block {
  white-space: wrap;
}

.nst-text-block[data-ellipsis="true"],
.nst-text-block[data-ellipsis="true"] > span {
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}

.nst-text-block[data-ellipsis="true"][data-lines="1"] > span,
.nst-text-block[data-ellipsis="true"][data-lines="2"] > span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

.nst-text-block[data-ellipsis="true"][data-lines="1"],
.nst-text-block[data-ellipsis="true"][data-lines="1"] > span {
  word-break: break-all;
}

.nst-text-block[data-ellipsis="true"][data-lines="1"] > span {
  line-clamp: 1;
  -webkit-line-clamp: 1;
}

.nst-text-block[data-ellipsis="true"][data-lines="2"] > span {
  line-clamp: 2;
  -webkit-line-clamp: 2;
}

.nst-text-block[data-ellipsis="true"][data-lines="3"] > span {
  line-clamp: 3;
  -webkit-line-clamp: 3;
}

.nst-skill-level {
  display: flex;
  align-items: center;
}

.nst-skill-level.nst-flex-columns {
  width: fit-content;
}

.nst-skill-level > p {
  width: fit-content;
  color: var(--dark-grey);
  white-space: nowrap;
  padding: 0 calc(var(--unit) * 0.5);
  /* white-space: pre-wrap; */
}

.nst-skill-level > p,
.nst-skill-level > p > span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.nst-skill-level,
.nst-skill-level > ol {
  width: fit-content;
}

.nst-skill-level > ol {
  position: relative;
  list-style: none;
  padding: calc(var(--unit) * 0.5);
  box-sizing: content-box;
}

.nst-skill-level > ol,
.nst-skill-level > ol > li {
  display: flex;
  height: calc(var(--unit) * 1.5);
  margin: 0;
}

.nst-skill-level > ol > li {
  align-items: center;
  justify-content: center;
  padding: 0;
}

.nst-skill-level > ol > li,
.nst-skill-level > ol > li > div {
  position: relative;
}

.nst-skill-level > ol > li,
.nst-skill-level > ol > li[data-size="m"] {
  width: calc(var(--unit) * 1.5);
}

.nst-skill-level > ol > li > div,
.nst-skill-level > ol > li[data-size="m"] > div,
.nst-skill-level > ol > li > div::after,
.nst-skill-level > ol > li[data-size="m"] > div::after,
.nst-skill-level > ol > li > div::before,
.nst-skill-level > ol > li[data-size="m"] > div::before {
  width: calc(var(--unit) * 1);
  height: calc(var(--unit) * 1);
  border-radius: var(--unit);
}

.nst-skill-level > ol > li > div::after,
.nst-skill-level > ol > li[data-size="m"] > div::after {
  width: calc(var(--unit) * 1.5);
  height: calc(var(--unit) * 1.5);
  top: calc(var(--unit) * -0.25);
  left: calc(var(--unit) * -0.25);
  border-radius: calc(var(--unit) * 1.5);
}

.nst-skill-level > ol > li[data-size="s"] {
  width: calc(var(--unit) * 1);
}

.nst-skill-level > ol > li[data-size="s"] > div,
.nst-skill-level > ol > li[data-size="s"] > div::after,
.nst-skill-level > ol > li[data-size="s"] > div::before {
  width: calc(var(--unit) * 0.5);
  height: calc(var(--unit) * 0.5);
  border-radius: 100%;
}

.nst-skill-level > ol > li[data-size="s"] > div::after {
  width: calc(var(--unit) * 1);
  height: calc(var(--unit) * 1);
  top: calc(var(--unit) * -0.25);
  left: calc(var(--unit) * -0.25);
  border-radius: 100%;
}

.nst-skill-level > ol > li > div {
  outline: 1px solid var(--light-grey);
  background-color: var(--off-white);
}

.nst-skill-level > ol > li > div::after,
.nst-skill-level > ol > li > div::before {
  position: absolute;
  display: block;
  padding: 0;
  margin: 0;
}

.nst-skill-level > ol > li > div::after {
  outline: 1px dashed var(--black);
}

.nst-skill-level > ol > li > div::before {
  background-color: var(--success);
}

.nst-skill-level > ol > li > div[data-requirement="true"]::after {
  content: "";
}

.nst-skill-level > ol > li > div[data-active="true"]::before {
  content: "";
}

.nst-skill-level > ol > li[data-tooltip]::before {
  background-color: var(--white);
  color: var(--dark-grey);
}

.nst-skill-level > ol > li[data-tooltip]:hover::before {
  transition-delay: 256ms;
  transform: translate(50%, 100%);
}

.nst-skill-level > ol > li:nth-child(1) > div.active::before {
  opacity: 0;
  animation: 256ms fadeIn forwards;
  animation-delay: 64ms;
  will-change: opacity;
}

.nst-skill-level > ol > li:nth-child(2) > div.active::before {
  opacity: 0;
  animation: 256ms fadeIn forwards;
  animation-delay: 128ms;
  will-change: opacity;
}

.nst-skill-level > ol > li:nth-child(3) > div.active::before {
  opacity: 0;
  animation: 256ms fadeIn forwards;
  animation-delay: 192ms;
  will-change: opacity;
}

.nst-skill-level > ol > li:nth-child(4) > div.active::before {
  opacity: 0;
  animation: 256ms fadeIn forwards;
  animation-delay: 256ms;
  will-change: opacity;
}

.nst-skill-level > ol > li:nth-child(5) > div.active::before {
  opacity: 0;
  animation: 256ms fadeIn forwards;
  animation-delay: 320ms;
  will-change: opacity;
}

.nst-skill-level > ol > li:nth-child(6) > div.active::before {
  opacity: 0;
  animation: 256ms fadeIn forwards;
  animation-delay: 384ms;
  will-change: opacity;
}

.nst-skill-level > ol > li:nth-child(7) > div.active::before {
  opacity: 0;
  animation: 256ms fadeIn forwards;
  animation-delay: 448ms;
  will-change: opacity;
}

.nst-skill-level > ol[data-tooltip]::before {
  background-color: var(--success);
}

.nst-skill-level > ol + p {
  color: var(--success);
}

.nst-skill-level > ol[data-under-requirement="true"] > li > div::before {
  background-color: var(--warning);
}

.nst-skill-level > ol[data-under-requirement="true"][data-tooltip]::before {
  background-color: var(--warning);
}

.nst-skill-level > ol[data-under-requirement="true"] + p {
  color: var(--warning);
}

.nst-skill-level > ol[data-info="true"] > li > div::before,
.nst-skill-level > ol[data-info="info"] > li > div::before {
  background-color: var(--info);
}

.nst-skill-level > ol[data-info="true"][data-tooltip]::before,
.nst-skill-level > ol[data-info="info"][data-tooltip]::before {
  background-color: var(--info);
}

.nst-skill-level > ol[data-info="true"] + p,
.nst-skill-level > ol[data-info="info"] + p {
  color: var(--info);
}

.nst-skill-level > ol[data-info="primary"] > li > div::before {
  background-color: var(--primary);
}

.nst-skill-level > ol[data-info="primary"][data-tooltip]::before {
  background-color: var(--primary);
}

.nst-skill-level > ol[data-info="primary"] + p {
  color: var(--primary);
}

.nst-skill-level > ol[data-info="accent"] > li > div::before {
  background-color: var(--accent);
}

.nst-skill-level > ol[data-info="accent"][data-tooltip]::before {
  background-color: var(--accent);
}

.nst-skill-level > ol[data-info="accent"] + p {
  color: var(--accent);
}

.nst-skill-level > ol[data-info="complementary"] > li > div::before {
  background-color: var(--complementary);
}

.nst-skill-level > ol[data-info="complementary"][data-tooltip]::before {
  background-color: var(--complementary);
}

.nst-skill-level > ol[data-info="complementary"] + p {
  color: var(--complementary);
}

.nst-skill-level > ol[data-info="success"] > li > div::before,
.nst-skill-level > ol[data-info="green"] > li > div::before {
  background-color: var(--green);
}

.nst-skill-level > ol[data-info="success"][data-tooltip]::before,
.nst-skill-level > ol[data-info="green"][data-tooltip]::before {
  background-color: var(--green);
}

.nst-skill-level > ol[data-info="success"] + p,
.nst-skill-level > ol[data-info="green"] + p {
  color: var(--green);
}

.nst-skill-level > ol[data-info="failure"] > li > div::before,
.nst-skill-level > ol[data-info="danger"] > li > div::before,
.nst-skill-level > ol[data-info="red"] > li > div::before {
  background-color: var(--red);
}

.nst-skill-level > ol[data-info="failure"][data-tooltip]::before,
.nst-skill-level > ol[data-info="danger"][data-tooltip]::before,
.nst-skill-level > ol[data-info="red"][data-tooltip]::before {
  background-color: var(--red);
}

.nst-skill-level > ol[data-info="failure"] + p,
.nst-skill-level > ol[data-info="danger"] + p,
.nst-skill-level > ol[data-info="red"] + p {
  color: var(--red);
}

.nst-skill-level > ol[data-info="warning"] > li > div::before,
.nst-skill-level > ol[data-info="yellow"] > li > div::before {
  background-color: var(--yellow);
}

.nst-skill-level > ol[data-info="warning"][data-tooltip]::before,
.nst-skill-level > ol[data-info="yellow"][data-tooltip]::before {
  background-color: var(--yellow);
}

.nst-skill-level > ol[data-info="warning"] + p,
.nst-skill-level > ol[data-info="yellow"] + p {
  color: var(--yellow);
}

.nst-skill-level > ol[data-info="light"] > li > div::before {
  background-color: var(--light);
}

.nst-skill-level > ol[data-info="light"][data-tooltip]::before {
  background-color: var(--light);
}

.nst-skill-level > ol[data-info="light"] + p {
  color: var(--light);
}

.nst-skill-level > ol[data-info="dark"] > li > div::before {
  background-color: var(--dark);
}

.nst-skill-level > ol[data-info="dark"][data-tooltip]::before {
  background-color: var(--dark);
}

.nst-skill-level > ol[data-info="dark"] + p {
  color: var(--dark);
}

.nst-skill-level > ol[data-info="link"] > li > div::before,
.nst-skill-level > ol[data-info="blue"] > li > div::before {
  background-color: var(--blue);
}

.nst-skill-level > ol[data-info="link"][data-tooltip]::before,
.nst-skill-level > ol[data-info="blue"][data-tooltip]::before {
  background-color: var(--blue);
}

.nst-skill-level > ol[data-info="link"] + p,
.nst-skill-level > ol[data-info="blue"] + p {
  color: var(--blue);
}

.nst-logo {
  display: inline-block;
  padding: 0 calc(var(--unit) * 0.5);
  box-sizing: border-box;
  text-align: center;
}

.nst-logo,
.nst-logo > svg {
  vertical-align: baseline;
}

.nst-logo > svg {
  fill: var(--white);
  width: auto;
}

.nst-logo.xs,
.nst-logo.xs > svg {
  height: calc(var(--unit) * 0.5);
}

.nst-logo.s,
.nst-logo.s > svg {
  height: calc(var(--unit) * 1);
}

.nst-logo.m,
.nst-logo.m > svg {
  height: calc(var(--unit) * 1.5);
}

.nst-logo.l,
.nst-logo.l > svg {
  height: calc(var(--unit) * 2);
}

.nst-logo.invert > svg {
  fill: var(--black);
}

.nst-logo[data-variant="icon"] {
  width: calc(var(--unit) * 3);
}

.nst-logo[data-variant="icon"].xs {
  width: calc(var(--unit) * 1.5);
  height: calc(var(--unit) * 1.5);
}

.ns-plans-hero,
.ns-plan-builder,
.ns-vs-comparison,
.ns-faqs,
.ns-inline-cta {
  padding: calc(var(--unit) * 4) 0;
}
.ns-inline-cta[data-bg="white"] {
  background-color: var(--white);
}
.ns-plans-hero,
.ns-plan-builder,
.ns-vs-comparison,
.ns-faqs,
.ns-inline-cta,
.ns-plans-hero > header,
.ns-plan-builder > header,
.ns-vs-comparison > header,
.ns-faqs > header,
.ns-inline-cta > header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  row-gap: calc(var(--unit) * 2);
}
.ns-plans-hero > header,
.ns-plan-builder > header,
.ns-vs-comparison > header,
.ns-faqs > header,
.ns-inline-cta > header {
  text-align: center;
}
.ns-plans-hero > header > p,
.ns-plan-builder > header > p,
.ns-vs-comparison > header > p,
.ns-faqs > header > p,
.ns-inline-cta > header > p {
  max-width: calc(var(--unit) * 40);
}
.ns-plans-cards-container {
  column-gap: calc(var(--unit) * 1);
  row-gap: calc(var(--unit) * 1);
}
.ns-plan-card {
  position: relative;
  padding: calc(var(--unit) * 0.5);
}
.ns-plan-card > img[data-doodle="diamond"] {
  position: absolute;
  top: calc(var(--unit) * -3);
  right: calc(var(--unit) * 4);
}
.ns-plan-card-content {
  padding: calc(var(--unit) * 2);
  row-gap: calc(var(--unit) * 2);
  height: fit-content;
}
.ns-plan-card-content > div {
  row-gap: calc(var(--unit) * 1);
}
.ns-plan-card-content > div > p {
  color: var(--grey);
}
.ns-plan-card-features-list {
}
.ns-plan-card-features-list,
.ns-plan-card-features-list > li {
  padding: calc(var(--unit) * 1);
}
.ns-plan-card-features-list > li {
  display: flex;
  align-items: center;
  column-gap: calc(var(--unit) * 1);
  min-height: calc(var(--unit) * 3);
}
.grain-gradient-green-bkrgd {
  background-image: url("inc/assets/img/pattern.png"),
    linear-gradient(135deg, var(--lightest-green), var(--white) 33%);
  background-repeat: repeat;
  background-color: var(--lightest-green);
}
.grain-gradient-yellow-bkrgd {
  background-image: url("inc/assets/img/pattern.png"),
    linear-gradient(135deg, var(--lightest-yellow), var(--white) 33%);
  background-repeat: repeat;
  background-color: var(--lightest-yellow);
}
.grain-gradient-primary-bkrgd {
  background-image: url("inc/assets/img/pattern.png"),
    linear-gradient(135deg, var(--lightest-primary), var(--white) 33%);
  background-repeat: repeat;
  background-color: var(--lightest-primary);
}
.grain-gradient-red-bkrgd {
  background-image: url("inc/assets/img/pattern.png"),
    linear-gradient(135deg, var(--lightest-red), var(--white) 33%);
  background-repeat: repeat;
  background-color: var(--lightest-red);
}
.grain-gradient-complementary-bkrgd {
  background-image: url("inc/assets/img/pattern.png"),
    linear-gradient(135deg, var(--lightest-complementary), var(--white) 33%);
  background-repeat: repeat;
  background-color: var(--lightest-complementary);
}
.ns-plans-promo,
.ns-core-pillars,
.ns-faqs,
.ns-vs-comparison {
  border-top: 1px solid var(--off-white);
}

.ns-plans-promo > div,
.ns-core-pillars > div {
  padding-top: calc(var(--unit) * 4);
  padding-bottom: calc(var(--unit) * 4);
}

.ns-core-pillars > div {
  padding-top: calc(var(--unit) * 0);
}

.ns-plans-promo-feature {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: calc(var(--unit) * 1);
}

.ns-core-pillars {
  border: none;
  /* box-shadow: 0 -1px 0 0 var(--white); */
}

.ns-plan-builder > div > form nav.ns-nav,
.ns-vs-comparison > div > form nav.ns-nav {
  padding: 0 calc(var(--unit) * 0.5);
}

.ns-plan-builder > div > form > div nav.ns-nav,
.ns-vs-comparison > div > form > div nav.ns-nav {
  /* height: calc(var(--unit) * 3);
  min-height: calc(var(--unit) * 3); */
  border-bottom: 1px solid var(--off-white);
}

.ns-plan-builder > div > form > div nav.ns-nav + div,
.ns-vs-comparison > div > form > div nav.ns-nav + div {
  padding-top: calc(var(--unit) * 0.5);
}

.ns-plan-builder {
  position: relative;
  background-image: url("inc/assets/img/pattern.png"),
    url("inc/assets/img/bg-g2.png"),
    linear-gradient(180deg, var(--bg), var(--off-white));
  background-position: 0% 0%, 50% 96px, 0% 0%;
  background-repeat: repeat, no-repeat, no-repeat;
  background-color: var(--white);
}

.ns-plan-builder > img[data-doodle="bear"] {
  position: absolute;
  top: calc(var(--unit) * 2);
  right: calc(var(--unit) * 2);
}

@media (min-width: 960px) {
  .ns-plan-builder > img[data-doodle="bear"] {
    top: calc(var(--unit) * 4);
    right: 16%;
  }
}

.ns-faqs > div > ul > li {
  cursor: pointer;
  height: fit-content;
  min-height: fit-content;
  border-bottom: 1px solid var(--off-white);
  /* border-radius: calc(var(--unit) * 1); */
}

.ns-faqs > div > ul > li,
.ns-faqs > div > ul > li > div[data-state] {
  transition: background-color 0.32s ease-in-out, height 0.32s ease-in-out,
    min-height 0.32s ease-in-out;
}

.ns-faqs > div > ul > li:first-child {
  border-top-right-radius: calc(var(--unit) * 1);
  border-top-left-radius: calc(var(--unit) * 1);
}
.ns-faqs > div > ul > li:last-child {
  border-bottom-right-radius: calc(var(--unit) * 1);
  border-bottom-left-radius: calc(var(--unit) * 1);
  border-bottom: none;
}

.ns-faqs > div > ul > li[data-state="open"],
.ns-faqs > div > ul > li:hover {
  background-color: var(--white);
}

.ns-faqs > div > ul > li[data-state="closed"] svg[data-state="open"] {
  display: none;
}
.ns-faqs > div > ul > li[data-state="closed"] div[data-state] {
  height: 0;
  overflow: hidden;
  padding: 0;
}

.ns-faqs > div > ul > li[data-state="open"] svg[data-state="closed"] {
  display: none;
}
.ns-faqs > div > ul > li[data-state="open"] div[data-state] {
  height: fit-content;
  min-height: fit-content;
  padding: calc(var(--unit) * 1);
}

.ns-input-text {
  width: 100%;
  height: calc(var(--unit) * 3);
  padding: calc(var(--unit) * 0.5);
  border: 1px solid var(--off-white);
  border-radius: calc(var(--unit) * 0.5);
  font-size: 1rem;
  line-height: 1;
  color: var(--dark-grey);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
}
.ns-input-text::placeholder {
  color: #acb4ce !important;
  outline: none;
}
.ns-input-text:hover {
  border-color: #acb4ce !important;
  outline: none;
}
.ns-input-text:focus {
  border-color: #3d4465 !important;
  outline: none;
}

.ns-checkbox {
  width: calc(var(--unit) * 1);
  height: calc(var(--unit) * 1);
}

.ns-ai-gradient-bkrgd {
  background-image: linear-gradient(135deg, var(--red), var(--yellow));
}

.ns-ai-gradient-text {
  background-image: linear-gradient(135deg, var(--red), var(--yellow));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ns-badge-xs {
  border-radius: calc(var(--unit) * 0.25);
  outline: 1px solid var(--off-white);
  padding: 0 calc(var(--unit) * 0.5);
}

.ns-badge-xs > span {
  white-space: nowrap;
  font-size: 0.625rem;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--primary);
}

.ns-wrap {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.ns-wrap > * {
  width: fit-content;
}

.ns-gap-1 {
  column-gap: calc(var(--unit) * 0.5);
  row-gap: calc(var(--unit) * 0.5);
}

.ns-gap-2 {
  column-gap: var(--unit);
  row-gap: var(--unit);
}

.ns-flex {
  display: flex;
}
.ns-flex-row {
  display: flex;
  flex-direction: row;
}
.ns-flex-col {
  display: flex;
  flex-direction: column;
}

.ns-items-center {
  align-items: center;
}

.ns-justify-center {
  justify-content: center;
}

.ns-w-fit {
  width: fit-content;
}

.ns-w-32 {
  width: 32px;
}

.ns-h-32 {
  height: 32px;
}

.ns-w-48 {
  width: 48px;
}
.ns-w-336 {
  width: 336px;
}

.ns-max-w-256 {
  max-width: 256px;
}
.ns-max-w-384 {
  max-width: 384px;
}
.ns-max-w-448 {
  max-width: 448px;
}
.ns-max-w-512 {
  max-width: 512px;
}
.ns-max-w-768 {
  max-width: 768px;
}

.ns-m-auto {
  margin: auto;
}

.ns-h-48 {
  height: 48px;
}
.ns-min-h-48 {
  min-height: 48px;
}
.ns-min-h-80 {
  min-height: 80px;
}
.ns-min-h-96 {
  min-height: 96px;
}
.ns-min-h-192 {
  min-height: 192px;
}
.ns-h-fit {
  height: fit-content;
}

.ns-h-64 {
  height: 64px;
}
.ns-min-h-64 {
  min-height: 64px;
}
.ns-h-256 {
  height: 256px;
}
.ns-min-h-256 {
  min-height: 256px;
}
.ns-min-h-128 {
  min-height: 128px;
}
.ns-p-0 {
  padding: 0;
}

.ns-p-1 {
  padding: calc(var(--unit) * 0.5);
}

.ns-p-2 {
  padding: calc(var(--unit) * 1);
}
.ns-px-1 {
  padding: 0 calc(var(--unit) * 0.5);
}
.ns-px-2 {
  padding: 0 calc(var(--unit) * 1);
}

.ns-bg-off-white {
  background-color: var(--off-white);
}
.ns-bg-dark-grey {
  background-color: var(--dark-grey);
}
.ns-bg-info {
  background-color: var(--info);
}
.ns-bg-white {
  background-color: var(--white);
}
.ns-bg-bg {
  background-color: var(--bg);
}
.ns-text-white {
  color: var(--white);
}
.ns-rounded-full {
  border-radius: 9999px;
}

.ns-sticky {
  position: sticky;
  top: 0;
  z-index: 2;
}

.ns-top-64 {
  top: 64px;
}

.ns-top-80 {
  top: 80px;
}

.ns-top-96 {
  top: 96px;
}

.ns-outine {
  outline: 1px solid var(--off-white);
}

.ns-glass {
  background: hsl(100deg, 100%, 100%, 0.32);
  backdrop-filter: blur(8px);
  box-shadow: 0px 0px 0px 1px hsl(100deg, 100%, 100%, 0.64),
    1px 2px 4px hsl(0deg, 0%, 0%, 0.08);
  /* border-radius: 32px; */
  color: currentColor;

  /* offset-x | offset-y | blur-radius | color */
  text-shadow: 1px 1px 4px hsl(100deg, 100%, 100%, 0.16);
}

svg.lucide[width="24"] {
  min-width: 24px;
}

@keyframes rotateZ360 {
  0% {
    transform: rotateZ(0deg);
  }

  100% {
    transform: rotateZ(-360deg);
  }
}

@media (max-width: 960px) {
  .ns-hide-on-mobile {
    display: none !important;
  }
}
@media (min-width: 960px) {
  .ns-hide-on-desktop {
    display: none !important;
  }
}

@media (max-width: 960px) {
  .ns-plans-hero-promo {
    max-width: calc(100% - calc(var(--unit) * 2));
  }
  .ns-plans-hero-promo > div {
    flex-direction: column;
    align-items: flex-start;
    padding: calc(var(--unit) * 2);
  }
  .ns-plan-builder > div > form nav.ns-nav[data-header="true"] {
    flex-direction: column;
    row-gap: calc(var(--unit) * 0.5);
    padding: calc(var(--unit) * 0.5);
    height: fit-content;
    text-align: center;
  }
}

.ns-text-underline-on-hover {
  text-decoration: none;
}

.ns-text-underline-on-hover:hover {
  text-decoration: underline;
}

[hidden="true"] {
  display: none !important;
}

.test-class {
  --css-prop:199px;
}