:root {
    --color-red-500: lab(55.4814% 75.0732 48.8528);
    --color-red-600: lab(48.4493% 77.4328 61.5452);
    --color-green-50: lab(98.1563% -5.60117 2.75915);
    --color-green-500: lab(70.5521% -66.5147 45.8073);
    --color-green-600: lab(59.0978% -58.6621 41.2579);
    --color-green-800: lab(37.4616% -36.7971 22.9692);
    --color-green-900: lab(30.797% -29.6927 17.382);
    --color-blue-50: lab(96.492% -1.14644 -5.11479);
    --color-blue-600: lab(44.0605% 29.0279 -86.0352);
    --color-blue-800: lab(30.2514% 27.7853 -70.2699);
    --color-blue-900: lab(26.1542% 15.7545 -51.5504);
    --color-purple-400: lab(63.6946% 47.6127 -59.2066);
    --color-gray-50: lab(98.2596% -.247031 -.706708);
    --color-gray-200: lab(91.6229% -.159115 -2.26791);
    --color-gray-300: lab(85.1236% -.612259 -3.7138);
    --color-gray-500: lab(47.7841% -.393182 -10.0268);
    --color-gray-600: lab(35.6337% -1.58697 -10.8425);
    --color-gray-700: lab(27.1134% -.956401 -12.3224);
    --color-gray-800: lab(16.1051% -1.18239 -11.7533);
    --color-gray-900: lab(8.11897% .811279 -12.254);

    --color-theme-product-ansi-green: #1f8a65;
    --color-theme-product-ansi-red: #cf2d56;
    --theme-bg: #f7f7f4;
    --theme-fg: #26251e;
    --color-theme-text: #26251e;

    --image-border-radius: 4px;
    --button-padding-default: .78em 1.35em .8em;
    --button-padding-md-sm: .6em 1.25em .62em;
    --button-padding-sm: .4em .75em .42em;
    --button-padding-xs: .15em .5em;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace
}


a:link,
a:visited,
a:hover,
a:focus,
a:active {
    text-decoration: none;
}

html {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    font-family: "CursorGothic", "CursorGothic Fallback", system-ui, Helvetica Neue, Helvetica, Arial, sans-serif;
    -webkit-tap-highlight-color: transparent;

}

* {
    margin: 0;
    padding: 0;
    text-decoration: none;
    box-sizing: border-box;
    line-height: 1.5;
    tab-size: 4;
    font-family: inherit;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-synthesis: none;
    scrollbar-gutter: stable
}

body {
    background-color: var(--theme-bg);
    color: var(--color-theme-text);
    min-height: 100vh;
    padding-top: 56px;
}

header {
    background-color: var(--theme-bg);
    padding-left: 21.25px;
    padding-right: 21.25px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 50;
    width: 100%;
}

.header-container {
    position: relative;
    z-index: 2;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 21.25px;
    padding-right: 21.25px;
    max-width: 1280px;
    display: grid;
    height: 52px;
    align-items: center;
    grid-template-columns: auto 1fr auto;
}

.logo {
    display: inline-flex;
    position: relative;
    top: 0.2rem;
    left: -2px;
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 1;
    grid-row-end: 2;
}

.nav-bar {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    /* font-weight: 400; */
}

.nav-ul {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style-type: none;
}

.nav-li {
    position: relative;
}

.nav-li-a {
    cursor: pointer;
    font-size: 14px;
    padding-inline: 15px;
    padding-block: 6px;
    background-color: #0000;
    border: 1px solid #0000;
    display: inline-flex;
    color: var(--theme-text);
    font-style: normal;
}

.nav-right {
    gap: 7.96px;
    grid-row-start: 1;
    grid-row-end: 2;
    display: flex;
    align-items: center;
    justify-self: end;
    grid-column-start: 3;
    grid-column-end: -1;
}

.button {
    font-size: 0.875rem;
    padding-top: 0.4em;
    padding-right: 0.75em;
    padding-bottom: 0.42em;
    padding-left: 0.75em;
}

.btn-login {
    background: transparent;
    border-color: transparent;
    border: 1px solid #26251e33;
    color: var(--color-theme-text);
    cursor: pointer;
    font-weight: 400;
    background-color: #0000;
    border-radius: 3.40282e38px;
    justify-content: center;
    align-items: center;
    line-height: 1;
    display: inline-flex;
}

