
body {
    margin: 0;
    background: var(--ls-color-white);
    color: var(--ls-color-text);
    font-family: "Montserrat", sans-serif;
    overflow-x: hidden;
}

.container {
    max-width: 1240px;
}

.main-navbar {
    position: fixed;
    inset: 0 0 auto;
    z-index: 1000;
    padding: 14px 0;
}

.global-header,
.main-navbar.is-scrolled {
    background: #2d7b4a;
    box-shadow: 0 14px 36px rgba(8, 30, 18, 0.16);
}

.site-header {
    min-height: 96px;
}

img {
    display: block;
    max-width: 100%;
}

main {
    overflow: hidden;
}

h1,
h2,
h3,
h4 {
    margin: 0;
    color: #0a1013;
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    letter-spacing: 0;
}

a {
    text-decoration: none;
}

.faq-hero {
    padding: 44px 0 68px;
    background: var(--ls-color-white);
}

.faq-hero-row {
    --bs-gutter-x: 0;
    --bs-gutter-y: 32px;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.faq-hero-row > .col-lg-6:first-child {
    flex: 0 0 659px;
    max-width: 659px;
}

.faq-hero-row > .col-lg-6:last-child {
    flex: 0 0 574px;
    max-width: 574px;
}

.faq-hero-copy {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 659px;
    padding-top: 18px;
}

.faq-hero-copy h1 {
    max-width: 615px;
    font-size: 50px;
    line-height: 1.15;
    letter-spacing: -1px;
}

.faq-hero-lead {
    max-width: 610px;
    color: var(--ls-color-text);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.55;
}

.faq-hero-copy .text-style-body {
    max-width: 573px;
    color: var(--ls-color-text);
    font-size: 16px;
    line-height: 1.55;
}

.faq-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.faq-actions .btn {
    min-height: 52px;
    padding: 11px 24px;
    font-size: 16px;
    font-weight: 700;
}

.faq-hero-visual {
    display: flex;
    justify-content: flex-end;
}

.faq-hero-panel {
    width: 574px;
    height: 468px;
    overflow: hidden;
    border-radius: 42px;
    position: relative;
}

.faq-hero-visual-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.faq-stat-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 28px;
    align-items: start;
    margin-top: 74px;
}

.faq-stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    text-align: center;
}

.faq-stat-item img,
.faq-stat-item span {
    height: 50px;
}

.faq-stat-item img {
    width: auto;
    object-fit: contain;
}

.faq-stat-item span {
    display: grid;
    place-items: center;
    color: #67af5c;
    font-size: 43px;
    font-weight: 600;
    line-height: 1.15;
}

.faq-stat-item strong {
    color: var(--ls-color-black);
    font-size: 20px;
    font-weight: 500;
    line-height: 1.15;
}

.faq-jump-section {
    padding: 24px 0 64px;
    background: #ffffff;
}

.faq-jump-title {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    margin-bottom: 24px;
    color: #0a1013;
    letter-spacing: 0;
}

.faq-jump-grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
}

.faq-jump-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}

.faq-jump-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    padding: 0 36px;
    border-radius: 14px;
    background: #eef2f0;
    color: #648373;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.2s, color 0.2s;
}

.faq-jump-btn:hover {
    background: #e0f9e1;
    color: #407e43;
    font-weight: 700;
}

.faq-jump-btn-active,
.faq-jump-btn-active:hover {
    background: #e0f9e1;
    color: #407e43;
    font-weight: 700;
}

.faq-jump-num {
    margin-right: 4px;
}

.faq-content-section {
    padding: 64px 0;
}

.faq-question-block {
    text-align: center;
    max-width: 952px;
    margin: 0 auto 48px;
}

.faq-section-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--ls-color-light-green);
    margin-bottom: 4px;
}

.faq-section-number span {
    color: var(--ls-color-white);
    font-size: 32px;
    font-weight: 600;
    font-family: "Montserrat", sans-serif;
    letter-spacing: -0.88px;
    line-height: 1.15;
}

.faq-section-label {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.45;
    color: var(--ls-color-light-green);
    margin-bottom: 16px;
}

