:root {
    --background: 22 35% 95%;
    --foreground: 12 25% 12%;
    --card: 22 30% 92%;
    --card-foreground: 12 25% 12%;
    --popover: 22 30% 92%;
    --popover-foreground: 12 25% 12%;
    --primary: 15 55% 58%;
    --primary-foreground: 22 50% 96%;
    --secondary: 22 30% 78%;
    --secondary-foreground: 12 25% 12%;
    --muted: 22 20% 86%;
    --muted-foreground: 12 15% 45%;
    --accent: 18 40% 78%;
    --accent-foreground: 12 25% 12%;
    --destructive: 0 84% 60%;
    --destructive-foreground: 0 0% 100%;
    --border: 22 25% 84%;
    --input: 22 25% 84%;
    --ring: 15 55% 58%;
    --radius: .5rem;
    --sidebar-background: 12 25% 8%;
    --sidebar-foreground: 22 50% 92%;
    --sidebar-primary: 15 55% 58%;
    --sidebar-primary-foreground: 0 0% 100%;
    --sidebar-accent: 12 20% 14%;
    --sidebar-accent-foreground: 22 50% 92%;
    --sidebar-border: 12 18% 18%;
    --sidebar-ring: 15 55% 58%;
    --olive-950: 12 30% 7%;
    --olive-900: 12 25% 12%;
    --olive-800: 15 20% 20%;
    --olive-700: 18 18% 28%;
    --olive-600: 20 15% 36%;
    --olive-500: 22 12% 46%;
    --olive-400: 24 18% 56%;
    --olive-300: 25 28% 68%;
    --olive-200: 26 38% 80%;
    --olive-100: 28 45% 88%;
    --olive-50: 30 50% 94%;
    --cream: 26 48% 92%;
    --cream-dark: 22 35% 78%;
    --tan: 18 40% 65%;
    --khaki: 15 48% 58%;
    --tw-gradient-to-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-from-position: ;
    --menu-icom-first-line-rotation: 0;
    --menu-icon-first-line-translate-x: 0;
    --menu-icon-first-line-translate-y: 0;
    --menu-icom-middle-line-opacity: 1;
    --menu-icom-last-line-rotation: 0;
    --menu-icon-last-line-translate-x: 0;
    --menu-icon-last-line-translate-y: 0;
}

* {
    border-color: hsl(var(--border));
    text-decoration: inherit !important;
    outline: 0 !important;
}

html {
    scroll-behavior: smooth;
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    font-family: Inter, system-ui, sans-serif;
    font-feature-settings: normal;
    font-variation-settings: normal;
    -webkit-tap-highlight-color: transparent;
}

body {
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
    font-family: Inter, system-ui, sans-serif;
    margin: 0;
    line-height: inherit;
}

.vh-70 {
    height: 70vh;
}

.min-h-600 {
    min-height: 600px !important;
}

.text-cream {
    color: hsl(var(--cream));
}

.text-cream-5 {
    color: hsl(var(--cream) / .5);
}

.text-cream-6 {
    color: hsl(var(--cream) / .6);
}

.text-cream-7 {
    color: hsl(var(--cream) / .7);
}

.text-cream-8 {
    color: hsl(var(--cream) / .8);
}

.text-cream-9 {
    color: hsl(var(--cream) / .9);
}

.text-cream,
.text-cream-5,
.text-cream-6,
.text-cream-7,
.text-cream-8,
.text-cream-9 {
    transition: all .3s cubic-bezier(.4, 0, .2, 1);
}

.hover.text-cream:hover,
.hover.text-cream-5:hover,
.hover.text-cream-6:hover,
.hover.text-cream-7:hover,
.hover.text-cream-8:hover,
.hover.text-cream-9:hover {
    color: hsl(var(--cream));
}

.text-olive-5 {
    color: hsl(var(--olive-500));
}

.text-olive-6 {
    color: hsl(var(--olive-600));
}

.text-olive-7 {
    color: hsl(var(--olive-700)) !important;
}

.text-olive-9 {
    color: hsl(var(--olive-900));
}

.border-cream {
    border-color: hsl(var(--cream) / .5) !important;
}

.border-olive-7 {
    border-color: hsl(var(--olive-700));
}

.border-olive-8 {
    border-color: hsl(var(--olive-800)) !important;
}

.border-olive-8-15 {
    border-color: hsl(var(--olive-800) / .15) !important;
}

.border-olive-9 {
    border-color: hsl(var(--olive-900)) !important;
}

.bg-cream-dark {
    background-color: hsl(var(--cream-dark));
}

.hover.bg-cream:hover {
    background-color: hsl(var(--cream) / .1);
}

.bg-olive-9 {
    background-color: hsl(var(--olive-900));
}

.bg-olive-950 {
    background-color: hsl(var(--olive-950));
}

.bg-olive-950-30 {
    background-color: hsl(var(--olive-950) / .3) !important;
}

.bg-olive-950-40 {
    background-color: hsl(var(--olive-950) / .4) !important;
}

.bg-olive-950-60 {
    background-color: hsl(var(--olive-950) / .6) !important;
}

