/**
 * How It Works — editorial layout (aligned with about-us-page.css)
 */
body.am-bodywrap:has(.page-how-it-works) {
    background: #ffffff !important;
}

.page-how-it-works {
    background: #ffffff;
    --hiw-canvas-bg: #ffffff;
    --hiw-ink: var(--brand-text-primary, #000D3E);
    --hiw-muted: var(--brand-text-muted, #64748B);
    --hiw-cream: #E6F2FF;
    --hiw-pink: #d4e8ff;
    --hiw-blue: #7DB9F9;
    --hiw-accent: linear-gradient(135deg, #7DB9F9 0%, #006EFF 100%);
    --hiw-accent-border: #006EFF;
    --hiw-hero-bg: linear-gradient(
        130deg,
        #ffffff 0%,
        var(--brand-light-blue, #E6F2FF) 55%,
        color-mix(in srgb, var(--brand-sky-blue, #7DB9F9) 22%, #fff) 100%
    );
    --hiw-panel-bg: linear-gradient(
        180deg,
        var(--brand-light-blue, #E6F2FF) 0%,
        #ffffff 100%
    );
    --hiw-steps-panel-bg: var(--brand-light-blue, #E6F2FF);
    --hiw-track-card-bg: var(--brand-panel-gradient, linear-gradient(
        145deg,
        #ffffff 0%,
        var(--brand-light-blue, #E6F2FF) 48%,
        color-mix(in srgb, var(--brand-gold, #E8B84A) 14%, #ffffff) 100%
    ));
    --hiw-shadow: 0 2px 8px rgba(17, 17, 17, 0.04);
    --hiw-radius: 1.5rem;
    --hiw-max: 100%;
    --hiw-gutter: clamp(0.75rem, 2vw, 1.5rem);
    --hiw-section-space: clamp(1.5rem, 4vw, 2.5rem);
    --hiw-panel-pad: clamp(2rem, 4vw, 3rem);
    --hiw-steps-pad-bottom: clamp(0.75rem, 2vw, 1.25rem);
}

.am-main:has(> .page-how-it-works) {
    background: var(--hiw-canvas-bg) !important;
}

body:has(.page-how-it-works) .am-header_two.am-header_eight {
    background: var(--hiw-canvas-bg) !important;
}

/* ------------------------------------------------------------------ */
/* Page grid                                                          */
/* ------------------------------------------------------------------ */
.page-how-it-works > .pb-themesection {
    background: var(--hiw-canvas-bg) !important;
    background-color: var(--hiw-canvas-bg) !important;
    background-image: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
}

/* Gutter wrappers between panels — match page canvas (#ffffff) */
.page-how-it-works > .pb-themesection > .container-fluid,
.page-how-it-works > .pb-themesection > .container,
.page-how-it-works > .pb-themesection > .container-fluid > .row,
.page-how-it-works > .pb-themesection > .container > .row,
.page-how-it-works > .pb-themesection > .container-fluid > .row > [class*="col-"],
.page-how-it-works > .pb-themesection > .container > .row > [class*="col-"],
.page-how-it-works > .pb-themesection:first-child > .container-fluid,
.page-how-it-works > .pb-themesection:first-child > .container,
.page-how-it-works > .pb-themesection:first-child .row,
.page-how-it-works > .pb-themesection:first-child .col-12,
.page-how-it-works .pb-themesection:has(.am-works_contant) > .container-fluid,
.page-how-it-works .pb-themesection:has(.am-works_contant) .row,
.page-how-it-works .pb-themesection:has(.am-works_contant) .col-12,
.page-how-it-works > .pb-themesection:first-child .am-works_contant {
    background: var(--hiw-canvas-bg) !important;
    background-color: var(--hiw-canvas-bg) !important;
    background-image: none !important;
}

.page-how-it-works > .pb-themesection + .pb-themesection {
    margin-top: var(--hiw-section-space) !important;
}

/* Hero → steps: close gap by 20px */
.page-how-it-works > .pb-themesection:first-child + .pb-themesection:has(.hiw-steps-section) {
    margin-top: max(0px, calc(var(--hiw-section-space) - 20px)) !important;
}

.page-how-it-works > .pb-themesection:has(.hiw-steps-section) + .pb-themesection {
    margin-top: clamp(0.75rem, 2vw, 1.25rem) !important;
}

.page-how-it-works > .pb-themesection:first-child {
    margin-top: var(--hiw-section-space) !important;
}

.page-how-it-works > .pb-themesection:last-child {
    margin-bottom: var(--hiw-section-space) !important;
}

.page-how-it-works > .pb-themesection > .container-fluid,
.page-how-it-works > .pb-themesection > .container {
    width: 100% !important;
    max-width: var(--hiw-max) !important;
    margin-inline: auto !important;
    padding-left: var(--hiw-gutter) !important;
    padding-right: var(--hiw-gutter) !important;
}

.page-how-it-works > .pb-themesection > .container-fluid > .row,
.page-how-it-works > .pb-themesection > .container > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.page-how-it-works > .pb-themesection > .container-fluid > .row > [class*="col-"],
.page-how-it-works > .pb-themesection > .container > .row > [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

.page-how-it-works .am-aboutus_section {
    background: var(--hiw-canvas-bg) !important;
    background-color: var(--hiw-canvas-bg) !important;
    background-image: none !important;
}

/* Track learning — white + light blue + gold hint (reference marketing panel) */
.page-how-it-works .am-tracklearning {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box;
    border-radius: 30px;
    border: 1px solid color-mix(in srgb, var(--hiw-accent-border) 28%, transparent);
    box-shadow: var(--hiw-shadow);
    overflow: hidden;
    background: var(--hiw-track-card-bg) !important;
    background-color: transparent !important;
    padding: var(--hiw-panel-pad) clamp(1rem, 3vw, 1.5rem) !important;
}

.page-how-it-works .am-tracklearning > .container {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.page-how-it-works .am-tracklearning_images {
    background: var(--brand-image-frame, color-mix(in srgb, #E8B84A 22%, #E6F2FF)) !important;
    border-radius: 1rem !important;
}

.page-how-it-works .am-tracklearning_activities svg path {
    fill: var(--brand-gold, #E8B84A) !important;
}

.page-how-it-works .am-tracklearning_content .am-section_title_one > span {
    background: var(--brand-light-blue, #E6F2FF) !important;
    color: var(--brand-navy, #0041B6) !important;
    border-color: color-mix(in srgb, var(--brand-sky-blue, #7DB9F9) 55%, transparent) !important;
}

/* ------------------------------------------------------------------ */
/* Shared panel shells (canvas gutters; panels use About Us tones) */
/* ------------------------------------------------------------------ */
.page-how-it-works > .pb-themesection:first-child .am-works,
.page-how-it-works .hiw-steps-panel.tab-content,
.page-how-it-works .am-vision-section,
.page-how-it-works .am-feedback.am-feedback-two,
.page-how-it-works > .pb-themesection.am-joincommunity .am-works {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box;
    border-radius: var(--hiw-radius);
    border: none;
    box-shadow: var(--hiw-shadow);
    overflow: hidden;
}

/* Banner + bottom CTA — soft gradient (same as About Us hero) */
.page-how-it-works > .pb-themesection:first-child .am-works,
.page-how-it-works > .pb-themesection.am-joincommunity .am-works {
    background: var(--hiw-hero-bg) !important;
    background-color: transparent !important;
}

/* Vision — clean white card */
.page-how-it-works .am-vision-section {
    background: #fff !important;
}

/* Testimonials — soft panel gradient (same as About Us feedback) */
.page-how-it-works .am-feedback.am-feedback-two {
    background: var(--hiw-panel-bg) !important;
    background-color: transparent !important;
}

/* ------------------------------------------------------------------ */
/* Typography                                                         */
/* ------------------------------------------------------------------ */
.page-how-it-works .am-content_box h2,
.page-how-it-works .am-content_box h3,
.page-how-it-works .am-section_title h2,
.page-how-it-works .am-section_title_one h2,
.page-how-it-works .am-section_title_two > h2,
.page-how-it-works .am-section_title_three h2,
.page-how-it-works .am-works_info_description h3,
.page-how-it-works .am-works_steps h3 {
    font-family: "Bitter", Georgia, serif !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
    color: var(--hiw-ink) !important;
    line-height: 1.12 !important;
    font-size: clamp(1.75rem, 1.15rem + 1.6vw, 2.5rem) !important;
}

.page-how-it-works .am-works_info_description h3 {
    font-size: clamp(1.35rem, 1rem + 1vw, 1.875rem) !important;
    max-width: none !important;
    margin: 0 0 1rem !important;
}

.page-how-it-works .am-content_box p,
.page-how-it-works .am-content_banner_richtext,
.page-how-it-works .am-content_banner_richtext p,
.page-how-it-works .am-section_title p,
.page-how-it-works .am-left-text p,
.page-how-it-works .am-works_info_description p {
    color: var(--hiw-muted) !important;
    font-size: 1.0625rem !important;
    line-height: 1.65 !important;
}

.page-how-it-works .am-content_box h3 em,
.page-how-it-works .am-content_box h3 strong,
.page-how-it-works .am-section_title h2 em,
.page-how-it-works .am-section_title h2 strong,
.page-how-it-works .am-works_info_description h3 em,
.page-how-it-works .am-works_info_description h3 strong {
    font-style: italic;
    font-weight: 700;
    background: var(--hiw-accent);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

/* ------------------------------------------------------------------ */
/* Hero (first content-banner)                                        */
/* ------------------------------------------------------------------ */
.page-how-it-works > .pb-themesection:first-child .am-works {
    padding: var(--hiw-panel-pad) !important;
    text-align: center;
}

.page-how-it-works > .pb-themesection:first-child .am-page-title-wrap {
    margin: 0;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.page-how-it-works > .pb-themesection:first-child .am-page-title-wrap .am-content_box {
    padding: 0 !important;
    max-width: 52rem;
    margin-inline: auto;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.page-how-it-works > .pb-themesection:first-child .am-joincommunity_btn {
    justify-content: center;
    margin-top: 1.5rem;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* ------------------------------------------------------------------ */
/* Steps — editorial panel + numbered step cards (coaching-type tone)   */
/* ------------------------------------------------------------------ */
.page-how-it-works > .pb-themesection:has(.hiw-steps-section) .row,
.page-how-it-works > .pb-themesection:has(.hiw-steps-section) .col-12,
.page-how-it-works .pb-themesection:has(.hiw-steps-section) .am-works {
    background: var(--hiw-canvas-bg) !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible !important;
    padding: 0 !important;
}

.page-how-it-works .hiw-steps-panel__tabs {
    margin: 0 0 clamp(1.25rem, 3vw, 1.75rem);
    padding-bottom: clamp(1rem, 2.5vw, 1.25rem);
    border-bottom: 1px solid rgba(17, 17, 17, 0.06);
}

.page-how-it-works .hiw-steps-tabs {
    gap: 0.5rem !important;
    justify-content: center;
    flex-wrap: nowrap;
    padding: 0 !important;
    margin: 0 !important;
}

/* Client / Coach — always two pills on one row (override global .am-faqs-tabs column stack) */
.page-how-it-works .hiw-steps-tabs.am-faqs-tabs {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch;
    width: 100%;
}

.page-how-it-works .hiw-steps-tabs.am-faqs-tabs .nav-item {
    flex: 1 1 0;
    min-width: 0;
    width: auto;
    max-width: none;
}

.page-how-it-works .hiw-steps-tabs.am-faqs-tabs .nav-link,
.page-how-it-works .hiw-steps-tabs.am-faqs-tabs button.nav-link {
    width: 100% !important;
    min-width: 0 !important;
}

.page-how-it-works .hiw-steps-tabs .nav-link {
    width: auto !important;
    min-width: 9.5rem;
    padding: 0.7rem 1.35rem !important;
    border-radius: 999px !important;
    border: 1px solid transparent !important;
    color: var(--hiw-ink) !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    background: transparent !important;
    box-shadow: none !important;
    gap: 0.4rem;
}

.page-how-it-works .hiw-steps-tabs .nav-link::after {
    display: none !important;
}

.page-how-it-works .hiw-steps-tabs .nav-link.active,
.page-how-it-works .hiw-steps-tabs .nav-link[aria-selected="true"] {
    background: var(--hiw-ink) !important;
    background-color: var(--hiw-ink) !important;
    background-image: none !important;
    border-color: var(--hiw-ink) !important;
    color: #fff !important;
    box-shadow: none !important;
}

.page-how-it-works .hiw-steps-tabs .nav-link.active i::before,
.page-how-it-works .hiw-steps-tabs .nav-link[aria-selected="true"] i::before {
    color: #fff !important;
}

.page-how-it-works > .pb-themesection:has(.hiw-steps-section) {
    margin-bottom: 0 !important;
}

.page-how-it-works .hiw-steps-section .am-works_contant.hiw-steps-section__body {
    padding: 0 !important;
    background: transparent !important;
}

.page-how-it-works .hiw-steps-section .am-faqs-tabs-detail,
.page-how-it-works .hiw-steps-section .am-how-it-works-detail {
    width: 100% !important;
    max-width: 100% !important;
    align-items: stretch;
}

.page-how-it-works .hiw-steps-panel {
    width: 100%;
}

.page-how-it-works .hiw-steps-panel.tab-content {
    background: var(--hiw-steps-panel-bg) !important;
    background-color: var(--hiw-steps-panel-bg) !important;
    background-image: none !important;
    border: none !important;
    border-radius: 30px !important;
    box-shadow: none !important;
    padding: var(--hiw-panel-pad) var(--hiw-panel-pad) var(--hiw-steps-pad-bottom) !important;
    margin-top: 0;
}

.page-how-it-works .hiw-steps-panel .tab-pane:last-child .hiw-steps-list .hiw-step:last-child,
.page-how-it-works .hiw-steps-panel .tab-pane.show .hiw-steps-list .hiw-step:last-child {
    margin-bottom: 0;
}

.page-how-it-works .hiw-steps-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(0.85rem, 2.5vw, 1.15rem);
    align-items: stretch;
}

/* Single step card */
.page-how-it-works .hiw-step {
    margin: 0;
    min-width: 0;
    height: 100%;
    padding: clamp(1rem, 2.5vw, 1.25rem);
    background: #fff;
    border: 1px solid rgba(17, 17, 17, 0.07);
    border-radius: clamp(1rem, 2.5vw, 1.35rem);
    box-shadow: none;
}

.page-how-it-works .hiw-step__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(0.85rem, 2vw, 1.1rem);
    align-items: start;
    height: 100%;
}

.page-how-it-works .hiw-step__copy {
    min-width: 0;
}

.page-how-it-works .hiw-step__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.5rem;
    margin-bottom: 0.65rem;
}

.page-how-it-works .hiw-step__num {
    display: inline-grid;
    place-items: center;
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 0.35rem;
    border-radius: 50%;
    background: color-mix(in srgb, var(--hiw-cream) 55%, #fff);
    border: none;
    box-shadow: none;
    font-family: "Poppins", sans-serif;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--hiw-ink);
    line-height: 1;
}

.page-how-it-works .hiw-step__eyebrow {
    display: inline-flex;
    align-items: center;
    position: relative;
    margin: 0;
    padding: 4px 10px 4px 22px;
    border-radius: 50px;
    background: color-mix(in srgb, var(--hiw-cream) 88%, #fff);
    color: var(--hiw-ink);
    border: 1px solid color-mix(in srgb, var(--hiw-cream) 35%, rgba(17, 17, 17, 0.1));
    font-family: "Bitter", Georgia, serif;
    font-size: 0.6875rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    line-height: 1.25rem;
}

.page-how-it-works .hiw-step__eyebrow::before {
    content: "";
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
}

.page-how-it-works a.hiw-step__eyebrow:hover {
    color: var(--hiw-ink);
    border-color: color-mix(in srgb, var(--hiw-pink) 40%, rgba(17, 17, 17, 0.12));
}

.page-how-it-works .hiw-step__title {
    margin: 0 0 0.5rem !important;
    max-width: none !important;
    font-family: "Bitter", Georgia, serif !important;
    font-size: clamp(1rem, 2.5vw, 1.2rem) !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.2 !important;
    color: var(--hiw-ink) !important;
}

.page-how-it-works .hiw-step__body,
.page-how-it-works .hiw-step__body p {
    margin: 0 !important;
    color: var(--hiw-muted) !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 0.8125rem !important;
    line-height: 1.5 !important;
}

.page-how-it-works .hiw-step__body p + p {
    margin-top: 0.75rem !important;
}

/* Legacy hooks — hide old template chrome */
.page-how-it-works .hiw-step .am-works_info_tag,
.page-how-it-works .hiw-step .am-works_info_description > span::before,
.page-how-it-works .hiw-step .am-works_info_description > span::after {
    display: none !important;
    content: none !important;
}

.page-how-it-works .hiw-step__visual {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 100% !important;
    margin: 0 !important;
}

.page-how-it-works .hiw-step-illustration {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: clamp(0.65rem, 2vw, 0.9rem);
    border-radius: 1.25rem;
    background: color-mix(in srgb, var(--hiw-cream) 22%, #fff);
    border: none;
    box-shadow: none;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
}

.page-how-it-works .hiw-step__visual.am-works_info_user > figure {
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
    max-width: 100%;
}

.page-how-it-works .hiw-step__visual.am-works_info_user figure.hiw-step-illustration--photo {
    padding: clamp(0.5rem, 1.5vw, 0.75rem) !important;
}

.page-how-it-works .hiw-step__visual.am-works_info_user figure img {
    height: auto !important;
}

.page-how-it-works .hiw-step-illustration--photo img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto !important;
    max-height: clamp(140px, 38vw, 200px);
    margin-inline: auto;
    object-fit: contain;
    object-position: center bottom;
}

.page-how-it-works .hiw-step-illustration svg {
    display: block;
    width: min(96px, 75%);
    height: auto;
    margin-inline: auto;
}

/* Tablet+: two step cards per row */
@media (min-width: 640px) {
    .page-how-it-works .hiw-steps-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: clamp(0.85rem, 2vw, 1.15rem);
    }

    .page-how-it-works .hiw-step {
        padding: clamp(1.05rem, 2.5vw, 1.4rem);
    }

    .page-how-it-works .hiw-step__meta {
        gap: 0.5rem 0.65rem;
        margin-bottom: 0.85rem;
    }

    .page-how-it-works .hiw-step__eyebrow {
        padding: 5px 12px 5px 24px;
        font-size: 0.75rem;
    }

    .page-how-it-works .hiw-step__title {
        font-size: clamp(1.1rem, 1.5vw, 1.35rem) !important;
        margin-bottom: 0.65rem !important;
    }

    .page-how-it-works .hiw-step__body,
    .page-how-it-works .hiw-step__body p {
        font-size: 0.875rem !important;
        line-height: 1.55 !important;
    }

    .page-how-it-works .hiw-step-illustration svg {
        width: min(108px, 68%);
    }

    .page-how-it-works .hiw-step-illustration--photo img {
        max-height: clamp(150px, 32vw, 220px);
    }
}

@media (min-width: 992px) {
    .page-how-it-works .hiw-steps-list {
        gap: clamp(1rem, 2.5vw, 1.25rem);
    }

    .page-how-it-works .hiw-step {
        padding: clamp(1.25rem, 3vw, 1.75rem);
    }

    .page-how-it-works .hiw-step__grid {
        gap: clamp(1rem, 2.5vw, 1.35rem);
    }

    .page-how-it-works .hiw-step__meta {
        gap: 0.65rem 0.85rem;
        margin-bottom: 1rem;
    }

    .page-how-it-works .hiw-step__eyebrow {
        padding: 6px 16px 6px 28px;
        font-size: 0.8125rem;
    }

    .page-how-it-works .hiw-step__title {
        font-size: clamp(1.2rem, 1vw, 1.5rem) !important;
        margin-bottom: 0.75rem !important;
    }

    .page-how-it-works .hiw-step__body,
    .page-how-it-works .hiw-step__body p {
        font-size: 0.9375rem !important;
        line-height: 1.6 !important;
    }

    .page-how-it-works .hiw-step-illustration {
        padding: clamp(0.75rem, 2vw, 1rem);
    }

    .page-how-it-works .hiw-step-illustration svg {
        width: min(120px, 65%);
    }

    .page-how-it-works .hiw-step-illustration--photo img {
        max-height: 200px;
    }
}

@media (min-width: 1200px) {
    .page-how-it-works .hiw-step__grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(140px, 200px);
        gap: clamp(1rem, 2vw, 1.5rem);
        align-items: center;
    }

    .page-how-it-works .hiw-step__title {
        font-size: clamp(1.25rem, 1vw, 1.5rem) !important;
    }

    .page-how-it-works .hiw-step__body,
    .page-how-it-works .hiw-step__body p {
        font-size: 1rem !important;
        line-height: 1.65 !important;
    }

    .page-how-it-works .hiw-step-illustration {
        max-width: 200px;
    }

    .page-how-it-works .hiw-step-illustration--photo img {
        max-height: 220px;
    }

    .page-how-it-works .hiw-step-illustration svg {
        width: min(130px, 100%);
    }
}

/* ------------------------------------------------------------------ */
/* Vision — match About Us mission/vision panels                      */
/* ------------------------------------------------------------------ */
.page-how-it-works > .pb-themesection:has(.am-vision-section) .row,
.page-how-it-works > .pb-themesection:has(.am-vision-section) .col-12 {
    background: var(--hiw-canvas-bg) !important;
    border: none !important;
    box-shadow: none !important;
}

.page-how-it-works .am-vision-section {
    background: #fff !important;
    padding: var(--hiw-panel-pad) !important;
}

.page-how-it-works .am-vision-section > .container-fluaid,
.page-how-it-works .am-vision-section > .container-fluid {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.page-how-it-works .am-vision-section .row {
    align-items: center;
    --bs-gutter-x: 1.5rem;
}

.page-how-it-works .am-vision-section .row > .col-lg-6:only-child {
    flex: 0 0 100% !important;
    max-width: 100% !important;
}

.page-how-it-works .am-vision-section .video-js,
.page-how-it-works .am-vision-section video {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 280px;
    max-height: 420px;
    border-radius: 1rem;
}

.page-how-it-works .am-tutor-vision {
    height: auto !important;
    padding: 0 !important;
}

.page-how-it-works .am-tutor-vision .am-content_box,
.page-how-it-works .am-vision-section .am-content_box.am-left-text {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}

.page-how-it-works .am-vision-section .am-content_box.am-left-text > span {
    margin: 0 0 1rem !important;
}

.page-how-it-works .am-vision-section .am-content_box.am-left-text > span::before,
.page-how-it-works .am-vision-section .am-content_box.am-left-text > span::after {
    display: none !important;
    content: none !important;
}

.page-how-it-works .am-vision-section .am-content_box.am-left-text h3 {
    text-align: left !important;
    margin-top: 0 !important;
}

.page-how-it-works .am-vision-section .am-content_box.am-left-text > p,
.page-how-it-works .am-vision-section .am-content_box.am-left-text p {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    text-align: left !important;
}

.page-how-it-works .am-vision-section .am-content_box ul {
    margin: 1.75rem 0 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

.page-how-it-works .am-vision-section .am-content_box ul > li {
    gap: 0.875rem !important;
    align-items: flex-start !important;
}

.page-how-it-works .am-vision-section .am-content_box ul > li + li {
    margin-top: 1.25rem !important;
}

.page-how-it-works .am-vision-section .am-content_box ul > li > span {
    flex: none !important;
    width: 2.25rem !important;
    height: 2.25rem !important;
    margin: 0 !important;
    border-radius: 50% !important;
    background: color-mix(in srgb, var(--hiw-cream) 70%, #fff) !important;
    place-items: center !important;
}

.page-how-it-works .am-vision-section .am-content_box ul > li > span svg {
    width: 0.875rem !important;
    height: 0.875rem !important;
}

.page-how-it-works .am-vision-section .am-content_box ul > li > span svg path {
    fill: var(--hiw-ink) !important;
}

.page-how-it-works .am-vision-section .am-content_list > h6 {
    font-family: "Poppins", sans-serif !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: var(--hiw-ink) !important;
    line-height: 1.4 !important;
}

.page-how-it-works .am-vision-section .am-content_list > p {
    margin: 0.25rem 0 0 !important;
    color: var(--hiw-muted) !important;
    font-size: 1rem !important;
    line-height: 1.55 !important;
    text-align: left !important;
}

.page-how-it-works .am-vision-section .am-marketplace_content_list_btn {
    margin-top: 1.75rem !important;
    justify-content: flex-start !important;
}

.page-how-it-works .am-works_info_description_list ul li em {
    background: color-mix(in srgb, var(--hiw-cream) 70%, #fff) !important;
    color: var(--hiw-ink) !important;
}

/* ------------------------------------------------------------------ */
/* Testimonials                                                       */
/* ------------------------------------------------------------------ */
.page-how-it-works .am-feedback.am-feedback-two {
    padding: var(--hiw-panel-pad) !important;
    max-width: 100% !important;
    background: var(--hiw-panel-bg) !important;
}

/* Pill marquee — full bleed inside panel (match About Us / homepage) */
.page-how-it-works > .pb-themesection:has(.am-feedback.feedback-verient-one) > .container-fluid,
.page-how-it-works > .pb-themesection:has(.am-feedback.feedback-verient-one) > .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
}

.page-how-it-works .am-feedback.am-feedback-two.feedback-verient-one {
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    width: 100% !important;
    max-width: none !important;
}

.page-how-it-works .am-feedback.feedback-verient-one > .container-fluid {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.page-how-it-works .am-feedback.feedback-verient-one > .container-fluid > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.page-how-it-works .am-feedback.feedback-verient-one > .container-fluid > .row > [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.page-how-it-works .am-feedback.feedback-verient-one .am-feedback-two_wrap .am-section_title {
    padding-left: var(--hiw-panel-pad);
    padding-right: var(--hiw-panel-pad);
}

.page-how-it-works .am-feedback.feedback-verient-one .am-feedback-marquee-list {
    width: 100%;
    max-width: 100%;
}

/* Testimonials is the last block before the footer — no canvas gutter below */
.page-how-it-works > .pb-themesection:last-child:has(.am-feedback.feedback-verient-one) {
    margin-bottom: 0 !important;
}

.page-how-it-works .am-feedback.am-feedback-two > .container,
.page-how-it-works .am-feedback.am-feedback-two > .container-fluid,
.page-how-it-works .am-feedback-two_wrap {
    max-width: 100% !important;
}

.page-how-it-works .am-feedback:not(.feedback-verient-one) .am-feedback_content_list_info,
.page-how-it-works .am-feedback:not(.feedback-verient-one) .am-testimonial-card {
    background: #fff !important;
    border: none !important;
    border-radius: 1rem !important;
    box-shadow: var(--hiw-shadow) !important;
}

.page-how-it-works .am-feedback.am-feedback-two.feedback-verient-one {
    overflow: visible !important;
}

.page-how-it-works .am-feedback.feedback-verient-one .am-feedback-two_wrap {
    overflow: visible;
}

/* Variant-one marquee — squared cards (match homepage feedback-verient-one) */
.page-how-it-works .am-feedback.feedback-verient-one .am-testimonial-section .splide__slide .am-testimonial-card,
.page-how-it-works .am-feedback.feedback-verient-one .am-testimonial-card,
.page-how-it-works .am-feedback.feedback-verient-one .am-feedback_content_list_info {
    border-radius: 16px !important;
}

.page-how-it-works .am-feedback.feedback-verient-one .am-feedback_content_list_info {
    padding: 24px !important;
    min-height: 0 !important;
}

.page-how-it-works .am-feedback.am-feedback-two.feedback-verient-one .am-feedback_content_list_info,
.page-how-it-works .am-feedback.am-feedback-two.feedback-verient-one .am-feedback_content_list_info:hover {
    background: #fff !important;
    border: 1px solid rgba(17, 17, 17, 0.08) !important;
    box-shadow: 0 4px 14px rgba(17, 17, 17, 0.06) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.page-how-it-works .am-feedback.am-feedback-two.feedback-verient-one .am-feedback_content_list_info.is-reactive,
.page-how-it-works .am-feedback.am-feedback-two.feedback-verient-one .am-testimonial-card.is-reactive,
.page-how-it-works .am-feedback.am-feedback-two.feedback-verient-one .am-feedback_content_list_info:hover,
.page-how-it-works .am-feedback.am-feedback-two.feedback-verient-one .am-testimonial-card:hover {
    border: 1px solid rgba(17, 17, 17, 0.12) !important;
    box-shadow: 0 8px 20px rgba(17, 17, 17, 0.1) !important;
}

/* ------------------------------------------------------------------ */
/* Join community CTA                                                 */
/* ------------------------------------------------------------------ */
.page-how-it-works > .pb-themesection.am-joincommunity .am-works {
    padding: var(--hiw-panel-pad) !important;
    text-align: center;
}

.page-how-it-works > .pb-themesection.am-joincommunity .am-page-title-wrap {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.page-how-it-works > .pb-themesection.am-joincommunity .am-page-title-wrap .am-content_box {
    padding: 0 !important;
    max-width: 52rem;
    margin-inline: auto;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.page-how-it-works > .pb-themesection.am-joincommunity .am-joincommunity_btn {
    justify-content: center;
    margin-top: 1.5rem;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* ------------------------------------------------------------------ */
/* CTAs                                                               */
/* ------------------------------------------------------------------ */
.page-how-it-works .am-tutor-vision .am-content_box .am-btn,
.page-how-it-works .am-joincommunity_btn .am-btn,
.page-how-it-works .am-works_info_description .am-btn,
.page-how-it-works .am-faqs-card .am-btn,
.page-how-it-works .am-feedback-section-cta {
    background: var(--hiw-ink) !important;
    background-image: none !important;
    border: 1px solid var(--hiw-ink) !important;
    color: #fff !important;
    border-radius: 999px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}

.page-how-it-works .am-tutor-vision .am-content_box .am-btn::before,
.page-how-it-works .am-joincommunity_btn .am-btn::before,
.page-how-it-works .am-works_info_description .am-btn::before,
.page-how-it-works .am-faqs-card .am-btn::before,
.page-how-it-works .am-feedback-section-cta::before {
    display: none !important;
    opacity: 0 !important;
}

.page-how-it-works .am-tutor-vision .am-content_box .am-btn:hover,
.page-how-it-works .am-joincommunity_btn .am-btn:hover,
.page-how-it-works .am-works_info_description .am-btn:hover,
.page-how-it-works .am-faqs-card .am-btn:hover,
.page-how-it-works .am-feedback-section-cta:hover {
    background: var(--hiw-accent) !important;
    background-image: var(--hiw-accent) !important;
    border-color: var(--hiw-accent-border) !important;
    color: #1f2a33 !important;
}

.page-how-it-works .am-joincommunity_btn .am-white-btn {
    background: #fff !important;
    border: 1px solid rgba(17, 17, 17, 0.2) !important;
    color: var(--hiw-ink) !important;
    border-radius: 999px !important;
}

/* ------------------------------------------------------------------ */
/* Mobile                                                             */
/* ------------------------------------------------------------------ */
@media (max-width: 991px) {
    .page-how-it-works .am-vision-section .row > [class*="col-"] {
        margin-bottom: 1.25rem;
    }
}

@media (max-width: 640px) {
    .page-how-it-works > .pb-themesection:first-child .am-works,
    .page-how-it-works .am-vision-section,
    .page-how-it-works .am-feedback.am-feedback-two,
    .page-how-it-works > .pb-themesection.am-joincommunity .am-works {
        padding: 1.5rem 1.15rem !important;
    }

    .page-how-it-works .am-feedback.am-feedback-two.feedback-verient-one {
        padding-left: 0 !important;
        padding-right: 0 !important;
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important;
    }

    .page-how-it-works .am-feedback.feedback-verient-one .am-feedback-two_wrap .am-section_title {
        padding-left: 1.15rem;
        padding-right: 1.15rem;
    }

    .page-how-it-works .hiw-steps-section .am-works_contant.hiw-steps-section__body {
        padding: 0 !important;
    }

    .page-how-it-works .hiw-steps-panel__tabs {
        margin-bottom: 1rem;
        padding-bottom: 1rem;
    }

    .page-how-it-works .hiw-steps-panel.tab-content {
        padding: 1.25rem 1.15rem 0.75rem !important;
    }

    .page-how-it-works .hiw-step {
        padding: clamp(1.15rem, 3vw, 1.35rem);
    }

    .page-how-it-works .hiw-step-illustration--photo img {
        max-height: 160px;
    }

    .page-how-it-works .hiw-step-illustration svg {
        width: min(120px, 55%);
    }

    .page-how-it-works .hiw-steps-tabs .nav-link {
        padding: 0.65rem 0.5rem !important;
        font-size: 0.8125rem !important;
        justify-content: center;
    }

    .page-how-it-works .am-joincommunity_btn {
        flex-direction: column;
        align-items: stretch;
    }

    .page-how-it-works .am-joincommunity_btn .am-btn,
    .page-how-it-works .am-joincommunity_btn .am-white-btn {
        width: 100%;
        text-align: center;
    }

}