.faq {
    --faq-brand: #0F6E56;
    --faq-brand-dark: #0c5a47;
    --faq-focus: #1D9E75;
    --faq-text: #23241f;
    --faq-text-strong: #23241f;
    --faq-muted: #6b6b6b;
    --faq-desc: #5A6470;
    --faq-line: #D3D1C7;
    --faq-line-soft: #e4e1d8;
    --faq-thead: #F1EFE8;
    --faq-panel: #E1F5EE;
    --faq-panel-line: #9FE1CB;
    --faq-panel-soft: #faf8f3;
    --faq-radius: 12px;
    --faq-radius-button: 8px;
    box-sizing: border-box;
    width: 100%;
    padding: 0 16px;
    color: var(--faq-text);
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.5;
    overflow-wrap: break-word;
}

.faq .title,
.faq h2 {
    color: var(--faq-brand);
    font-weight: 700;
    line-height: 1.25;
}

.faq .title {
    margin: 0 0 20px;
    font-size: 1.7rem;
}

.faq h2 {
    margin: 32px 0 12px;
    font-size: 1.3rem;
}

.faq-section h2 {
    margin: 34px 0 12px;
}

.faq-section h2 a {
    text-decoration: none;
}

.faq-section h2 a:hover,
.faq-section h2 a:focus-visible {
    text-decoration: underline;
}

.faq .faq-entry__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.35;
}

.faq a {
    color: var(--faq-brand);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.faq a:focus-visible,
.faq button:focus-visible {
    outline: 3px solid var(--faq-focus);
    outline-offset: 2px;
}

.subpage .faq.big-container p {
    color: var(--faq-text);
    text-align: left;
}

/* Runtime's later .subpage .big-container p rule otherwise wins. */
.subpage .faq.big-container p.faq-updated {
    color: var(--faq-muted);
}

.subpage .faq.big-container p.faq-desc,
.subpage .faq.big-container p.faq-short {
    color: var(--faq-desc);
}

.faq-crumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 20px;
    padding-top: 12px;
    color: var(--faq-muted);
    font-size: 0.875rem;
}

.faq .faq-crumb a {
    color: var(--faq-muted);
    text-decoration: none;
}

.faq .faq-crumb a:hover,
.faq .faq-crumb a:focus-visible {
    text-decoration: underline;
}

.faq-lead {
    max-width: 70ch;
    margin: 0 0 24px;
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 1.5;
}

.faq-updated {
    margin: 4px 0 28px;
    color: var(--faq-muted);
    font-size: 0.875rem;
}

.faq-desc {
    max-width: 70ch;
    margin: 8px 0 0;
    color: var(--faq-desc);
    font-size: 0.875rem;
    line-height: 1.6;
}

.faq-short {
    max-width: 70ch;
    margin: 2px 0 0;
    color: var(--faq-desc);
    font-size: 0.875rem;
    line-height: 1.6;
}

.faq-count {
    color: var(--faq-muted);
    font-size: 0.875em;
    font-weight: 400;
}

.faq-list {
    margin: 0;
    padding-left: 20px;
}

/* Layui resets li to list-style: none. */
.faq-list li {
    padding: 4px 0;
    list-style: disc;
}

.faq-list--summary li {
    padding: 6px 0;
}

.faq-long {
    margin: 24px 0;
}

.faq-long p {
    margin: 0 0 1em;
}

.faq-long p:last-child {
    margin-bottom: 0;
}

.faq-long table {
    width: 100%;
    margin: 20px 0 12px;
    border-collapse: collapse;
    font-size: 0.9375rem;
}

.faq-long th {
    background: var(--faq-thead);
    font-weight: 700;
    white-space: nowrap;
}

.faq-long th,
.faq-long td {
    padding: 10px 12px;
    border: 1px solid var(--faq-line);
    text-align: left;
    vertical-align: top;
    overflow-wrap: normal;
}

.faq-long table + p {
    margin-top: 0;
    color: var(--faq-muted);
    font-size: 0.875rem;
}

.faq-long ul,
.faq-long ol {
    margin: 0 0 1em;
    padding-left: 24px;
}

.faq-long ul li {
    list-style: disc;
}

.faq-long ol li {
    list-style: decimal;
}

.faq-long li {
    margin: 0 0 6px;
}

.faq-long li:last-child {
    margin-bottom: 0;
}

.faq .faq-long h2 {
    margin: 28px 0 10px;
    padding: 0;
    border: 0;
    font-size: 1.25rem;
}

.faq-long h2 + ul,
.faq-long h2 + ol {
    margin-top: 12px;
}

.faq-long h3 {
    margin: 20px 0 8px;
    color: var(--faq-text-strong);
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.3;
}

.faq-long strong {
    color: var(--faq-text-strong);
}

/* LITE savings calculator: formula box and the widget mounted by faq-lite-calculator.js. */
.faq-long .formula {
    margin: 0 0 1em;
    padding: 14px 16px;
    border-left: 3px solid var(--faq-brand);
    background: var(--faq-thead);
    line-height: 1.7;
}

.faq-long code {
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--faq-thead);
    font-size: 0.875rem;
}

