:root {
    --bs-body-font-family: 'Inter', sans-serif;
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-bg: #fff;

    --text-primary: #212529;
    --text-secondary: #4A443E;

    --bg-primary: #242020;
    --bg-secondary: #faf7eb;
}

html {
    min-height: 100vh;
}

body {
    font-family: 'Inter', sans-serif;
    height: 100%;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Playfair Display', serif;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 28px;
}

@media screen and (max-width: 767px) {
    h1, h2, h3, h4, h5, h6 {
        font-size: 2rem;
    }
}

a {
    color: #DB4627;
}

p {
    font-size: 1.25rem;
    margin-bottom: 28px;
    text-align: center;
}

.text-primary {
    color: var(--text-primary) !important;
}

.text-secondary {
    color: var(--text-secondary) !important;
}

.section-title {
    color: #242020;
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 48px;
    letter-spacing: -0.02em;
    margin-bottom: 28px;
    text-align: left;
}

@media screen and (min-width: 768px) {
    .section-title {
        text-align: center;
    }
}

section {
    padding: 96px 32px;
}

header {
    --bs-dark-rgb: 36, 32, 32;

    background-color: var(--bg-primary);
    color: #fff;
    position: relative;
    overflow-y: hidden;
}

header .navbar-toggler {
    --bs-navbar-color: #fff;
}

header .navbar-toggler-icon {
    --bs-navbar-color: #fff;
    --bs-navbar-toggler-icon-bg: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23fff%22%20class%3D%22bi%20bi-list%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M2.5%2012a.5.5%200%200%201%20.5-.5h10a.5.5%200%200%201%200%201H3a.5.5%200%200%201-.5-.5m0-4a.5.5%200%200%201%20.5-.5h10a.5.5%200%200%201%200%201H3a.5.5%200%200%201-.5-.5m0-4a.5.5%200%200%201%20.5-.5h10a.5.5%200%200%201%200%201H3a.5.5%200%200%201-.5-.5%22%2F%3E%3C%2Fsvg%3E');
}

.navbar-brand img {
    max-height: 55px;
}

.navbar-nav {
    --bs-nav-link-font-size: 0.875rem;
    --bs-nav-link-color: #fff;
    --bs-navbar-active-color: #fff !important;
    --bs-nav-link-hover-color: #fff !important;
}

@media screen and (min-width: 992px) {
    .navbar-nav {
        --bs-navbar-nav-link-padding-x: 1.25rem;
    }
    .navbar-nav .nav-item .btn {
        margin-top: 0;
        margin-left: 1.25rem;
    }
}

.navbar-collapse.show, .navbar-collapse.collapsing {
    background-color: #282424;
    border-radius: 12px;
}

.navbar-nav .nav-link:not(.btn) {
    --bs-nav-link-font-weight: 700;
    border-bottom: 4px solid transparent;
}
.navbar-nav .nav-link.active:not(.btn) {
    border-bottom: 4px solid #CF4930;
}

.navbar-nav .nav-item {
    --bs-nav-link-padding-x: 1.25rem;

    display: inline-block;
    padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
}

.navbar-nav .nav-item .nav-link {
    padding-left: 0;
    padding-right: 0;
}

.navbar-nav .nav-item .btn {
    background-color: #CF4930;
    border-radius: 12px;
    color: #fff;
    display: inline-block;
    font-weight: 600;
    margin-top: 0;
    padding-left: var(--bs-nav-link-padding-x);
    padding-right: var(--bs-nav-link-padding-x);
}

@media screen and (max-width: 991px) {
    .navbar-nav .nav-item .btn {
        margin-top: .5rem;
    }
}

header .hero {
    margin-top: 100px;
}

@media screen and (min-width: 1200px) {
    header .hero {
        padding-right: 64px;
        padding-left: 64px;
    }
}

@media screen and (max-width: 1199px) {
    header .hero {
        padding-right: 32px;
        padding-left: 32px;
    }
}

header .hero__copy p {
    margin-bottom: 28px;
}

header .hero__copy .hero__cta {
    display: flex;
    flex-flow: row wrap;
    gap: 0 14px;
}

header .hero__copy .hero__cta__note {
    color: var(--bg-secondary);
    display: block;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5rem;
    margin-top: 16px;
    margin-bottom: 16px;
    width: 100%;
    flex: 1 1 100%;
}

.hero__image {
    padding-top: 40px;
    margin-bottom: -225px;
}

.video {
    background-color: var(--bg-secondary);
    font-size: 1.25rem;
    text-align: left;
}

.video p {
    text-align: left;
}

@media screen and (min-width: 768px) {
    .video {
        text-align: center;
    }
    .video p {
        text-align: center;
    }
}