.btn-login:hover {
    background: var(--theme-bg);
}

.btn-download {
    background-color: var(--color-theme-text);
    border: 1px solid var(--color-theme-text);
    color: var(--theme-bg);
    cursor: pointer;
    font-size: .875rem;
    font-weight: 400;
    padding-top: 0.4em;
    padding-right: 0.75em;
    padding-bottom: 0.42em;
    padding-left: 0.75em;
    border-radius: 3.40282e38px;
    justify-content: center;
    align-items: center;
    line-height: 1;
    display: inline-flex;
}

.btn-download:hover {
    background-color: #3b3a33;
    border-color: #3b3a33;
    color: var(--theme-bg);
}

main {
    min-height: 70vh;
    height: 200vh;
}

.section {
    color: var(--color-theme-text);
    background-color: var(--theme-bg);
    padding-top: 4.2rem;
    padding-right: 1.25rem;
    padding-bottom: 4.2rem;
    padding-left: 1.25rem;

}

.section-hero {
    padding-top: 7rem;
    padding-right: 1.25rem;
    padding-bottom: 4.2rem;
    padding-left: 20rem;
    /* padding-left: 21.25px; */
    /* padding-right: 21.25px; */
}

.container {
    max-width: 1300px;
    width: 100%;
    margin-inline: auto;
}

.text-area {
    text-align: left;
    max-width: 65ch;
    margin-bottom: 60px;
}

.left-heading {
    text-wrap: balance;
    font-size: 1.625rem;
    line-height: 1.25;
    font-weight: 400;
    letter-spacing: -.0125em;
}

.cta-button {
    display: flex;
    align-items: center;
    justify-content: start;
    column-gap: 10.625px;
    margin-top: -2rem;
}

.hero-download-button {
    text-align: left;
    color: var(--color-theme-text);
    background-color: var(--color-theme-text);
    border: 1px solid var(--color-theme-text);
    color: var(--theme-bg);
    cursor: pointer;
    font-size: 1rem;
    font-weight: 400;
    padding-top: 1em;
    padding-right: 1em;
    padding-bottom: 1em;
    padding-left: 1em;
    border-radius: 3.40282e38px;
    justify-content: center;
    align-items: center;
    line-height: 1;
    display: inline-flex;
}

.hero-download-button:hover {
    background-color: #3b3a33;
    border-color: #3b3a33;
    color: var(--theme-bg);
}

.hero-image-container {
    margin-top: 5rem;
}

.hero-image {
    border-radius: var(--image-border-radius);
}

.section-trusted-by {
    padding-bottom: 35px;
    padding-top: 0px;
}

.trusted-container {
    /* display: flex; */
    text-align: center;
    /* flex-direction: row; */
}

.trusted-heading {
    margin-bottom: 24px;
}

.trusted-logos {
    display: flex;
    justify-content: space-around;
    gap: 10.5px;
}

.trusted-logo-container {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    height: 6.25rem;
    padding-inline: 7.96875px;
    background-color: #f2f1ed;
    border-radius: var(--image-border-radius);
    width: 100%;
}

.section-demo {
    padding-inline: 0;
    /* display: flex;
    flex-direction: column; */
    /* margin-bottom: 95px; */
    /* gap: 400px; */
}

.demo-images-container {
    margin-bottom: 95px;
    gap: 400px;
}

.section-testimonial {}

.testimonial-container {
    color: var(--theme-fg);
    background-color: var(--theme-bg);
    display: flex;
    flex-direction: column;
}

.testimonial-heading {
    font-size: 2.25rem;
    line-height: 1.2;
    letter-spacing: -0.02rem;
    font-weight: 400;
    margin-bottom: 60px;
    text-wrap: balance;
    text-align: center;
}


/* 
.testimonials {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
    flex-basis: 0 0 calc(33.3333% - 20px);
}

.testimonial-people {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
    width: 100%;
} */

.testimonial-people-container {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    align-items: stretch;
    /* border: 2px solid green; */
}

.testimonial-boxes {
    /* border: 2px solid blue; */
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 180px;
    position: relative;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding-inline: 7.96875px;
    background-color: #f2f1ed;
    border-radius: var(--image-border-radius);
    flex-basis: 100%;
    flex: 1;
    /* flex: 0 0 calc(33.3333% - 20px); */
    /* flex-basis: calc(33.3333% - 20px); */
    flex-wrap: wrap;
    text-align: center;
    flex-shrink: 0;
}