.faq-question-title {
    font-size: 40px;
    line-height: 1.2;
    color: #182f22;
    margin-bottom: 24px;
}

.faq-answer-text {
    max-width: 952px;
    margin: 0 auto;
    font-size: 16px;
    line-height: 1.55;
    color: var(--ls-color-text);
}

.faq-answer-bold {
    font-weight: 700;
    margin-top: 8px;
}

.faq-answer-sub {
    max-width: 710px;
    margin: 16px auto 0;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 600;
    color: var(--ls-color-text);
}

.faq-sub-question {
    text-align: center;
    margin-bottom: 32px;
}

.faq-sub-question-title {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.3;
    color: #182f22;
    margin: 64px auto 12px;
    text-align: center;
}

.faq-sub-question-desc {
    max-width: 752px;
    margin: 0 auto;
    font-size: 16px;
    line-height: 1.55;
    color: #2f3532;
}

.faq-feature-cards-row {
    display: flex;
    gap: 24px;
    justify-content: center;
    margin-bottom: 36px;
}

.faq-feature-card {
    width: 500px;
    padding: 48px;
    border-radius: 32px;
    background: #eef2f0;
    border: 2px solid rgba(0, 0, 0, 0.14);
}

.faq-feature-icon {
    width: 48px;
    height: 42px;
    object-fit: contain;
    margin-bottom: 16px;
}

.faq-feature-card h3 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.45;
    color: #2f3532;
    margin-bottom: 16px;
}

.faq-bullet-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.faq-bullet-list li {
    position: relative;
    padding-left: 22px;
    font-size: 16px;
    line-height: 1.55;
    color: #0a1013;
}

.faq-bullet-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--ls-color-light-green);
}

.faq-result-text {
    text-align: center;
    max-width: 684px;
    margin: 36px auto 0;
    font-size: 16px;
    line-height: 1.55;
    color: #2f3532;
}

.faq-info-cards {
    margin-bottom: 48px;
}

.faq-info-card {
    padding: 36px;
    border-radius: 32px;
    background: #eef2f0;
    border: 2px solid rgba(0, 0, 0, 0.14);
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.faq-info-card h4 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0;
    color: #182f22;
}

.faq-info-card p {
    font-size: 16px;
    line-height: 1.55;
    color: #2f3532;
    margin: 0;
}

.faq-info-card .faq-bullet-list {
    margin: 0;
}

.faq-info-card-full {
    padding: 36px;
}

.faq-included-section {
    padding: 64px 0;
}

.faq-included-media {
    border-radius: 16px;
    overflow: hidden;
}

.faq-included-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 500px;
}

.faq-included-copy {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.faq-included-copy h2 {
    font-size: 40px;
    line-height: 1.2;
}

.faq-included-copy h3 {
    font-size: 22px;
    line-height: 1.4;
}

.faq-included-copy p {
    font-size: 16px;
    line-height: 1.55;
    color: var(--ls-color-text);
}

.faq-how-works-section {
    padding: 64px 0;
}

.faq-how-works-heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
    margin-bottom: 24px;
}

.faq-how-works-heading h2 {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.3;
    color: #182f22;
    max-width: 752px;
}

.faq-how-works-heading p {
    max-width: 752px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    color: #2f3532;
}

.faq-diagram-wrap {
    position: relative;
    width: 100%;
    max-width: 792px;
    height: 765px;
    margin: 0 auto;
    border-radius: 48px;
    overflow: hidden;
    background: #f3f3f3;
}

.faq-diagram-bg-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    z-index: 1;
}

.faq-diagram-steps {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}

.faq-diagram-col {
    position: absolute;
    display: flex;
    flex-direction: column;
    pointer-events: auto;
}

.faq-diagram-col-1 {
    top: 309px;
    left: 33px;
    width: 197px;
}

.faq-diagram-col-2 {
    top: 309px;
    left: 272px;
    width: 236px;
    gap: 22px;
}

.faq-diagram-col-3 {
    top: 304px;
    left: 545px;
    width: 236px;
    gap: 24px;
}