.video-viewer {
    border-radius: 20px;
}

.video h1 {
    margin-bottom: 28px;
}

.video p {
    color: var(--text-secondary);
    margin-bottom: 28px;
}

.features {
    background-color: var(--bg-primary);
    color: #fff;
}

.features p {
    color: #fff;
    text-align: left;
}

.feature-block {
    align-items: center;
    display: flex;
    gap: 80px;
    flex-flow: row nowrap;
    justify-content: space-between;
    padding-top: 1rem;
    padding-bottom: 1rem;
    margin-top: 80px;
    margin-bottom: 80px;
}

@media screen and (min-width: 992px) {
    .feature-block p {
        max-width: 80%;
    }
}

.feature-block__image {
    margin: 0;
    margin-inline-start: auto;
    margin-inline-end: auto;
}

@media screen and (min-width: 768px) {
    .feature-block--odd .row {
        flex-direction: row-reverse;
    }
    .feature-block__image {
        margin-inline-end: 0;
    }
    .feature-block--odd .feature-block__image {
        margin-inline-start: 0;
        margin-inline-end: auto;
    }
}

.faq {
    background-color: var(--bg-secondary);
}

.faq h2 {
    text-align: left !important;
}

.faq .accordion {
    --bs-accordion-bg: var(--bg-secondary);
    --bs-accordion-active-bg: var(--bg-secondary);
    --bs-accordion-border-color: var(--text-primary);
    --bs-accordion-btn-icon-width: 32px;
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12%2015.4L6%209.4L7.4%208L12%2012.6L16.6%208L18%209.4L12%2015.4Z%22%20fill%3D%22%23131111%22%2F%3E%3C%2Fsvg%3E");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12%2015.4L6%209.4L7.4%208L12%2012.6L16.6%208L18%209.4L12%2015.4Z%22%20fill%3D%22%23131111%22%2F%3E%3C%2Fsvg%3E");
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem #57452469;

    border-bottom: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color);
    border-top: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color);
}

.faq .accordion-header {
    font-family: 'Inter', sans-serif;
    font-size: 1.25rem;
}

.faq .accordion-header .accordion-button {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-weight: 600;
    padding: 28px 1rem;
}

.faq .accordion-body {
    margin-bottom: 28px;
}
.faq .accordion-body p {
    text-align: left;
}

.contact {
    background-color: #242020;
    color: #fff;
}

.contact-block {
    background-color: #433D3866;
    border-radius: 16px;
    color: #fff;
    padding: 16px 24px;
    margin-bottom: 16px;
}

.contact-block a {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.contact-block h3 {
    font-family: 'Inter', sans-serif;
    font-size: 1.25rem;
    line-height: 1.25rem;
    font-weight: 600;
    margin-bottom: 8px;
}

.contact-block h3 img {
    vertical-align: bottom;
}

.contact-block p {
    text-align: left;
    margin-bottom: 0;
}

.contact-block a {
    color: inherit;
}

.download {
    background-color: #4a443e;
    padding: 20px;
}

@media screen and (min-width: 768px) {
    .download {
        padding: 40px;
    }
}

.download__inner {
    background-color: #302C2A;
    border-radius: 16px;
    color: #fff;
    padding: 16px;
    overflow-y: hidden;
}

.download__inner .feature-block__image {
    padding-top: 24px;
    margin-bottom: -150px;
}

.download h2 {
    color: inherit;
}


footer {
    background-color: #242020;
    color: #fff;
    padding: 80px 40px;
}

footer p {
    font-size: 1rem;
    margin-bottom: 0;
    text-align: left;
}

footer .copyright {
    font-size: 0.875rem;
    text-align: left;
}

footer hr {
    margin-bottom: 32px;
    margin-top: 32px;
}

footer .footer__credits {
    align-items: flex-end;
    display: flex;
    flex-flow: row wrap;
    font-size: 1rem;
    justify-content: space-between;
    gap: 16px 0;
    margin-bottom: 24px;
}

footer .footer__credits__other {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: 0 16px;
}

@media screen and (min-width: 768px) {
    footer .footer__terms {
        align-items: flex-end;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
}

footer .footer__terms span {
    display: inline-flex;
    font-size: 0.875rem;
    gap: 0 24px;
}

footer .footer__terms a {
    color: #fff;
    text-decoration: none;
}

footer .footer__terms a:hover {
    text-decoration: underline;
}

@media screen and (max-width: 767px) {
    footer .copyright,
    footer .footer__terms span {
        margin-bottom: 24px;
    }
}

footer .footer__logo {
    object-fit: contain;
    max-width: 280px;
    display: block;
}

.btn-store[href=""] {
    pointer-events: none;
    user-select: none;
}