.tt-para {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .005em;
    /* -webkit-line-clamp: 5; */
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
    color: var(--color-theme-text);
    overflow: hidden;
    text-align: left;
    /* margin-inline-start: -8rem; */
    /* margin-left: 1rem; */
    /* padding-bottom: 3rem; */
}

.tt-info-container {
    display: flex;
    align-items: center;
    margin-top: 47px;
    /* display: block; */
}

.tt-img {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--image-border-radius);
    position: relative;
    margin-inline-start: -8rem;
    margin-inline-end: 13.6px;
    /* display: flex;
    justify-content: left;
    align-items: center;
    float: left;
    vertical-align: bottom */
}

.tt-info-text-container {
    display: block;
    text-align: left;
}

.tt-name {
    font-size: 0.8rem;
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: 0.01rem;
    font-style: normal;
    display: block;
}

.tt-designation {
    color: #26251e99;
    font-size: 0.8rem;
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: 0.01rem;
    font-style: normal;
    display: block;
}

.three-columns-news {
    color: var(--color-theme-text);
    background-color: var(--theme-bg);
    margin-left: 13rem;
}

.columns-news-container {
    width: 100%;
    /* margin-block: 47.6px; */
    padding: 71px;
    max-width: 1300px;
    display: block;
}

.news-cta {
    text-align: left;
    max-width: 516px;
    margin-bottom: 24px;
    font-size: 1.625rem;
    line-height: 1.25;
    font-weight: 400;
    letter-spacing: -0.0125rem;
    font-style: normal;
}

.news-container {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    align-items: stretch;
}

.news-column {
    display: flex;
    height: 100%;
    flex-direction: column;
    flex-grow: 1;
    padding-inline: 18px;
    padding-top: 17px;
    padding-bottom: 18px;
    background-color: #f2f1ed;
    border-radius: var(--image-border-radius);
}

.column-text-area {
    flex-grow: 1;
    /* border: 2px solid green; */
    padding-bottom: 2rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}


.news-heading {
    font-size: 1rem;
    line-height: 1.5;
    letter-spacing: 0.005em;
    color: var(--color-theme-text);
    font-weight: 400;
}

.news-para {
    text-wrap: pretty;
    color: #26251e99;
    font-size: 1rem;
    line-height: 1.5;
    letter-spacing: 0.005em;
    font-weight: 400;
}

.news-link {
    /* padding-top: 160px; */
    /* margin-top: 10px; */
    font-size: 1rem;
    line-height: 1.5;
    letter-spacing: 0.005em;
    font-weight: 400;
    color: #f54e00;
    margin-top: auto;
}

.news-img {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    /* margin-top: auto; */
    /* align-items: center; */
    /* border: 2px solid red; */
    /* padding: 0; */
    /* margin-top: 2rem; */
}

.news-img img {
    width: 100%;
    height: auto;
    object-fit: cover;
}


.changelog-container {
    max-width: 1300px;
    width: 100%;
    margin-inline: auto;
}

.changelog-heading {
    color: var(--color-theme-text);
    font-size: 1.625rem;
    line-height: 1.5;
    letter-spacing: -0.0125em;
    font-weight: 400;
}

.changelog-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10.5px;
}

.change-articles {
    display: flex;
    flex-direction: column;
}

.changelog-link {
    padding-bottom: 22px;
    flex-grow: 1;
    position: relative;
    padding-inline: 1.09375rem;
    padding-top: 17px;
    background-color: #f2f1ed;
    border-radius: var(--image-border-radius);
}

.change-para {
    color: var(--theme-fg);
    padding-top: 15px;
}

.change-ver {
    font-size: .875rem;
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: 0.01em;
    border: 1px solid;
    border-color: inherit;
    color: var(--theme-fg);
    border-radius: 3.40282e38px;
    padding: .28em .65em .29em;
    line-height: 1;
    display: inline-flex;
    position: relative;
    top: .03125rem;
}

.change-time {
    color: var(--theme-fg);
    padding-left: 15px;
}

.change-link-below {
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: 0.005em;
    color: #f54e00;
    text-decoration: none;
}