.faq-diagram-step {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.faq-diagram-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: url('/hubfs/web_assets/images/faqs-making-sense-of-features-pricing-and-warranties/diagram-circle.svg') no-repeat center / contain;
}

.faq-diagram-num > span {
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
}

.faq-diagram-steps p {
    font-family: "Montserrat", sans-serif;
    font-size: 13.78px;
    font-weight: 700;
    line-height: 1.55;
    color: #2f3532;
    margin: 0;
}

.faq-different-section {
    padding: 64px 0;
}

.faq-different-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 44px;
}

.faq-different-media {
    position: relative;
    flex: 0 0 573px;
    width: 573px;
    height: 691px;
    border-radius: 42px;
    overflow: hidden;
    background: #e0e0e0;
    padding: 18.74px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.faq-different-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.faq-different-overlay {
    position: relative;
    z-index: 1;
    background: #ffffff;
    border: 1.56px solid rgba(0, 0, 0, 0.05);
    border-radius: 24px;
    padding: 32.79px;
    width: 100%;
}

.faq-different-overlay h2 {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.3;
    color: #182f22;
    margin-bottom: 12.49px;
    max-width: 353px;
}

.faq-different-overlay p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    color: #2f3532;
    margin: 0;
}

.faq-different-grid {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 48px;
    width: 623px;
    max-width: 623px;
}

.faq-different-row-2 {
    display: flex;
    gap: 48px;
    align-items: flex-start;
}

.faq-different-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.faq-different-item-full {
    flex: none;
    width: 100%;
}

.faq-different-item h3 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.45;
    color: #2f3532;
    margin: 0;
}

.faq-different-item p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    color: #2f3532;
    margin: 0;
}

.faq-nsf-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 42px;
    margin-bottom: 48px;
    padding: 0;
    border-radius: 42px;
    background: transparent;
}

.faq-nsf-image-wrap {
    flex: 0 0 265px;
    width: 265px;
    height: 264px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.faq-nsf-badge {
    width: 100%;
    height: 100%;
    object-fit: contain;
    mix-blend-mode: luminosity;
}

.faq-nsf-text {
    flex: 0 1 609px;
    max-width: 609px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.faq-nsf-text p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;
    color: #2f3532;
    margin: 0;
}

.faq-nsf-text p strong {
    font-weight: 700;
}

.faq-scalesolver-section {
    padding: 64px 0;
}

.faq-scalesolver-media {
    border-radius: 30px;
    overflow: hidden;
}

.faq-scalesolver-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 500px;
}

.faq-scalesolver-copy {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.faq-scalesolver-copy h2 {
    font-size: 40px;
    line-height: 1.2;
}

.faq-scalesolver-copy h3 {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.55;
}

.faq-scalesolver-copy p {
    font-size: 16px;
    line-height: 1.55;
    color: var(--ls-color-text);
}

.faq-note {
    font-size: 16px;
    line-height: 1.55;
    color: var(--ls-color-muted);
}

.faq-notice-section {
    padding: 64px 0;
}

.faq-notice-cards {
    --bs-gutter-x: 28px;
    --bs-gutter-y: 28px;
    max-width: 1068px;
    margin: 0 auto;
}

.faq-notice-cards > [class*="col-"] {
    display: flex;
}

.faq-notice-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 12px 12px 36px;
    border-radius: 32px;
    overflow: hidden;
    border: 2px solid rgba(0, 0, 0, 0.14);
    background: #eef2f0;
    height: 100%;
}

.faq-notice-media {
    background: #ffffff;
    height: 247px;
    overflow: hidden;
    border-radius: 24px;
    flex: 0 0 auto;
}

.faq-notice-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.faq-notice-body {
    padding: 0 24px;
    margin-top: 32px;
}

.faq-notice-body h4 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 24px;
    color: #182f22;
}

.faq-notice-card .faq-bullet-list li {
    color: #2f3532;
}

.faq-cta-banner-section {
    padding: 64px 0;
}