.min-height-700 {
    min-height: 700px
}

.padding-top-8 {
    padding-top: 8rem;
}

.max-width-32 {
    max-width: 32rem;
}

.hover-bg-olive-9 {
    background-color: transparent;
    transition: all .3s cubic-bezier(.4, 0, .2, 1);
}

.hover-bg-olive-9:hover {
    color: hsl(var(--cream));
    background-color: hsl(var(--olive-900));
}

.inset {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.font-size-3 {
    font-size: 3rem;
}

.font-size-3-7 {
    font-size: 3.75rem;
}

.font-size-8 {
    font-size: 8rem !important;
}

.marquee {
    white-space: nowrap;
    overflow: hidden;
}

.marquee>span {
    animation: marquee 20s linear infinite;
    display: inline-block;
    letter-spacing: .1em;
    text-transform: uppercase;
}

@keyframes marquee {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(calc(-100% + -6.3rem));
    }
}

.bg-gradient-to-t {
    background-image: linear-gradient(to top, var(--tw-gradient-stops));
}

.from-olive-950-70 {
    --tw-gradient-from: hsl(var(--olive-950) / .7) var(--tw-gradient-from-position);
}

.via-transparent {
    --tw-gradient-stops: var(--tw-gradient-from), transparent var(--tw-gradient-via-position), var(--tw-gradient-to);
}

.to-transparent {
    --tw-gradient-to: transparent var(--tw-gradient-to-position);
}

.main-logo {
    height: 27px;
}

#navTopPos {
    display: inline-block;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
}

header {
    transition: all .5s cubic-bezier(.4, 0, .2, 1);
}

header.stuck {
    background-color: hsl(var(--olive-950) / .95);
}

header nav .nav-item .nav-link {
    letter-spacing: .025em;
    font-size: .875rem;
    line-height: 1.25rem;
    padding: .5rem 1rem .5rem !important;
}

header nav .navbar-toggler[aria-expanded="false"] {
    --menu-icom-first-line-rotation: 45deg;
    --menu-icon-first-line-translate-x: 5;
    --menu-icon-first-line-translate-y: -7;
    --menu-icom-last-line-rotation: -45deg;
    --menu-icon-last-line-translate-x: -11;
    --menu-icon-last-line-translate-y: -1;
}

.icon-menu-first-line,
.icon-menu-last-line,
.icon-menu-middle-line {
    transition: all .2s linear;
}

.icon-menu-first-line {
    transform: rotate(var(--menu-icom-first-line-rotation)) translate(var(--menu-icon-first-line-translate-x), var(--menu-icon-first-line-translate-y));
}

.icon-menu-last-line {
    transform: rotate(var(--menu-icom-last-line-rotation)) translate(var(--menu-icon-last-line-translate-x), var(--menu-icon-last-line-translate-y));
}

.icon-menu-middle-line {
    opacity: var(--menu-icom-middle-line-opacity);
}

main>section {
    align-items: center;
}



main section.head img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block;
}

main section .dark-multiply {
    mix-blend-mode: multiply;
}

main section .opacity6>.dark-multiply {
    background-color: hsl(var(--olive-950) / .6);
}

main section.opacity7>.dark-multiply,
main section .opacity7>.dark-multiply {
    background-color: hsl(var(--olive-950) / .7);
}

main section.head .container .padding-30 {
    padding-right: 30%;
}

main section .background-gradient {
    --tw-gradient-to-position: ;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
}

main section .opacity6>.background-gradient {
    --tw-gradient-to: hsl(var(--olive-950) / .6) var(--tw-gradient-to-position);
    --tw-gradient-from: rgb(146 64 14 / .3) var(--tw-gradient-from-position);
    --tw-gradient-stops: var(--tw-gradient-from), hsl(var(--olive-900) / .4) var(--tw-gradient-via-position), var(--tw-gradient-to);
    background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}

main section.opacity7 .background-gradient,
main section .opacity7 .background-gradient {
    --tw-gradient-to: hsl(var(--olive-950) / .7) var(--tw-gradient-to-position);
    --tw-gradient-from: hsl(var(--olive-900) / .5) var(--tw-gradient-from-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
    background-image: linear-gradient(to bottom left, var(--tw-gradient-stops));
}

main section.head h1 {
    font-size: 7rem;
    letter-spacing: -.025em;
    line-height: .85;
    font-family: "DM Serif Display", Georgia, serif;
    align-self: center;
}

main section.head .more-info,
main section.head .button {
    letter-spacing: .025em;
    font-size: .875rem;
    line-height: 1.25rem;
    text-align: center;
}

main section.head .button {
    letter-spacing: .1em;
    text-transform: uppercase;

}

h2 {
    font-size: 4.5rem;
    line-height: 1;
    font-family: "DM Serif Display", Georgia, serif;
}

.how-to-work-grid,
main section.properties .properties-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 4rem;
    column-gap: 3rem;
}


main section.properties .properties-grid svg {
    height: 2rem;
    width: 2rem;
    color: hsl(var(--olive-600));
}