.faq-long .calc {
    margin: 16px 0 24px;
    padding: 20px;
    border: 1px solid var(--faq-line);
    border-radius: var(--faq-radius);
    background: var(--faq-panel-soft);
}

.faq-long .calc label {
    display: block;
    margin-bottom: 14px;
    font-size: 0.875rem;
    font-weight: 600;
}

.faq-long .calc select,
.faq-long .calc input {
    display: block;
    width: 100%;
    max-width: 440px;
    margin-top: 6px;
    padding: 10px 12px;
    border: 1px solid var(--faq-line);
    border-radius: var(--faq-radius-button);
    background: #fff;
    color: var(--faq-text);
    font-family: inherit;
    font-size: 0.9375rem;
}

.faq-long .calc select:focus-visible,
.faq-long .calc input:focus-visible {
    outline: 3px solid var(--faq-focus);
    outline-offset: 2px;
}

.faq-long .calc-out {
    margin-top: 6px;
    padding-top: 14px;
    border-top: 1px solid var(--faq-line-soft);
}

.faq-long .calc-out .r {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    max-width: 440px;
    padding: 7px 0;
}

.faq-long .calc-out .r b,
.faq-long .bench-top b,
.faq-long .annual-h {
    color: var(--faq-brand);
}

.faq-long .calc-out .sub,
.faq-long .bench-sub {
    color: var(--faq-muted);
    font-size: 0.8125rem;
}

.faq-long .calc-out .eq {
    max-width: 560px;
    margin-top: 12px;
    color: var(--faq-muted);
    font-size: 0.8125rem;
}

.faq-long .bench {
    margin: 6px 0 16px;
}

.faq-long .bench-top {
    display: flex;
    justify-content: space-between;
    max-width: 440px;
    font-size: 0.875rem;
    font-weight: 600;
}

.faq-long .bar {
    display: flex;
    max-width: 440px;
    height: 14px;
    margin: 6px 0;
    border-radius: 8px;
    overflow: hidden;
    background: var(--faq-line-soft);
}

.faq-long .bar .used {
    background: var(--faq-line);
}

.faq-long .bar .saved {
    background: var(--faq-focus);
}

.faq-long .annual {
    margin-top: 16px;
    padding: 14px 16px;
    border: 1px solid var(--faq-panel-line);
    border-radius: 10px;
    background: var(--faq-panel);
}

.faq-long .annual-h {
    margin-bottom: 6px;
    font-weight: 700;
}

/* Podcast episodes: embedded video, chapter list and transcript. */
.faq-long .video {
    position: relative;
    margin: 0 0 24px;
    padding-top: 56.25%;
    background: var(--faq-thead);
}

.faq-long .video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.faq-long .meta,
.faq-long .note {
    color: var(--faq-muted);
    font-size: 0.875rem;
}

.faq-long .chapters {
    list-style: none;
    padding-left: 0;
}

.faq-long .chapters li {
    list-style: none;
    padding: 4px 0;
    border-bottom: 1px solid var(--faq-line-soft);
}

.faq-long .chapters a {
    display: inline-block;
    min-width: 3.5em;
    font-variant-numeric: tabular-nums;
}

.faq-long .transcript {
    padding-left: 16px;
    border-left: 3px solid var(--faq-line);
}

.faq-items__question {
    margin: 22px 0 8px;
    color: var(--faq-text-strong);
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.3;
}

.faq-items__answer {
    margin: 0 0 1em;
}

.faq-items__answer p {
    margin: 0 0 1em;
}

.faq-items__answer p:last-child {
    margin-bottom: 0;
}

.faq-next {
    margin: 0;
}

.faq .faq-next__link {
    color: var(--faq-brand);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.faq .faq-next__link:hover,
.faq .faq-next__link:focus-visible {
    color: var(--faq-brand-dark);
}

.faq-sales {
    margin: 40px 0 8px;
    padding: 24px;
    border: 1px solid var(--faq-panel-line);
    border-radius: var(--faq-radius);
    background: var(--faq-panel);
}

.faq-sales h2 {
    margin: 0 0 6px;
    font-size: 1.25rem;
}

.faq .faq-sales p {
    margin: 0 0 16px;
    color: var(--faq-text);
}

.faq .faq-sales__button {
    display: inline-block;
    margin-top: 8px;
    padding: 13px 24px;
    border: 0;
    border-radius: var(--faq-radius-button);
    background: var(--faq-brand);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

.faq .faq-sales__button:hover,
.faq .faq-sales__button:focus-visible {
    background: var(--faq-brand-dark);
    color: #fff;
}

.faqpage .footer .foot_end .menu-item a.a,
.faqpage .footer .foot_end p.copyright {
    color: #fff;
}

@media (min-width: 992px) {
    .subpage .faq.big-container {
        max-width: 820px;
    }
}

@media (max-width: 767px) {
    /* Runtime's .page-isanextgenmaterials .big-container zeroes padding here. */
    .page-isanextgenmaterials .faq.big-container {
        padding: 0 16px;
    }
}

@media (max-width: 575.98px) {
    .faq-long table {
        display: block;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .faq-sales {
        padding: 16px;
    }
}

@media (max-width: 480px) {
    .faq .faq-sales__button {
        display: block;
        text-align: center;
    }
}