.faq-cta-banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 52px;
    min-height: 415px;
    padding: 12px;
    border-radius: 64px;
    overflow: hidden;
    background: linear-gradient(36.02deg, #9d2103 12.289%, #ca2c06 104.57%);
}

.faq-cta-banner-copy {
    position: absolute;
    top: 72px;
    left: 57px;
    z-index: 1;
    width: 366px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.faq-cta-banner-copy h2 {
    font-size: 32px;
    line-height: 1.3;
    color: #ffffff;
    max-width: 354px;
}

.faq-cta-banner-copy p {
    font-size: 16px;
    line-height: 1.55;
    color: #ffffff;
    max-width: 354px;
    margin: -18px 0 0;
}

.faq-cta-banner-copy .btn {
    width: 296px;
    min-height: 48px;
    padding: 10px 22px;
    font-size: 16px;
    line-height: 1.45;
    border-radius: 410px;
}

.faq-cta-banner-copy .btn-cta-green {
    border-width: 2.769px;
    box-shadow: none;
}

.faq-cta-banner-media {
    flex: 0 0 774px;
    width: 774px;
    height: 391px;
    overflow: hidden;
    border-radius: 52px;
    background: #b1b1b1;
}

.faq-cta-banner-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.faq-warranty-cta {
    text-align: center;
    margin-top: 32px;
}

.faq-warranty-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 11px 24px;
    border: 3px solid #df585d;
    border-radius: 444px;
    background: linear-gradient(90deg, #9d2103 0%, #ca2c06 100%);
    color: #ffffff;
    box-shadow: none;
}

.faq-warranty-button:hover,
.faq-warranty-button:focus {
    transform: none;
    background: linear-gradient(90deg, #8f1f04 0%, #bc3209 100%);
    border-color: #df585d;
    color: #ffffff;
    box-shadow: none;
}

.faq-service-section {
    padding: 64px 0 72px;
}

.faq-service-layout {
    display: flex;
    gap: 42px;
    align-items: center;
}

.faq-service-copy {
    flex: 0 0 420px;
    max-width: 420px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.faq-service-copy h2 {
    font-size: 40px;
    line-height: 1.2;
    color: #182f22;
}

.faq-service-eyebrow,
.faq-service-copy h3 {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.55;
    color: #6cb55f;
    letter-spacing: -0.3px;
    margin: 0;
}

.faq-service-body {
    margin: 0;
    color: #2f3532;
    font-size: 16px;
    line-height: 1.55;
}

.faq-service-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.faq-service-media {
    flex: 0 0 734px;
    max-width: 734px;
    height: 725px;
    border-radius: 64px;
    overflow: hidden;
    position: relative;
    background: #b0b0b0;
}

.faq-service-media > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.faq-service-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.faq-service-list li {
    position: relative;
    margin: 0;
    padding-left: 22px;
    color: #2f3532;
    font-size: 16px;
    line-height: 1.55;
}

.faq-service-list li::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #6cb55f;
}

.faq-service-contact-bar {
    position: absolute;
    bottom: 28px;
    left: 28px;
    right: 28px;
    display: flex;
    gap: 17px;
}

.faq-service-contact-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    min-height: 122px;
    padding: 24px 28px;
    background: #ffffff;
    border-radius: 52px;
    text-align: center;
}

.faq-service-contact-item strong {
    font-size: 21px;
    font-weight: 700;
    line-height: 1.3;
    color: #182f22;
}

.faq-service-phone {
    color: #6cb55f;
    font-size: 33px;
    font-weight: 700;
    line-height: 1.15;
}

.faq-service-contact-item-note {
    padding-top: 28px;
    padding-bottom: 28px;
}

.faq-service-support-note {
    max-width: 216px;
    color: #2f3532;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.55;
}

.faq-post-install-section {
    padding: 64px 0;
}

.faq-post-install-section .faq-info-card-full {
    margin-top: 24px;
}

.faq-post-install-section .faq-info-card-full h4 {
    margin-bottom: 12px;
}

.faq-post-install-section .faq-info-card-full p {
    margin-top: 16px;
    font-size: 16px;
    line-height: 1.55;
    color: var(--ls-color-text);
}

.faq-value-grid {
    margin-bottom: 48px;
}

.faq-value-grid h4 {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.55;
    margin-bottom: 16px;
}

.faq-perspective-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 24px 0 0;
    text-align: center;
}