main section.properties .properties-grid h3 {
    color: hsl(var(--olive-900));
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-family: "DM Serif Display", Georgia, serif;
    margin-bottom: .75rem;
}

main section.properties .properties-grid p {
    color: hsl(var(--olive-600));
    line-height: 1.625;
    font-size: .875rem;
}

main section.bottom-brown p {
    max-width: 42rem;
    font-size: 1.125rem;
    line-height: 1.75rem;
}

main section.bottom-cream .thin-bar {
    letter-spacing: .025em;
    font-size: .875rem;
    line-height: 1.25rem;

}

main section.bottom-cream svg {
    width: 2.5rem;
    height: 2.5rem;
}

main section.bottom-cream h2 {
    max-width: 48rem;
    font-size: 3.75rem;
    line-height: 1;
}

main section.bottom-cream a {
    letter-spacing: .1em;
    font-size: .875rem;
    line-height: 1.25rem;
    padding: .875rem 2.5rem;
    transition: all .3s cubic-bezier(.4, 0, .2, 1);
}

main section.bottom-cream a:hover {
    color: hsl(var(--cream));
    background-color: hsl(var(--olive-900));

}

footer img {
    height: 27px;
    object-fit: contain;
}

/* footer a {
    color
} */

.circle-bg-1 {
    top: 10%;
    right: -7.5%;
}

.circle-bg-2 {
    left: 25%;
    bottom: -12%;
    opacity: .5;
}

section.how-to-work h2 {
    font-size: 3.75rem;
    line-height: 1;
    margin-bottom: 4rem;
    margin-left: 20px;
}

section.how-to-work>.container>.first-row {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

section.how-to-work>.container>.second-row {
    grid-template-columns: 2fr 1fr !important;
}

section.how-to-work .numeric-list-item {
    font-family: "DM Serif Display", Georgia, serif;
}

section.how-to-work .second-row svg {
    height: 3rem !important;
    width: 3rem !important;
}

section.how-to-work .second-row p {
    font-size: 1rem !important;
    line-height: 1.5rem !important;
}

section.download {
    background-color: hsl(var(--tan) / .3);
}

section.download form h3 {
    font-family: "DM Serif Display", Georgia, serif;
    font-size: 1.5rem;
    line-height: 2rem;
}

section.download form p {
    line-height: 1.625;
    font-size: .875rem;
}

section.download form span {
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-family: "DM Serif Display", Georgia, serif;
}

section.download form input[type="radio"] {
    display: none;
}

section.download form input[type="radio"]+span {
    width: 1rem;
    height: 1rem;
}

section.download form input[type="radio"]:checked+span {
    border-width: 4px !important;
}

section.download form input[type="email"] {
    background-color: transparent;
    border-width: 0 0 2px 0 !important;
    border-color: hsl(var(--olive-400)) !important;
    outline: none;
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-family: "DM Serif Display", Georgia, serif;
    max-width: 20rem;
    width: 100%;
}

section.download form input[type="submit"] {
    letter-spacing: .1em;
    text-transform: uppercase;
    font-weight: 500;
    font-size: .875rem;
    line-height: 1.25rem;
    padding-top: .75rem;
    padding-bottom: .75rem;
    padding-left: 2rem;
    padding-right: 2rem;
    display: block;
}

@media (max-width: 1199.98px) {
    main section.head h1 {
        font-size: 4.5rem;
    }

    .font-size-8 {
        font-size: 6rem !important;
    }
}

@media (min-width: 992px) {

    main section.head .background,
    main section.head .foreground>div {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .how-to-work .second-row>.image-col {
        position: relative
    }

    .how-to-work .second-row>.image-col img {
        width: 100%;
        height: 100%;
    }

    .how-to-work .second-row>.image-col > div {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

    .how-to-work .second-row>.image-col > h2 {
        bottom: 0;
    }
}

@media (max-width: 991.98px) {
    #navbarSupportedContent {
        margin-top: 20px;
    }

    header nav .nav-item {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    h2,
    .font-size-3-7 {
        font-size: 3rem;
    }

    .font-size-8 {
        font-size: 5rem !important;
    }

    .how-to-work .second-row>.image-col {
        height: 400px;
        left: 0;
    }

    .how-to-work .second-row>.image-col img {
        left: 0px;
        width: 100vw;
        height: 400px;
        display: inline-block;
        object-position: center;
    }

    .how-to-work .second-row>.image-col > div {
        width: 100vw;
        height: 400px;
        left: 0
    }

    .how-to-work .second-row>.image-col > h2 {
        margin-top: 300px
    }

    .font-size-3 {
        font-size: 2.5rem !important;
    }

}

@media (max-width: 767.98px) {
    main section.properties .properties-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    main section.bottom-cream h2 {
        font-size: 1.5rem;
    }

    .font-size-8 {
        font-size: 4rem !important;
    }

    .font-size-3 {
        font-size: 2rem !important;
    }

    .how-to-work-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .how-to-work .second-row>.image-col > h2 {
        font-size: 2.5rem;
    }

    .w-50 {
        width: unset !important;
    }
}

@media (max-width: 575.98px) {
    main section.properties .properties-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    
}