.faq-perspective-block h4 {
    margin: 0;
    max-width: 682px;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
    color: #182f22;
}

.faq-perspective-block p {
    margin: 0;
    max-width: 682px;
    font-size: 16px;
    line-height: 1.55;
    color: var(--ls-color-text);
}

.faq-section6-intro {
    max-width: 1036px;
    margin-bottom: 0;
}

.faq-section6-answer {
    max-width: 821px;
}

.faq-section6-result {
    max-width: 694px;
    margin: 24px auto 0;
    text-align: center;
}

.faq-compare-heading,
.faq-pressure-heading {
    margin-bottom: 24px;
}

.faq-compare-heading .faq-question-title,
.faq-pressure-heading .faq-question-title {
    margin-bottom: 0;
    font-size: 32px;
    line-height: 1.3;
}

.faq-compare-heading .faq-question-title {
    max-width: 668px;
    margin-left: auto;
    margin-right: auto;
}

.faq-pressure-heading .faq-question-title {
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
}

.faq-compare-grid,
.faq-pressure-grid {
    gap: 24px;
}

.faq-compare-grid {
    display: grid;
    grid-template-columns: 267px 376px 308px;
    justify-content: center;
    align-items: stretch;
}

.faq-pressure-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
}

.faq-compare-card,
.faq-pressure-card {
    width: 100%;
    margin: 0;
}

.faq-compare-card {
    height: 100%;
    max-width: 267px;
}

.faq-compare-card-middle {
    max-width: 376px;
}

.faq-compare-card-right {
    max-width: 308px;
}

.faq-pressure-card {
    max-width: 291px;
}

.faq-pressure-card-wide {
    max-width: 376px;
}

.faq-final-cta-section {
    padding: 64px 0 96px;
}

.faq-final-cta {
    position: relative;
    min-height: 579px;
    padding: 103px 82px;
    border-radius: 64px;
    background: linear-gradient(45.41deg, #9d2103 12.289%, #ca2c06 104.57%);
    overflow: hidden;
}

.faq-final-cta-content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 952px;
}

.faq-final-cta-content h2 {
    font-size: 32px;
    line-height: 1.25;
    letter-spacing: -1px;
    color: #7de16d;
    margin: 0;
}

.faq-final-cta-content p {
    margin: 0;
    font-size: 16px;
    line-height: 1.55;
    color: #ffffff;
}

.faq-final-cta-content > p:first-of-type {
    max-width: 726px;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -1px;
}

.faq-final-cta-sub {
    max-width: 952px;
    font-weight: 400;
}

.faq-final-cta-buttons {
    display: flex;
    flex-direction: column;
    gap: 19px;
    margin-top: 8px;
    max-width: 296px;
    align-items: stretch;
}

.faq-final-cta-buttons .btn {
    min-height: 48px;
    padding: 10px 22px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.45;
    text-align: center;
    border-radius: 410px;
}

.faq-final-cta-buttons .btn-cta-green {
    border-width: 2.769px;
    box-shadow: none;
}

.faq-final-cta-phone {
    border: 2.769px solid #ffffff;
    color: #ffffff;
    background: transparent;
}

.faq-final-cta-phone:hover,
.faq-final-cta-phone:focus {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
}

.faq-final-cta-graphic {
    position: absolute;
    top: -46px;
    right: -88px;
    width: 552px;
    height: 662px;
    opacity: 1;
}

.faq-final-cta-graphic img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transform: rotate(13deg);
    transform-origin: center;
}

@media (max-width: 991.98px) {
    .faq-hero-row {
        flex-wrap: wrap;
    }

    .faq-hero-row > .col-lg-6:first-child,
    .faq-hero-row > .col-lg-6:last-child {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .faq-hero-panel {
        width: 100%;
        height: 360px;
    }

    .faq-hero-copy h1 {
        font-size: 36px;
    }

    .faq-stat-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
        margin-top: 48px;
    }

    .faq-question-title {
        font-size: 32px;
    }

    .faq-feature-cards-row {
        flex-direction: column;
        align-items: center;
    }

    .faq-feature-card {
        width: 100%;
        max-width: 500px;
    }

    .faq-different-row {
        flex-direction: column;
        align-items: stretch;
    }

    .faq-different-media {
        flex: none;
        width: 100%;
        height: auto;
        min-height: 500px;
    }

    .faq-different-grid {
        width: 100%;
        max-width: none;
    }

    .faq-different-row-2 {
        flex-direction: column;
        gap: 32px;
    }

    .faq-nsf-content {
        flex-direction: column;
        gap: 32px;
    }

    .faq-nsf-image-wrap {
        flex: none;
        width: 220px;
        height: 220px;
    }

    .faq-nsf-text {
        flex: none;
        max-width: 100%;
    }

    .faq-compare-card,
    .faq-compare-card-middle,
    .faq-compare-card-right,
    .faq-pressure-card,
    .faq-pressure-card-wide {
        max-width: 100%;
    }

    .faq-how-works-section {
        padding: 56px 0;
    }

    .faq-how-works-heading {
        margin-bottom: 28px;
    }

    .faq-diagram-wrap {
        display: grid;
        gap: 20px;
        height: auto;
        max-width: 680px;
        padding: 16px;
        border-radius: 36px;
        overflow: visible;
        background: #f4f7f2;
        box-shadow: 0 18px 44px rgba(24, 47, 34, 0.1);
    }

    .faq-diagram-bg-img {
        position: relative;
        inset: auto;
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
        object-fit: cover;
        object-position: center top;
        border-radius: 28px;
        background: #ffffff;
    }

    .faq-diagram-steps {
        position: relative;
        inset: auto;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
        pointer-events: auto;
    }

    .faq-diagram-col,
    .faq-diagram-col-1,
    .faq-diagram-col-2,
    .faq-diagram-col-3 {
        position: static;
        width: auto;
        display: contents;
    }

    .faq-diagram-step {
        min-height: 100%;
        flex-direction: row;
        gap: 10px;
        align-items: flex-start;
        padding: 14px;
        border: 1px solid rgba(24, 47, 34, 0.1);
        border-radius: 18px;
        background: #ffffff;
        box-shadow: 0 8px 22px rgba(24, 47, 34, 0.07);
    }

    .faq-diagram-num {
        flex: 0 0 30px;
        width: 30px;
        height: 30px;
    }

    .faq-diagram-steps p {
        font-size: 13px;
        line-height: 1.5;
    }

    .faq-cta-banner {
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        gap: 24px;
        min-height: 0;
        padding: 28px;
        border-radius: 36px;
    }

    .faq-cta-banner-copy {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        max-width: 560px;
        gap: 20px;
    }

    .faq-cta-banner-copy h2,
    .faq-cta-banner-copy p {
        max-width: none;
    }

    .faq-cta-banner-copy p {
        margin: 0;
    }

    .faq-cta-banner-copy .btn {
        width: fit-content;
        max-width: 100%;
        white-space: normal;
    }

    .faq-cta-banner-media {
        flex: none;
        height: 280px;
        width: 100%;
        border-radius: 28px;
    }

    .faq-service-layout {
        flex-direction: column;
        align-items: stretch;
        gap: 32px;
    }

    .faq-service-copy,
    .faq-service-media {
        flex: none;
        max-width: 100%;
    }

    .faq-service-media {
        height: auto;
        min-height: 640px;
        border-radius: 48px;
    }

    .faq-service-contact-bar {
        flex-direction: column;
        left: 20px;
        right: 20px;
        bottom: 20px;
    }

    .faq-final-cta {
        min-height: 0;
        padding: 48px 36px;
        border-radius: 36px;
    }

    .faq-final-cta-graphic {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .faq-hero-copy h1 {
        font-size: 30px;
    }

    .faq-stat-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .faq-jump-row {
        flex-direction: column;
        align-items: stretch;
    }

    .faq-jump-btn {
        text-align: center;
        white-space: normal;
    }

    .faq-question-title {
        font-size: 26px;
    }

    .faq-how-works-heading h2 {
        font-size: 27px;
    }

    .faq-how-works-heading p {
        font-size: 15px;
    }

    .faq-diagram-wrap {
        gap: 16px;
        padding: 12px;
        border-radius: 28px;
    }

    .faq-diagram-bg-img {
        border-radius: 22px;
    }

    .faq-diagram-steps {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .faq-diagram-step {
        padding: 13px;
        border-radius: 16px;
    }

    .faq-diagram-steps p {
        font-size: 12.75px;
    }

    .faq-cta-banner-section {
        padding: 52px 0;
    }

    .faq-cta-banner {
        padding: 20px;
        border-radius: 28px;
        gap: 20px;
    }

    .faq-cta-banner-copy {
        gap: 16px;
    }

    .faq-cta-banner-copy h2 {
        font-size: 27px;
    }

    .faq-cta-banner-copy p {
        font-size: 15px;
    }

    .faq-cta-banner-copy .btn {
        width: 100%;
        min-height: 50px;
        padding: 10px 16px;
        font-size: 15px;
    }

    .faq-cta-banner-media {
        height: 220px;
        border-radius: 22px;
    }

    .faq-sub-question-title {
        font-size: 24px;
    }

    .faq-compare-heading .faq-question-title,
    .faq-pressure-heading .faq-question-title {
        font-size: 26px;
    }

    .faq-different-media {
        min-height: 400px;
    }

    .faq-different-overlay h2 {
        font-size: 24px;
    }

    .faq-different-overlay {
        padding: 24px;
    }

    .faq-included-media img,
    .faq-scalesolver-media img {
        min-height: 300px;
    }

    .faq-notice-cards {
        max-width: 640px;
    }

    .faq-notice-media {
        height: 200px;
    }

    .faq-service-copy h2 {
        font-size: 32px;
    }

    .faq-service-media {
        min-height: 520px;
        border-radius: 36px;
    }

    .faq-service-contact-item {
        min-height: 0;
        padding: 20px 24px;
        border-radius: 32px;
    }

    .faq-service-phone {
        font-size: 29px;
    }

    .faq-final-cta-content h2 {
        font-size: 26px;
    }
}

/* QA: vertically center the final CTA content */
.faq-final-cta {
    display: flex;
    flex-direction: column;
    justify-content: center;
}


/* === HERO TOP-SPACING STANDARDIZATION (nav→hero gap matched to commercial Figma reference, 2026-06-16) === */
@media (min-width: 992px) { .faq-hero { padding-top: 72px !important; } }

/* === FAQ POST-INSTALL CARD CLEANUP — hide empty paragraphs that create large blank gaps 2026-06-17 === */
.faq-post-install-section .faq-info-card-full p:empty { display: none; }
.faq-post-install-section .faq-info-card-full p { margin-top: 0; }
/* === END POST-INSTALL CARD CLEANUP === */

/* === FAQ CTA BANNER FIX (QA 2026-07-03): copy block was position:absolute over a
   right-anchored fixed-width image — heading overlapped the van photo at most
   viewport widths. Put the copy back into flex flow so the two columns can never
   overlap; image column shrinks gracefully instead. === */
@media (min-width: 992px) {
  .faq-cta-banner { justify-content: space-between; }
  .faq-cta-banner-copy {
    position: static !important;
    width: auto !important;
    max-width: 420px;
    flex: 1 1 340px;
    min-width: 0;
    padding: 48px 0 48px 45px;
  }
  .faq-cta-banner-media {
    flex: 0 1 774px !important;
    width: auto !important;
    min-width: 0;
  }
}

/* QA 2026-07-03b: compare cards overflowed 390px viewports by 305px */
@media (max-width: 767px) {
  .faq-compare-grid { display: grid !important; grid-template-columns: 1fr !important; }
  .faq-compare-card { width: 100% !important; max-width: 100% !important; }
}
