@import url('https://fonts.googleapis.com/css2?family=Onest:wght@400;500;600;700;800;900&display=swap');

/*-- custom css start here --*/
[data-bs-theme-base="neutral"] {
    --tblr-gray-50: #fafafa;
    --tblr-gray-100: #f5f5f5;
    --tblr-gray-200: #e5e5e5;
    --tblr-gray-300: #d4d4d4;
    --tblr-gray-400: #a3a3a3;
    --tblr-gray-500: #737373;
    --tblr-gray-600: #525252;
    --tblr-gray-700: #404040;
    --tblr-gray-800: #262626;
    --tblr-gray-900: #171717;
    --tblr-gray-950: #0a0a0a;
}

.page-body {
    margin-top: 20px;
}

h1 {
    font-size: 2rem;
}

.jm-homepage .navbar {
    background: transparent;
    box-shadow: none;
}

.jm-meeting-join {
    margin-top: -56px;
}

.jm-home-bg.bg-cover {
    background-color: var(--tblr-primary);
}

.section {
    padding: 5.5rem 0;
}

.jm-features,
.jm-faq {
    background-color: var(--tblr-homebg);
}

.jm-about-icons svg {
    width: 50px;
    height: 50px;
    color: var(--tblr-primary);
}

.jm-about-bigicon svg.icon {
    height: 250px;
    width: 250px;
    color: var(--tblr-primary);
}

.jm-icon-box svg {
    height: 35px;
    width: 35px;
}

.jm-icon-box span {
    background-color: var(--tblr-primary);
    color: var(--tblr-white);
    border-radius: var(--tblr-border-radius);
    height: 50px;
    width: 50px;
}

[data-bs-theme=dark] .navbar-brand-image {
    filter: invert(100%);
}

.jm-how-to-use {
    color: var(--tblr-white);
}

[data-bs-theme=dark] .section-light {
    background-color: #333333;
}

[data-bs-theme=light] .section-light {
    background-color: #f2f2f2;
}

.ribbon.bg-green {
    border-color: var(--tblr-primary);
}

.ribbon-bookmark {
    background-color: var(--tblr-primary) !important;
}

.ribbon-top {
    width: 2.5rem;
}

.ribbon-bookmark.ribbon-top:after {
    border-width: 1.3rem;
    border-top-width: 0;
    border-bottom-color: transparent;
    border-bottom-width: 0.5rem;
}

.jm-faq .accordion-button {
    font-size: 1.2rem;
}

.jm-review-icon svg {
    width: 50px;
    height: 50px;
    color: var(--tblr-primary);
}

.jm-review-icon {
    gap: 15px;
}

.jm-footer-menu {
    gap: 20px;
}

button.link.jm-join-link {
    position: absolute;
    top: 7px;
    right: 10px;
    font-weight: 600;
    background: transparent;
}

[dir="rtl"] button.link.jm-join-link {
    right: unset;
    left: 10px;
}

.jm-join-link {
    color: var(--tblr-primary);
}

.jm-meeting-join {
    background-color: var(--white-bg-page);
}

.link {
    color: var(--tblr-primary);
    font-weight: 600;
}

.jm-home-bg h2 {
    color: var(--tblr-white);
}

.input-group {
    box-shadow: none;
}

.logo-image {
    height: 2rem;
    width: auto;
}

.navbar-logo {
    width: auto;
    height: 2rem;
}

[data-bs-theme=dark] .toast-header {
    background: unset;
    color: var(--tblr-white);
}

.pricing-label {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-50%);
    vertical-align: bottom;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.featured {
    z-index: 1;
    border: 2px solid var(--tblr-primary);
    order: -1;
    transform: scale(1.05);
}

/*-- Responsive css start here --*/
/*--mobile css start here--*/
@media (min-width: 768px) {
    .featured {
        order: unset;
        margin-top: 0;
        margin-bottom: 0;
        box-shadow: 0 0 4px rgba(var(--tblr-body-color-rgb), .04);
        border-radius: 8px;
    }
}

@media (min-width: 992px) {

    :host,
    :root {
        margin-left: 0;
        margin-right: 0;
    }
}

@media screen and (max-width:767px) {
    .featured {
        transform: unset;
    }

    .navbar-toggler {
        color: var(--tblr-white);
    }

    .nav-link-icon {
        color: var(--tblr-white);
    }

    .navbar .navbar-nav .nav-link {
        color: var(--tblr-white);
    }

    .jm-homepage .navbar {
        position: absolute;
        top: 0px;
        left: 0;
        right: 0;
        background-color: var(--tblr-primary);
    }

    .jm-home-bg.bg-cover {
        min-height: 50vh !important;
    }

    .jm-meeting-join {
        margin: 0;
    }

    .section {
        padding: 3rem 0.5rem;
    }

    h1 {
        font-size: 1.5rem;
    }

    .jm-about-bigicon svg.icon {
        height: 200px;
        width: 200px;
    }
}

/*--ipad css start here--*/
@media only screen and (min-width:768px) and (max-width:959px) {
    .jm-home-bg.bg-cover {
        min-height: 50vh !important;
    }

    .section {
        padding: 3rem 0.5rem;
    }

    h1 {
        font-size: 1.5rem;
    }

    .jm-about-bigicon svg.icon {
        height: 200px;
        width: 200px;
    }

    .jm-footer-menu {
        justify-content: space-between;
    }
}

/*--ipad  pro css start here--*/
@media only screen and (min-device-width: 834px) and (max-device-width: 1112px) and (-webkit-min-device-pixel-ratio: 2) {
    .jm-home-bg.bg-cover {
        min-height: 50vh !important;
    }
}

/*-- home v2 start here --*/
.jm-home-v2 {
    background:
        radial-gradient(circle at 10% 15%, rgba(98, 102, 255, 0.12), transparent 18%),
        radial-gradient(circle at 90% 10%, rgba(52, 211, 153, 0.1), transparent 15%),
        linear-gradient(180deg, #fffdf8 0%, #ffffff 34%, #f8fbff 100%);
    min-height: 100vh;
}

.jm-home-v2 .navbar {
    position: relative;
    z-index: 5;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
}

.jm-home-v2 .navbar .nav-link,
.jm-home-v2 .navbar .jm-profile-name,
.jm-home-v2 .navbar .jm-designation,
.jm-home-v2 .navbar .nav-link-icon,
.jm-home-v2 .navbar .nav-link-title {
    color: #21314d !important;
}

.jm-home-v2 .navbar-brand .logo-image,
.jm-home-v2 .navbar-brand .navbar-logo {
    height: 2.25rem;
}

.jm-home-v2-main {
    overflow: hidden;
}

.jm-v2-hero {
    position: relative;
    padding: 2rem 0 4rem;
}

.jm-v2-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(400px, 0.95fr);
    gap: 2.5rem;
    align-items: center;
}

.jm-v2-kicker {
    display: inline-flex;
    align-items: center;
    padding: 0.55rem 0.9rem;
    border-radius: 999px;
    background: rgba(98, 102, 255, 0.08);
    color: #5968ff;
    font-size: 0.85rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.jm-v2-kicker-light {
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
}

.jm-v2-hero-copy h1 {
    font-size: clamp(2.5rem, 5vw, 4.7rem);
    line-height: 0.95;
    font-weight: 800;
    letter-spacing: -0.05em;
    color: #17253d;
    margin-bottom: 1.2rem;
    max-width: 11ch;
}

.jm-v2-hero-copy p {
    font-size: 1.04rem;
    line-height: 1.8;
    color: #66758f;
    max-width: 56ch;
    margin-bottom: 1.75rem;
}

.jm-v2-join-form {
    max-width: 35rem;
}

.jm-v2-join-label {
    display: block;
    margin-bottom: 0.7rem;
    color: #243551;
    font-size: 0.94rem;
    font-weight: 700;
}

.jm-v2-join-row {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.7rem;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid rgba(71, 91, 151, 0.12);
    box-shadow: 0 24px 55px rgba(21, 31, 67, 0.08);
}

.jm-v2-join-row input {
    flex: 1 1 auto;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    color: #20304c;
    font-size: 1rem;
    padding: 0 1rem;
}

.jm-v2-join-row input::placeholder {
    color: #8b9bb4;
}

.jm-v2-primary-btn,
.jm-v2-secondary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3.3rem;
    border: none;
    border-radius: 999px;
    font-weight: 700;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.jm-v2-primary-btn:hover,
.jm-v2-secondary-btn:hover,
.jm-v2-text-link:hover {
    transform: translateY(-1px);
}

.jm-v2-primary-btn {
    padding: 0 1.35rem;
    color: #ffffff;
    background: linear-gradient(135deg, #53d678, #28c2a2);
    box-shadow: 0 16px 30px rgba(40, 194, 162, 0.26);
}

.jm-v2-action-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.9rem 1rem;
    margin-top: 1rem;
}

.jm-v2-secondary-btn {
    padding: 0 1.3rem;
    background: rgba(98, 102, 255, 0.08);
    color: #5364ff;
}

.jm-v2-text-link {
    color: #2a4fd7;
    font-weight: 700;
}

.jm-v2-stat-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    margin-top: 1.4rem;
}

.jm-v2-stat-pill {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.8rem 1rem;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(87, 100, 153, 0.12);
    border-radius: 999px;
    box-shadow: 0 12px 30px rgba(21, 31, 67, 0.06);
}

.jm-v2-stat-pill strong {
    color: #18263f;
    font-size: 0.96rem;
}

.jm-v2-stat-pill span {
    color: #70809a;
    font-size: 0.92rem;
}

.jm-v2-hero-visual {
    position: relative;
    min-height: 40rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.jm-v2-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(0.2px);
}

.jm-v2-orb-lg {
    width: 28rem;
    height: 28rem;
    background: radial-gradient(circle at center, rgba(98, 102, 255, 0.16), rgba(98, 102, 255, 0.03));
    top: 12%;
    left: 10%;
}

.jm-v2-orb-sm {
    width: 10rem;
    height: 10rem;
    background: radial-gradient(circle at center, rgba(40, 194, 162, 0.28), rgba(40, 194, 162, 0.04));
    right: 4%;
    bottom: 12%;
}

.jm-v2-app-window {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 36rem;
    padding: 1rem;
    border-radius: 2rem;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(83, 101, 163, 0.12);
    box-shadow: 0 35px 80px rgba(32, 48, 89, 0.12);
    backdrop-filter: blur(18px);
}

.jm-v2-window-bar {
    display: flex;
    gap: 0.45rem;
    margin-bottom: 1rem;
}

.jm-v2-window-bar span {
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 50%;
    background: rgba(60, 73, 111, 0.2);
}

.jm-v2-window-shell {
    position: relative;
    min-height: 33rem;
}

.jm-v2-visual-card {
    border-radius: 1.7rem;
    box-shadow: 0 24px 65px rgba(45, 59, 105, 0.12);
}

.jm-v2-visual-card-main {
    width: 15rem;
    margin: 4rem auto 0;
    padding: 1rem;
    background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 35%, #20273d 35%, #20273d 100%);
}

.jm-v2-visual-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4.2rem;
}

.jm-v2-live-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.26rem 0.6rem;
    border-radius: 999px;
    background: rgba(83, 102, 255, 0.1);
    color: #5d67ff;
    font-size: 0.72rem;
    font-weight: 700;
}

.jm-v2-live-timer {
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 700;
}

.jm-v2-user-card {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-top: -3rem;
    margin-bottom: 1.2rem;
}

.jm-v2-user-avatar {
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #ffffff;
    flex-shrink: 0;
}

.jm-v2-user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.jm-v2-user-card h3 {
    font-size: 0.98rem;
    color: #ffffff;
    margin-bottom: 0.2rem;
}

.jm-v2-user-card p {
    margin: 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.76rem;
    line-height: 1.45;
}

.jm-v2-price-tag {
    background: rgba(255, 255, 255, 0.08);
    border-radius: 1.2rem;
    padding: 1rem;
    text-align: center;
}

.jm-v2-price-tag strong {
    display: block;
    color: #ffffff;
    font-size: 1.7rem;
    line-height: 1;
}

.jm-v2-price-tag span {
    display: block;
    margin-top: 0.35rem;
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.8rem;
}

.jm-v2-floating {
    position: absolute;
    width: 13rem;
    padding: 1rem;
    border-radius: 1.5rem;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(87, 100, 153, 0.12);
    box-shadow: 0 18px 52px rgba(31, 47, 88, 0.1);
}

.jm-v2-floating h4 {
    color: #20304c;
    font-size: 0.88rem;
    margin-bottom: 0.55rem;
}

.jm-v2-floating p {
    color: #7a8ba8;
    font-size: 0.8rem;
    line-height: 1.45;
    margin-bottom: 0.7rem;
}

.jm-v2-floating-top {
    top: 2rem;
    right: 0;
}

.jm-v2-floating-bottom {
    left: 0;
    bottom: 1rem;
}

.jm-v2-floating-price {
    color: #243551;
    font-size: 1.5rem;
    font-weight: 800;
    margin-bottom: 0.4rem;
}

.jm-v2-mini-actions {
    display: flex;
    gap: 0.45rem;
}

.jm-v2-mini-actions span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 0.7rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
}

.jm-v2-accept {
    background: rgba(40, 194, 162, 0.14);
    color: #0fa37e;
}

.jm-v2-decline {
    background: rgba(54, 72, 116, 0.08);
    color: #5f6f8e;
}

.jm-v2-mini-schedule {
    display: grid;
    gap: 0.55rem;
}

.jm-v2-mini-schedule div {
    display: flex;
    justify-content: space-between;
    gap: 0.8rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid rgba(87, 100, 153, 0.1);
}

.jm-v2-mini-schedule div:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.jm-v2-mini-schedule span {
    color: #7c8ba4;
    font-size: 0.76rem;
}

.jm-v2-mini-schedule strong {
    color: #1d2f4a;
    font-size: 0.8rem;
}

.jm-v2-feature-band {
    padding: 1rem 0 2rem;
}

.jm-v2-feature-band-inner {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
    gap: 2rem;
    align-items: center;
    padding: 2.5rem;
    border-radius: 2.6rem;
    background: linear-gradient(135deg, #5966f6 0%, #6172ff 55%, #7086ff 100%);
    color: #ffffff;
    position: relative;
    overflow: hidden;
}

.jm-v2-feature-band-inner::before,
.jm-v2-feature-band-inner::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
}

.jm-v2-feature-band-inner::before {
    width: 15rem;
    height: 15rem;
    right: 20%;
    top: -4rem;
}

.jm-v2-feature-band-inner::after {
    width: 10rem;
    height: 10rem;
    left: -2rem;
    bottom: -2rem;
}

.jm-v2-feature-copy,
.jm-v2-feature-preview {
    position: relative;
    z-index: 1;
}

.jm-v2-feature-copy h2 {
    font-size: clamp(2rem, 4vw, 3.3rem);
    line-height: 1.02;
    margin-bottom: 1rem;
    color: #ffffff;
}

.jm-v2-feature-copy p {
    color: rgba(255, 255, 255, 0.78);
    font-size: 1rem;
    line-height: 1.8;
    max-width: 52ch;
}

.jm-v2-check-list {
    list-style: none;
    margin: 1.5rem 0 0;
    padding: 0;
    display: grid;
    gap: 0.8rem;
}

.jm-v2-check-list li {
    position: relative;
    padding-left: 1.8rem;
    color: #ffffff;
    font-weight: 600;
}

.jm-v2-check-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.4rem;
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    background: #60e2a7;
    box-shadow: 0 0 0 0.28rem rgba(96, 226, 167, 0.18);
}

.jm-v2-feature-preview {
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: center;
}

.jm-v2-preview-phone {
    width: 14rem;
    padding: 0.7rem;
    border-radius: 2rem;
    background: rgba(255, 255, 255, 0.12);
    box-shadow: 0 20px 54px rgba(30, 39, 98, 0.18);
}

.jm-v2-preview-phone img {
    width: 100%;
    display: block;
    border-radius: 1.45rem;
}

.jm-v2-preview-panel {
    width: 15rem;
    padding: 1.2rem;
    border-radius: 1.6rem;
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(10px);
}

.jm-v2-preview-panel h3 {
    color: #ffffff;
    font-size: 1.2rem;
    margin-bottom: 0.7rem;
}

.jm-v2-preview-panel p {
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.92rem;
    line-height: 1.7;
}

.jm-v2-preview-users {
    display: flex;
    gap: 0.45rem;
    margin-top: 1rem;
}

.jm-v2-preview-users span {
    width: 2.2rem;
    height: 2.2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ffffff;
    color: #4858dd;
    font-weight: 800;
    font-size: 0.78rem;
}

.jm-v2-info-grid {
    padding: 1rem 0 3rem;
}

.jm-v2-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.3rem;
}

.jm-v2-info-card {
    position: relative;
    min-height: 15rem;
    padding: 2rem;
    border-radius: 2rem;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(71, 91, 151, 0.1);
    box-shadow: 0 24px 65px rgba(30, 44, 80, 0.07);
    overflow: hidden;
}

.jm-v2-info-card::after {
    content: "";
    position: absolute;
    width: 12rem;
    height: 12rem;
    right: -4rem;
    bottom: -4rem;
    border-radius: 50%;
    background: radial-gradient(circle at center, rgba(82, 212, 156, 0.16), rgba(82, 212, 156, 0));
}

.jm-v2-card-dot {
    width: 0.9rem;
    height: 0.9rem;
    display: inline-block;
    border-radius: 50%;
    background: #ffd15c;
    box-shadow: 0 0 0 0.35rem rgba(255, 209, 92, 0.18);
    margin-bottom: 1.1rem;
}

.jm-v2-info-card h3 {
    color: #17263e;
    font-size: 2rem;
    line-height: 1.05;
    margin-bottom: 0.8rem;
    max-width: 11ch;
}

.jm-v2-info-card p {
    color: #6f809a;
    font-size: 1rem;
    line-height: 1.8;
    max-width: 32ch;
}

.jm-v2-pricing-wrap {
    padding-top: 1rem;
    padding-bottom: 4rem;
}

.jm-home-v2 .jm-v2-pricing-wrap .container {
    max-width: 1280px;
}

.jm-home-v2 .jm-v2-pricing-wrap .jm-heading h1 {
    font-size: clamp(2.2rem, 4vw, 3.4rem);
    line-height: 1;
    color: #17263e;
    letter-spacing: -0.05em;
}

.jm-home-v2 .jm-v2-pricing-wrap .jm-heading p {
    color: #6f809a;
}

.jm-home-v2 .jm-v2-pricing-wrap .btn-group {
    padding: 0.35rem;
    border-radius: 999px;
    background: #f3f6ff;
}

.jm-home-v2 .jm-v2-pricing-wrap .btn-group .btn {
    border-radius: 999px !important;
    color: #5f6f8d;
}

.jm-home-v2 .jm-v2-pricing-wrap .btn-group .btn.active {
    background: #ffffff;
    color: #21324f;
    box-shadow: 0 8px 24px rgba(38, 51, 91, 0.1);
}

.jm-home-v2 .jm-v2-pricing-wrap .card {
    border: 1px solid rgba(71, 91, 151, 0.1);
    border-radius: 2rem;
    box-shadow: 0 24px 60px rgba(29, 43, 76, 0.08);
    overflow: hidden;
}

.jm-home-v2 .jm-v2-pricing-wrap .card-body {
    padding: 2rem 1.5rem;
}

.jm-home-v2 .jm-v2-pricing-wrap .card .btn {
    border-radius: 999px;
    background: linear-gradient(135deg, #5966f6, #6f88ff);
    color: #ffffff;
}

.jm-home-v2 .jm-v2-pricing-wrap .featured {
    border-color: rgba(89, 102, 246, 0.42);
}

.jm-home-v2 .footer {
    background: transparent;
}

@media screen and (max-width: 1199px) {
    .jm-v2-hero-grid,
    .jm-v2-feature-band-inner {
        grid-template-columns: 1fr;
    }

    .jm-v2-hero-copy h1,
    .jm-v2-info-card h3 {
        max-width: none;
    }

    .jm-v2-hero-visual {
        min-height: auto;
        padding-top: 1rem;
    }
}

@media screen and (max-width: 991px) {
    .jm-v2-grid {
        grid-template-columns: 1fr;
    }

    .jm-v2-hero {
        padding-top: 1rem;
    }

    .jm-home-v2 .navbar-toggler,
    .jm-home-v2 .navbar .nav-link,
    .jm-home-v2 .navbar .nav-link-icon,
    .jm-home-v2 .navbar .nav-link-title {
        color: #20314c !important;
    }

    .jm-home-v2 .navbar .navbar-collapse {
        margin-top: 0.8rem;
        padding: 1rem;
        border-radius: 1.2rem;
        background: rgba(255, 255, 255, 0.95);
        box-shadow: 0 18px 40px rgba(28, 41, 75, 0.08);
    }
}

@media screen and (max-width: 767px) {
    .jm-home-v2 .navbar {
        position: relative;
        background: transparent;
    }

    .jm-v2-hero-copy h1 {
        font-size: 2.5rem;
    }

    .jm-v2-join-row {
        flex-direction: column;
        align-items: stretch;
        border-radius: 1.6rem;
    }

    .jm-v2-join-row input {
        padding: 0.75rem 0.9rem 0.25rem;
    }

    .jm-v2-primary-btn,
    .jm-v2-secondary-btn {
        width: 100%;
    }

    .jm-v2-action-row {
        flex-direction: column;
        align-items: stretch;
    }

    .jm-v2-app-window {
        padding: 0.85rem;
    }

    .jm-v2-window-shell {
        min-height: 28rem;
    }

    .jm-v2-visual-card-main {
        width: 13.6rem;
        margin-top: 5.4rem;
    }

    .jm-v2-floating {
        width: 11.5rem;
        padding: 0.85rem;
    }

    .jm-v2-feature-band-inner,
    .jm-v2-info-card {
        padding: 1.5rem;
    }

    .jm-v2-feature-preview {
        flex-direction: column;
    }

    .jm-v2-preview-phone,
    .jm-v2-preview-panel {
        width: 100%;
        max-width: 18rem;
    }

    .jm-v2-info-card h3 {
        font-size: 1.7rem;
    }
}

@media screen and (max-width: 560px) {
    .jm-v2-window-shell {
        min-height: 25rem;
    }

    .jm-v2-floating-top {
        top: 0.8rem;
        right: 0;
    }

    .jm-v2-floating-bottom {
        left: 0;
        bottom: 0;
    }
}

/*-- home ref start here --*/
.jm-home-ref {
    background:
        linear-gradient(180deg, #edf3ff 0%, #ffffff 26%, #f8fbff 100%);
    min-height: 100vh;
    font-family: "Onest", sans-serif;
    color: #1c2b45;
}

.jm-home-ref .navbar {
    position: relative;
    z-index: 10;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    background: transparent;
    box-shadow: none;
}

.jm-home-ref .navbar .nav-link,
.jm-home-ref .navbar .jm-profile-name,
.jm-home-ref .navbar .jm-designation,
.jm-home-ref .navbar .nav-link-icon,
.jm-home-ref .navbar .nav-link-title {
    color: #ffffff !important;
}

.jm-home-ref .navbar .text-secondary,
.jm-home-ref .navbar .dropdown-toggle,
.jm-home-ref .navbar .dropdown-toggle::after,
.jm-home-ref .navbar .navbar-toggler,
.jm-home-ref .navbar .navbar-toggler-icon {
    color: rgba(255, 255, 255, 0.9) !important;
}

.jm-home-ref .navbar .jm-designation {
    color: rgba(255, 255, 255, 0.72) !important;
}

.jm-home-ref .navbar .avatar {
    border: 1px solid rgba(255, 255, 255, 0.18);
}

.jm-home-ref .navbar .dropdown-menu {
    color: #203250;
}

.jm-home-ref .navbar .dropdown-item {
    color: #203250;
}

.jm-home-ref .navbar-brand .logo-image,
.jm-home-ref .navbar-brand .navbar-logo {
    height: 2.2rem;
}

.jm-home-ref .container-xl,
.jm-home-ref .container {
    position: relative;
    z-index: 1;
}

.jm-ref-main {
    overflow: hidden;
}

.jm-ref-hero {
    padding: 0 0 3.5rem;
}

.jm-ref-hero-shell {
    position: relative;
    display: block;
    width: 100%;
    min-height: 54rem;
    padding: 0;
    border-radius: 0;
    background:
        radial-gradient(circle at 16% 18%, rgba(122, 145, 255, 0.24), transparent 20%),
        radial-gradient(circle at 84% 74%, rgba(103, 238, 217, 0.12), transparent 16%),
        linear-gradient(135deg, #2342e8 0%, #2e49eb 36%, #3a58ff 100%);
    box-shadow: 0 34px 80px rgba(38, 66, 183, 0.14);
    overflow: hidden;
}

.jm-ref-hero-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.95), rgba(0, 0, 0, 0.65));
    pointer-events: none;
}

.jm-ref-hero-copy,
.jm-ref-hero-visual,
.jm-ref-feature-band-inner,
.jm-ref-final-card {
    position: relative;
    z-index: 1;
}

.jm-home-ref .navbar {
    grid-column: 1 / -1;
    width: 100%;
    padding-top: 1.55rem;
    padding-bottom: 1.1rem;
}

.jm-home-ref .navbar > .container-fluid {
    max-width: 1360px;
    margin: 0 auto;
    padding-left: 2rem;
    padding-right: 2rem;
}

.jm-ref-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 540px) minmax(0, 650px);
    justify-content: center;
    gap: 4.5rem;
    align-items: center;
    width: 100%;
    max-width: 1360px;
    margin: 0 auto;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 3rem;
    padding-bottom: 6rem;
}

.jm-ref-hero-copy {
    justify-self: start;
    width: 100%;
}

.jm-ref-kicker,
.jm-ref-section-tag,
.jm-ref-section-tag-light {
    display: inline-flex;
    align-items: center;
    padding: 0.55rem 0.95rem;
    border-radius: 999px;
    font-size: 0.84rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.jm-ref-kicker {
    background: rgba(255, 255, 255, 0.12);
    color: #d8f6ff;
    margin-bottom: 1.35rem;
    backdrop-filter: blur(10px);
}

.jm-ref-section-tag {
    background: rgba(46, 73, 235, 0.08);
    color: #3a57f4;
}

.jm-ref-section-tag-light {
    background: rgba(255, 255, 255, 0.12);
    color: #d5f8ff;
}

.jm-ref-hero-copy h1 {
    font-family: "Onest", sans-serif;
    font-size: clamp(3rem, 5.8vw, 5.35rem);
    line-height: 0.9;
    letter-spacing: -0.07em;
    color: #ffffff;
    max-width: 7.8ch;
    margin-bottom: 1.45rem;
    text-wrap: balance;
}

.jm-ref-hero-copy p {
    color: rgba(255, 255, 255, 0.78);
    font-size: 1.04rem;
    line-height: 1.9;
    max-width: 50ch;
    margin-bottom: 2rem;
}

.jm-ref-cta-group {
    max-width: 34rem;
}

.jm-ref-join-form {
    margin-bottom: 1.2rem;
}

.jm-ref-input-shell {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 22px 54px rgba(13, 26, 80, 0.16);
}

.jm-ref-input-shell input {
    flex: 1 1 auto;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    padding: 0 1rem;
    color: #1f3250;
    font-size: 1rem;
}

.jm-ref-input-shell input::placeholder {
    color: #8fa0ba;
}

.jm-ref-btn-primary,
.jm-ref-btn-secondary,
.jm-ref-btn-light {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3.25rem;
    padding: 0 1.35rem;
    border-radius: 999px;
    font-weight: 700;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.jm-ref-btn-primary:hover,
.jm-ref-btn-secondary:hover,
.jm-ref-btn-light:hover,
.jm-ref-inline-link:hover,
.jm-ref-inline-link-light:hover {
    transform: translateY(-1px);
}

.jm-ref-btn-primary {
    border: none;
    color: #ffffff;
    background: #3051ff;
    box-shadow: 0 12px 24px rgba(48, 81, 255, 0.18);
}

.jm-ref-secondary-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.85rem 1rem;
    margin-bottom: 1.6rem;
}

.jm-ref-btn-secondary {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.jm-ref-inline-link,
.jm-ref-inline-link-light {
    font-weight: 700;
}

.jm-ref-inline-link {
    color: #c7f9ff;
}

.jm-ref-inline-link-light {
    color: #d8f9ff;
}

.jm-ref-micro-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.jm-ref-micro-card {
    padding: 1rem 1.1rem;
    border-radius: 1.45rem;
    background: rgba(255, 255, 255, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.14);
    min-width: 9rem;
    backdrop-filter: blur(12px);
}

.jm-ref-micro-card strong {
    display: block;
    color: #ffffff;
    font-size: 1.2rem;
}

.jm-ref-micro-card span {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.84rem;
}

.jm-ref-hero-visual {
    position: relative;
    min-height: 43rem;
    width: 100%;
    max-width: 640px;
    justify-self: center;
}

.jm-ref-glow {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.jm-ref-glow-a {
    width: 18rem;
    height: 18rem;
    left: 10%;
    top: 19%;
    background: radial-gradient(circle at center, rgba(117, 145, 255, 0.24), rgba(117, 145, 255, 0));
}

.jm-ref-glow-b {
    width: 10rem;
    height: 10rem;
    right: 5%;
    bottom: 17%;
    background: radial-gradient(circle at center, rgba(96, 255, 218, 0.2), rgba(96, 255, 218, 0));
}

.jm-ref-dashboard-card {
    position: absolute;
    border-radius: 2rem;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 28px 64px rgba(22, 42, 118, 0.18);
}

.jm-ref-layer-back {
    width: 17rem;
    top: -0.5rem;
    left: 0;
    transform: rotate(-8deg);
    padding: 0.9rem;
}

.jm-ref-layer-main {
    inset: 2rem 0.75rem 2rem 4rem;
    padding: 1.55rem;
    background: linear-gradient(180deg, rgba(45, 75, 255, 0.98), rgba(56, 84, 255, 0.95));
    color: #ffffff;
}

.jm-ref-layer-stat {
    width: 10.4rem;
    left: 6.8rem;
    bottom: 1.4rem;
    padding: 1.05rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(18px);
    color: #ffffff;
}

.jm-ref-mini-head {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.7rem;
    color: #213250;
    font-weight: 700;
}

.jm-ref-mini-head small {
    color: #7d8ca5;
}

.jm-ref-mini-preview img {
    width: 100%;
    display: block;
    height: 8rem;
    object-fit: cover;
    border-radius: 1.3rem;
}

.jm-ref-main-nav {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.85rem;
    margin-bottom: 1.2rem;
}

.jm-ref-main-center {
    position: relative;
    min-height: 29rem;
}

.jm-ref-phone-card {
    width: 15.8rem;
    margin: 2.8rem auto 0;
    border-radius: 2rem;
    padding: 1rem;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(17, 34, 102, 0.22);
}

.jm-ref-phone-top {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
    color: #22324d;
}

.jm-ref-message-list {
    display: grid;
    gap: 0.7rem;
}

.jm-ref-message-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem;
    border-radius: 1rem;
    background: #f5f8ff;
}

.jm-ref-message-item.active {
    background: #eef3ff;
    border: 1px solid rgba(46, 73, 235, 0.12);
}

.jm-ref-message-item img {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.jm-ref-message-item strong {
    display: block;
    color: #22324d;
    font-size: 0.84rem;
}

.jm-ref-message-item span {
    color: #7c8da8;
    font-size: 0.76rem;
}

.jm-ref-share-btn {
    width: 100%;
    margin-top: 1rem;
    border: none;
    border-radius: 999px;
    min-height: 2.9rem;
    color: #ffffff;
    font-weight: 700;
    background: linear-gradient(135deg, #2d4fff, #5f7cff);
}

.jm-ref-floating {
    position: absolute;
    padding: 0.9rem;
    border-radius: 1.4rem;
    background: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(12px);
    box-shadow: 0 18px 50px rgba(21, 40, 113, 0.16);
}

.jm-ref-floating-left {
    width: 9.6rem;
    left: 0.2rem;
    top: 7rem;
}

.jm-ref-floating-left img {
    width: 100%;
    border-radius: 1rem;
    height: 6rem;
    object-fit: cover;
}

.jm-ref-wave {
    display: block;
    height: 2rem;
    border-radius: 999px;
    margin-bottom: 0.6rem;
    background: linear-gradient(90deg, rgba(117, 245, 255, 0.8), rgba(255, 255, 255, 0.2));
}

.jm-ref-floating-right {
    width: 11rem;
    right: -0.1rem;
    top: 5rem;
}

.jm-ref-floating-right p {
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.78rem;
    line-height: 1.55;
    margin-bottom: 0.7rem;
}

.jm-ref-bubble {
    padding: 0.55rem 0.75rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.84);
    font-size: 0.74rem;
    margin-bottom: 0.5rem;
}

.jm-ref-layer-stat strong {
    display: block;
    font-size: 1.8rem;
    line-height: 1;
    margin-bottom: 0.3rem;
}

.jm-ref-layer-stat small,
.jm-ref-stat-icon {
    color: rgba(255, 255, 255, 0.78);
}

.jm-ref-stat-icon {
    display: inline-block;
    margin-bottom: 0.55rem;
}

.jm-ref-logo-strip,
.jm-ref-showcase,
.jm-ref-analytics,
.jm-ref-feature-grid,
.jm-ref-faq-lite,
.jm-ref-pricing,
.jm-ref-final-cta {
    position: relative;
    padding: 0 0 5rem;
}

.jm-ref-strip-shell,
.jm-ref-show-card,
.jm-ref-chart-card,
.jm-ref-feature-card,
.jm-ref-faq-item {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(72, 92, 151, 0.1);
    box-shadow: 0 22px 56px rgba(28, 42, 76, 0.055);
}

.jm-ref-showcase::before,
.jm-ref-analytics::before,
.jm-ref-feature-grid::before,
.jm-ref-faq-lite::before,
.jm-ref-pricing::before,
.jm-ref-final-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.jm-ref-showcase::before {
    background:
        radial-gradient(circle at 12% 30%, rgba(77, 110, 255, 0.12), transparent 22%),
        radial-gradient(circle at 86% 12%, rgba(102, 239, 224, 0.12), transparent 18%);
}

.jm-ref-analytics::before {
    background:
        radial-gradient(circle at 82% 28%, rgba(74, 107, 255, 0.11), transparent 24%),
        radial-gradient(circle at 14% 82%, rgba(98, 255, 224, 0.1), transparent 18%);
}

.jm-ref-feature-grid::before {
    background:
        radial-gradient(circle at 10% 15%, rgba(65, 94, 255, 0.08), transparent 16%),
        radial-gradient(circle at 90% 85%, rgba(88, 235, 214, 0.1), transparent 18%);
}

.jm-ref-faq-lite::before {
    background:
        radial-gradient(circle at 88% 18%, rgba(79, 112, 255, 0.1), transparent 18%);
}

.jm-ref-pricing::before {
    background:
        radial-gradient(circle at 50% 0%, rgba(82, 113, 255, 0.11), transparent 22%);
}

.jm-ref-final-cta::before {
    background:
        radial-gradient(circle at 80% 50%, rgba(71, 106, 255, 0.14), transparent 20%);
}

.jm-ref-glass-section {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(420px, 0.98fr);
    gap: 2rem;
    padding: 2.35rem;
    border-radius: 2.2rem;
    background:
        radial-gradient(circle at top left, rgba(71, 110, 255, 0.1), transparent 26%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(245, 249, 255, 0.9));
    border: 1px solid rgba(116, 139, 201, 0.18);
    box-shadow:
        0 24px 64px rgba(28, 42, 76, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.7);
    overflow: hidden;
}

.jm-ref-glass-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(83, 110, 187, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(83, 110, 187, 0.06) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.85), transparent);
    pointer-events: none;
}

.jm-ref-glass-copy,
.jm-ref-glass-scene {
    position: relative;
    z-index: 1;
}

.jm-ref-glass-copy {
    padding: 0.8rem 0.35rem 0.8rem 0.35rem;
}

.jm-ref-glass-copy h2 {
    font-family: "Onest", sans-serif;
    color: #1a2942;
    font-size: clamp(1.9rem, 3.6vw, 3rem);
    line-height: 1;
    letter-spacing: -0.05em;
    margin: 1.05rem 0 1.15rem;
    max-width: 11.5ch;
    text-wrap: balance;
}

.jm-ref-glass-copy p {
    color: #6d7f99;
    line-height: 1.9;
    max-width: 50ch;
    margin-bottom: 1.8rem;
}

.jm-ref-logo-grid-glass {
    max-width: 34rem;
}

.jm-ref-logo-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.7rem;
    width: min(100%, 42rem);
}

.jm-ref-logo-grid div {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 3.2rem;
    border-radius: 1.15rem;
    background: rgba(255, 255, 255, 0.56);
    border: 1px solid rgba(133, 150, 203, 0.15);
    backdrop-filter: blur(12px);
    color: #2540bb;
    font-weight: 700;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.72),
        0 10px 24px rgba(62, 83, 145, 0.06);
}

.jm-ref-glass-scene {
    position: relative;
    min-height: 24rem;
}

.jm-ref-glass-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
}

.jm-ref-glass-orb-a {
    width: 13rem;
    height: 13rem;
    left: 14%;
    top: 16%;
    background: radial-gradient(circle at center, rgba(64, 98, 255, 0.18), rgba(64, 98, 255, 0));
}

.jm-ref-glass-orb-b {
    width: 9rem;
    height: 9rem;
    right: 8%;
    bottom: 12%;
    background: radial-gradient(circle at center, rgba(98, 255, 224, 0.2), rgba(98, 255, 224, 0));
}

.jm-ref-glass-card {
    position: absolute;
    border-radius: 1.8rem;
    background: rgba(255, 255, 255, 0.34);
    border: 1px solid rgba(255, 255, 255, 0.35);
    backdrop-filter: blur(18px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.55),
        0 24px 50px rgba(55, 78, 147, 0.12);
}

.jm-ref-glass-card-main {
    inset: 1.5rem 4.5rem 1.5rem 1rem;
    padding: 1.25rem;
}

.jm-ref-glass-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.jm-ref-glass-card-head span {
    color: #1e2d48;
    font-weight: 800;
}

.jm-ref-glass-card-head small {
    color: #4c60d7;
    font-weight: 700;
}

.jm-ref-glass-card-body {
    display: grid;
    gap: 0.8rem;
}

.jm-ref-glass-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1rem;
    border-radius: 1.1rem;
    background: rgba(255, 255, 255, 0.45);
    border: 1px solid rgba(145, 162, 216, 0.14);
}

.jm-ref-glass-row strong {
    color: #22324d;
    font-size: 0.94rem;
}

.jm-ref-glass-row span {
    color: #6f819b;
    font-size: 0.82rem;
    text-align: right;
}

.jm-ref-status-dot {
    color: #0f9f79 !important;
    font-weight: 700;
}

.jm-ref-status-dot::before {
    content: "";
    display: inline-block;
    width: 0.55rem;
    height: 0.55rem;
    margin-right: 0.4rem;
    border-radius: 50%;
    background: #52d8a3;
    box-shadow: 0 0 0 0.2rem rgba(82, 216, 163, 0.16);
}

.jm-ref-glass-card-float {
    top: 1rem;
    right: 0.3rem;
    width: 11.5rem;
    padding: 1rem;
}

.jm-ref-glass-card-float span,
.jm-ref-glass-card-float small {
    display: block;
}

.jm-ref-glass-card-float span {
    color: #5467d8;
    font-size: 0.8rem;
    font-weight: 700;
}

.jm-ref-glass-card-float strong {
    display: block;
    color: #1d2d48;
    font-size: 2rem;
    line-height: 1;
    margin: 0.4rem 0 0.35rem;
}

.jm-ref-glass-card-float small {
    color: #70829d;
    line-height: 1.6;
}

.jm-ref-glass-card-panel {
    left: 3rem;
    right: 6.8rem;
    bottom: 1rem;
    padding: 1rem 1.1rem;
}

.jm-ref-mini-meter {
    display: flex;
    gap: 0.45rem;
    margin-bottom: 0.8rem;
}

.jm-ref-mini-meter span {
    display: inline-block;
    height: 0.7rem;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(93, 104, 255, 0.82), rgba(103, 241, 222, 0.92));
}

.jm-ref-mini-meter span:nth-child(1) {
    width: 36%;
}

.jm-ref-mini-meter span:nth-child(2) {
    width: 24%;
}

.jm-ref-mini-meter span:nth-child(3) {
    width: 18%;
}

.jm-ref-glass-card-panel p {
    color: #5f7190;
    line-height: 1.7;
    margin: 0;
}

.jm-ref-section-head {
    max-width: 52rem;
    margin-bottom: 2rem;
    position: relative;
    z-index: 1;
}

.jm-ref-section-head h2,
.jm-ref-analytics-copy h2,
.jm-ref-faq-copy h2,
.jm-ref-final-card h2 {
    font-family: "Onest", sans-serif;
    color: #1a2942;
    font-size: clamp(2rem, 4vw, 3.35rem);
    line-height: 1;
    letter-spacing: -0.05em;
    margin: 1rem 0 1.15rem;
    text-wrap: balance;
}

.jm-ref-section-head p,
.jm-ref-analytics-copy p,
.jm-ref-faq-copy p,
.jm-ref-final-card p {
    color: #697b97;
    line-height: 1.9;
    font-size: 1rem;
}

.jm-ref-showcase-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.2fr 0.8fr 0.8fr;
    gap: 1.5rem;
}

.jm-ref-show-card {
    position: relative;
    padding: 2rem;
    border-radius: 2.1rem;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(243, 248, 255, 0.86));
    border: 1px solid rgba(122, 143, 201, 0.16);
    backdrop-filter: blur(18px);
    box-shadow:
        0 22px 56px rgba(34, 50, 91, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.jm-ref-show-orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(2px);
}

.jm-ref-show-orb-a {
    width: 12rem;
    height: 12rem;
    right: -2rem;
    top: -2rem;
    background: radial-gradient(circle at center, rgba(82, 113, 255, 0.18), rgba(82, 113, 255, 0));
}

.jm-ref-show-orb-b {
    width: 9rem;
    height: 9rem;
    left: 38%;
    bottom: -2.5rem;
    background: radial-gradient(circle at center, rgba(96, 241, 224, 0.16), rgba(96, 241, 224, 0));
}

.jm-ref-show-card::before,
.jm-ref-chart-card::before,
.jm-ref-feature-card::before,
.jm-ref-faq-item::before,
.jm-home-ref .jm-ref-pricing .card::before,
.jm-ref-final-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
}

.jm-ref-show-card::before,
.jm-ref-chart-card::before,
.jm-ref-feature-card::before,
.jm-ref-faq-item::before,
.jm-home-ref .jm-ref-pricing .card::before {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.08));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.jm-ref-show-card-wide {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.95fr);
    gap: 1.8rem;
    align-items: center;
}

.jm-ref-show-card span,
.jm-ref-analytics-copy span,
.jm-ref-faq-copy span {
    color: #4662ef;
    font-weight: 700;
}

.jm-ref-show-card h3,
.jm-ref-feature-card h3,
.jm-ref-faq-item h3 {
    position: relative;
    z-index: 1;
    font-family: "Onest", sans-serif;
    color: #1c2b45;
    font-size: 1.5rem;
    line-height: 1.14;
    margin: 0.9rem 0 0.75rem;
    text-wrap: balance;
}

.jm-ref-show-card p,
.jm-ref-feature-card p,
.jm-ref-faq-item p {
    position: relative;
    z-index: 1;
    color: #71829d;
    line-height: 1.82;
}

.jm-ref-card-copy,
.jm-ref-analytics-copy,
.jm-ref-chart-card,
.jm-ref-feature-card,
.jm-ref-faq-item {
    position: relative;
    z-index: 1;
}

.jm-ref-show-card span {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 0.3rem;
}

.jm-ref-show-card span::before {
    content: "";
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: linear-gradient(135deg, #4b6eff, #67eed9);
    box-shadow: 0 0 0 0.3rem rgba(75, 110, 255, 0.1);
}

.jm-ref-mini-visual {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    gap: 0.45rem;
    height: 3.8rem;
    margin-bottom: 1rem;
}

.jm-ref-mini-visual span {
    display: block;
    width: 0.8rem;
    border-radius: 999px;
    background: linear-gradient(180deg, #6be9dd, #4b6eff);
    box-shadow: 0 10px 24px rgba(75, 110, 255, 0.16);
}

.jm-ref-mini-visual span:nth-child(1) {
    height: 2.1rem;
}

.jm-ref-mini-visual span:nth-child(2) {
    height: 3.5rem;
}

.jm-ref-mini-visual span:nth-child(3) {
    height: 2.8rem;
}

.jm-ref-mini-pill-board {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-bottom: 1rem;
}

.jm-ref-mini-pill-board span {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.62);
    border: 1px solid rgba(133, 150, 203, 0.16);
    backdrop-filter: blur(10px);
    color: #3550dd;
    font-size: 0.78rem;
    font-weight: 700;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        0 10px 22px rgba(58, 81, 151, 0.08);
}

.jm-ref-mini-pill-board span::before {
    display: none;
}

.jm-ref-icon-board {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.jm-ref-icon-board div {
    min-height: 4rem;
    border-radius: 1.2rem;
    background: rgba(255, 255, 255, 0.58);
    border: 1px solid rgba(131, 150, 206, 0.16);
    backdrop-filter: blur(12px);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2f49d0;
    font-weight: 700;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.82),
        0 12px 26px rgba(58, 81, 151, 0.08);
}

.jm-ref-analytics-grid,
.jm-ref-faq-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: 2rem;
    align-items: center;
}

.jm-ref-highlight {
    margin-top: 1.8rem;
    padding: 1.3rem 1.45rem;
    border-radius: 1.7rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(240, 246, 255, 0.92));
    border: 1px solid rgba(124, 144, 203, 0.16);
    backdrop-filter: blur(16px);
    display: inline-flex;
    flex-direction: column;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.84),
        0 16px 36px rgba(44, 61, 108, 0.065);
}

.jm-ref-highlight strong {
    color: #2540bb;
    font-size: 3rem;
    line-height: 1;
}

.jm-ref-highlight span {
    color: #6d7d98;
    margin-top: 0.4rem;
}

.jm-ref-chart-card {
    position: relative;
    padding: 1.9rem;
    border-radius: 2.1rem;
    background:
        radial-gradient(circle at top right, rgba(74, 108, 255, 0.12), transparent 24%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(244, 248, 255, 0.9));
    border: 1px solid rgba(122, 143, 201, 0.16);
    backdrop-filter: blur(18px);
    box-shadow:
        0 22px 56px rgba(34, 50, 91, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.jm-ref-chart-float {
    position: absolute;
    z-index: 1;
    border-radius: 1.25rem;
    backdrop-filter: blur(14px);
    border: 1px solid rgba(128, 147, 208, 0.18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.75),
        0 18px 40px rgba(46, 65, 113, 0.1);
}

.jm-ref-chart-float-a {
    top: 1.4rem;
    right: 1.4rem;
    padding: 0.85rem 1rem;
    background: rgba(255, 255, 255, 0.66);
}

.jm-ref-chart-float-a strong {
    display: block;
    color: #2743be;
    font-size: 1.1rem;
    line-height: 1;
}

.jm-ref-chart-float-a span {
    display: block;
    margin-top: 0.35rem;
    color: #6b7d98;
    font-size: 0.72rem;
}

.jm-ref-chart-float-b {
    left: 1.4rem;
    bottom: 1.6rem;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.75rem 0.9rem;
    background: rgba(255, 255, 255, 0.72);
}

.jm-ref-chart-dot {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    background: linear-gradient(135deg, #53e0ba, #4b6eff);
    box-shadow: 0 0 0 0.25rem rgba(83, 224, 186, 0.16);
}

.jm-ref-chart-float-b small {
    color: #5f7190;
    font-weight: 700;
}

.jm-ref-chart-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    color: #687b98;
    margin-bottom: 1.5rem;
}

.jm-ref-bars {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    align-items: end;
    min-height: 22rem;
}

.jm-ref-bars::before {
    content: "";
    position: absolute;
    inset: 0 0 1.4rem;
    border-radius: 1.5rem;
    background-image:
        linear-gradient(rgba(96, 114, 170, 0.09) 1px, transparent 1px);
    background-size: 100% 22%;
    pointer-events: none;
}

.jm-ref-bar-item {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.jm-ref-bar-item span,
.jm-ref-bar-item small {
    color: #6f809a;
}

.jm-ref-bar {
    border-radius: 1.4rem 1.4rem 0.8rem 0.8rem;
    background: linear-gradient(180deg, #89a2ff, #cad4ff);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        0 18px 34px rgba(92, 111, 187, 0.14);
}

.bar-1 { height: 10rem; }
.bar-2 { height: 14rem; }
.bar-3 { height: 17rem; }

.jm-ref-cards-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.jm-ref-feature-card {
    position: relative;
    padding: 1.95rem;
    border-radius: 2rem;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(79, 112, 255, 0.12), transparent 24%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(244, 248, 255, 0.92));
    border: 1px solid rgba(122, 143, 201, 0.16);
    backdrop-filter: blur(16px);
    box-shadow:
        0 20px 48px rgba(34, 50, 91, 0.055),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.jm-ref-feature-art {
    position: absolute;
    top: 1rem;
    right: 1rem;
    opacity: 0.7;
    pointer-events: none;
}

.jm-ref-feature-art-lines {
    width: 3.6rem;
    height: 3.6rem;
    border-radius: 1.2rem;
    background-image:
        linear-gradient(rgba(83, 110, 255, 0.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(83, 110, 255, 0.12) 1px, transparent 1px);
    background-size: 12px 12px;
}

.jm-ref-feature-art-circle {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    border: 1px solid rgba(75, 110, 255, 0.18);
    box-shadow:
        inset 0 0 0 0.8rem rgba(75, 110, 255, 0.06),
        inset 0 0 0 1.55rem rgba(99, 238, 217, 0.08);
}

.jm-ref-feature-art-bars {
    width: 3.6rem;
    height: 3.6rem;
    display: flex;
    align-items: flex-end;
    gap: 0.3rem;
}

.jm-ref-feature-art-bars::before,
.jm-ref-feature-art-bars::after,
.jm-ref-feature-art-bars {
    background: none;
}

.jm-ref-feature-art-bars::before,
.jm-ref-feature-art-bars::after {
    content: "";
    display: block;
    width: 0.8rem;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(75, 110, 255, 0.24), rgba(103, 238, 217, 0.42));
}

.jm-ref-feature-art-bars::before {
    height: 2rem;
}

.jm-ref-feature-art-bars::after {
    height: 3rem;
}

.jm-ref-feature-art-bars span {
    display: block;
}

.jm-ref-feature-icon {
    width: 2.75rem;
    height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(75, 110, 255, 0.16), rgba(103, 238, 217, 0.24));
    color: #2b45cb;
    font-weight: 800;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.jm-ref-faq-list {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 1rem;
}

.jm-ref-faq-item {
    position: relative;
    padding: 1.7rem 1.8rem;
    border-radius: 1.85rem;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(243, 248, 255, 0.9));
    border: 1px solid rgba(122, 143, 201, 0.16);
    backdrop-filter: blur(16px);
    box-shadow:
        0 18px 42px rgba(34, 50, 91, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.jm-ref-faq-accent {
    width: 3rem;
    height: 0.3rem;
    margin-bottom: 0.9rem;
    border-radius: 999px;
    background: linear-gradient(90deg, #4b6eff, #66edda);
    box-shadow: 0 10px 24px rgba(75, 110, 255, 0.14);
}

.jm-ref-faq-item h3 {
    font-size: 1.35rem;
    margin-bottom: 0.7rem;
}

.jm-home-ref .jm-ref-pricing .container {
    max-width: 1280px;
}

.jm-home-ref .jm-ref-pricing .jm-heading h1 {
    font-family: "Onest", sans-serif;
    color: #1b2942;
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    line-height: 1;
    letter-spacing: -0.05em;
}

.jm-home-ref .jm-ref-pricing .jm-heading p {
    color: #71829d;
}

.jm-home-ref .jm-ref-pricing .btn-group {
    background: rgba(255, 255, 255, 0.68);
    padding: 0.35rem;
    border-radius: 999px;
    border: 1px solid rgba(124, 144, 203, 0.14);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.82),
        0 18px 38px rgba(44, 61, 108, 0.06);
    backdrop-filter: blur(12px);
}

.jm-home-ref .jm-ref-pricing .btn-group .btn {
    border-radius: 999px !important;
    color: #667895;
}

.jm-home-ref .jm-ref-pricing .btn-group .btn.active {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(245, 249, 255, 0.96));
    color: #203250;
    box-shadow: 0 10px 24px rgba(28, 42, 76, 0.1);
}

.jm-home-ref .jm-ref-pricing .card {
    position: relative;
    border: 1px solid rgba(72, 92, 151, 0.1);
    border-radius: 2rem;
    background:
        radial-gradient(circle at top right, rgba(79, 112, 255, 0.11), transparent 22%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.8), rgba(243, 248, 255, 0.92));
    box-shadow:
        0 24px 65px rgba(28, 42, 76, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(16px);
    overflow: hidden;
}

.jm-home-ref .jm-ref-pricing .card-body {
    padding: 2rem 1.5rem;
}

.jm-home-ref .jm-ref-pricing .card .btn {
    border-radius: 999px;
    background: linear-gradient(135deg, #2847e8, #4762ff);
    color: #ffffff;
}

.jm-home-ref .jm-ref-pricing .featured {
    border-color: rgba(40, 71, 232, 0.35);
    transform: scale(1.03);
}

.jm-ref-final-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2rem;
    align-items: center;
    padding: 2.5rem 2.75rem;
    border-radius: 2.5rem;
    background: #3051ff;
    color: #ffffff;
    box-shadow: 0 30px 70px rgba(36, 62, 173, 0.14);
    overflow: hidden;
}

.jm-ref-final-card::before {
    background:
        radial-gradient(circle at 82% 22%, rgba(108, 241, 255, 0.22), transparent 20%),
        linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
    background-size: auto, 34px 34px, 34px 34px;
    opacity: 0.7;
}

.jm-ref-final-card h2,
.jm-ref-final-card p {
    color: #ffffff;
}

.jm-ref-final-card p {
    color: rgba(255, 255, 255, 0.8);
}

.jm-ref-final-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.jm-ref-btn-light {
    background: #3051ff;
    color: #ffffff;
}

.jm-home-ref .footer {
    background: transparent;
}

@media screen and (max-width: 1199px) {
    .jm-ref-hero-inner,
    .jm-ref-glass-section,
    .jm-ref-analytics-grid,
    .jm-ref-faq-grid,
    .jm-ref-showcase-grid {
        grid-template-columns: 1fr;
    }

    .jm-ref-show-card-wide {
        grid-template-columns: 1fr;
    }

    .jm-ref-hero-inner {
        gap: 3.25rem;
        padding-top: 1.4rem;
        padding-bottom: 4rem;
    }

    .jm-ref-hero-copy,
    .jm-ref-glass-copy,
    .jm-ref-section-head,
    .jm-ref-analytics-copy,
    .jm-ref-faq-copy {
        text-align: center;
        justify-self: center;
    }

    .jm-ref-hero-copy h1 {
        max-width: none;
    }

    .jm-ref-hero-copy p,
    .jm-ref-glass-copy p,
    .jm-ref-section-head p,
    .jm-ref-analytics-copy p,
    .jm-ref-faq-copy p {
        margin-left: auto;
        margin-right: auto;
    }

    .jm-ref-cta-group,
    .jm-ref-logo-grid,
    .jm-ref-highlight {
        margin-left: auto;
        margin-right: auto;
    }

    .jm-ref-secondary-actions,
    .jm-ref-micro-stats,
    .jm-ref-final-actions {
        justify-content: center;
    }

    .jm-ref-hero-visual {
        min-height: 36rem;
        max-width: 760px;
        justify-self: center;
    }

    .jm-ref-glass-scene {
        min-height: 22rem;
        max-width: 42rem;
        width: 100%;
        justify-self: center;
    }
}

@media screen and (max-width: 991px) {
    .jm-home-ref .navbar-toggler,
    .jm-home-ref .navbar .nav-link,
    .jm-home-ref .navbar .nav-link-icon,
    .jm-home-ref .navbar .nav-link-title {
        color: #203250 !important;
    }

    .jm-home-ref .navbar .navbar-collapse {
        margin-top: 0.8rem;
        padding: 1rem;
        border-radius: 1.2rem;
        background: rgba(255, 255, 255, 0.96);
        box-shadow: 0 18px 40px rgba(28, 41, 75, 0.08);
    }

    .jm-ref-logo-grid,
    .jm-ref-cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .jm-ref-logo-strip,
    .jm-ref-showcase,
    .jm-ref-analytics,
    .jm-ref-feature-grid,
    .jm-ref-faq-lite,
    .jm-ref-pricing,
    .jm-ref-final-cta {
        padding-bottom: 3.5rem;
    }

    .jm-ref-main-nav {
        justify-content: center;
        flex-wrap: wrap;
    }

    .jm-ref-glass-copy h2,
    .jm-ref-section-head h2,
    .jm-ref-analytics-copy h2,
    .jm-ref-faq-copy h2,
    .jm-ref-final-card h2,
    .jm-home-ref .jm-ref-pricing .jm-heading h1 {
        max-width: 14ch;
        margin-left: auto;
        margin-right: auto;
    }

    .jm-ref-final-card {
        text-align: center;
    }

    .jm-ref-final-card {
        grid-template-columns: 1fr;
    }

    .jm-ref-chart-float-a,
    .jm-ref-chart-float-b {
        position: relative;
        top: auto;
        right: auto;
        left: auto;
        bottom: auto;
        margin-bottom: 1rem;
    }

    .jm-home-ref .jm-ref-pricing .row.row-cards {
        row-gap: 1.25rem;
    }

    .jm-home-ref .jm-ref-pricing .card {
        height: 100%;
    }

    .jm-home-ref .jm-ref-pricing .featured {
        transform: none;
    }
}

@media screen and (max-width: 767px) {
    .jm-ref-hero-shell {
        min-height: auto;
    }

    .jm-ref-hero-copy h1 {
        font-size: clamp(2.35rem, 10vw, 3.05rem);
        line-height: 0.94;
    }

    .jm-home-ref .navbar > .container-fluid,
    .jm-ref-hero-inner,
    .jm-home-ref .container-xl,
    .jm-home-ref .container {
        padding-left: 1.1rem;
        padding-right: 1.1rem;
    }

    .jm-ref-hero-inner {
        padding-top: 0.9rem;
        padding-bottom: 3rem;
        gap: 2.5rem;
    }

    .jm-ref-hero-copy p {
        font-size: 0.98rem;
        line-height: 1.82;
        margin-bottom: 1.6rem;
    }

    .jm-ref-input-shell {
        flex-direction: column;
        align-items: stretch;
        border-radius: 1.6rem;
        padding: 0.8rem;
    }

    .jm-ref-input-shell input {
        padding: 0.5rem 0.9rem 0;
        text-align: center;
    }

    .jm-ref-btn-primary,
    .jm-ref-btn-secondary,
    .jm-ref-btn-light {
        width: 100%;
    }

    .jm-ref-secondary-actions,
    .jm-ref-final-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .jm-ref-micro-stats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.9rem;
    }

    .jm-ref-micro-card {
        min-width: 0;
        text-align: center;
    }

    .jm-ref-hero-visual {
        min-height: 29rem;
        max-width: 100%;
    }

    .jm-ref-layer-main {
        inset: 0.9rem 0 0.9rem 1.1rem;
        padding: 0.95rem;
        border-radius: 1.6rem;
    }

    .jm-ref-phone-card {
        width: min(100%, 13.2rem);
        margin-top: 5.35rem;
        border-radius: 1.6rem;
    }

    .jm-ref-floating-left {
        width: 7rem;
        top: 5.85rem;
        left: -0.1rem;
    }

    .jm-ref-floating-right {
        width: 8.7rem;
        top: 3.4rem;
        right: -0.25rem;
    }

    .jm-ref-layer-stat {
        width: 7.1rem;
        left: 1.4rem;
        bottom: 0.5rem;
        padding: 0.85rem;
    }

    .jm-ref-strip-shell {
        flex-direction: column;
        align-items: stretch;
    }

    .jm-ref-logo-grid,
    .jm-ref-cards-grid {
        grid-template-columns: 1fr;
    }

    .jm-ref-showcase-grid,
    .jm-ref-cards-grid,
    .jm-ref-faq-list {
        gap: 1.15rem;
    }

    .jm-ref-mini-pill-board {
        margin-bottom: 0.8rem;
    }

    .jm-ref-feature-art {
        transform: scale(0.85);
        transform-origin: top right;
    }

    .jm-ref-glass-section {
        padding: 1.4rem;
    }

    .jm-ref-glass-copy h2 {
        max-width: none;
    }

    .jm-ref-glass-scene {
        display: flex;
        flex-direction: column;
        gap: 0.85rem;
        min-height: auto;
    }

    .jm-ref-glass-card-main,
    .jm-ref-glass-card-float,
    .jm-ref-glass-card-panel {
        position: relative;
        inset: auto;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        width: 100%;
        padding: 1rem;
    }

    .jm-ref-bars {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        min-height: 15rem;
        gap: 0.7rem;
    }

    .jm-ref-bar {
        border-radius: 1rem;
    }

    .jm-ref-chart-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .jm-ref-chart-float-a,
    .jm-ref-chart-float-b {
        width: 100%;
    }

    .jm-ref-feature-card,
    .jm-ref-faq-item,
    .jm-ref-show-card,
    .jm-home-ref .jm-ref-pricing .card {
        border-radius: 1.7rem;
    }

    .jm-home-ref .jm-ref-pricing .jm-heading h1 {
        max-width: none;
    }

    .jm-home-ref .jm-ref-pricing .btn-group {
        width: 100%;
        max-width: 20rem;
        margin: 0 auto;
    }

    .jm-home-ref .jm-ref-pricing .btn-group .btn {
        flex: 1 1 50%;
    }

    .jm-home-ref .jm-ref-pricing .card-body {
        padding: 1.6rem 1.2rem;
    }

    .jm-home-ref .jm-ref-pricing .card .display-5 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 560px) {
    .jm-ref-hero-visual {
        min-height: 25rem;
    }

    .jm-ref-layer-back {
        width: 9.5rem;
        top: 0.3rem;
        left: 0.15rem;
    }

    .jm-ref-phone-card {
        width: 11.5rem;
        margin-top: 5.5rem;
    }

    .jm-ref-glass-row {
        align-items: flex-start;
        flex-direction: column;
        padding: 0.8rem 0.85rem;
    }

    .jm-ref-glass-card-float strong {
        font-size: 1.5rem;
    }

    .jm-ref-message-item {
        gap: 0.5rem;
        padding: 0.45rem;
    }

    .jm-ref-message-item img {
        width: 2rem;
        height: 2rem;
    }

    .jm-ref-floating-left {
        left: -0.2rem;
        top: 5.45rem;
    }

    .jm-ref-floating-right {
        display: none;
    }

    .jm-ref-main-nav {
        gap: 0.7rem;
        font-size: 0.76rem;
        margin-bottom: 0.7rem;
    }

    .jm-ref-phone-top,
    .jm-ref-message-item strong,
    .jm-ref-show-card h3,
    .jm-ref-feature-card h3,
    .jm-ref-faq-item h3 {
        font-size: 1.05rem;
    }

    .jm-ref-section-head h2,
    .jm-ref-analytics-copy h2,
    .jm-ref-faq-copy h2,
    .jm-ref-final-card h2,
    .jm-ref-glass-copy h2,
    .jm-home-ref .jm-ref-pricing .jm-heading h1 {
        font-size: clamp(1.8rem, 9vw, 2.35rem);
    }

    .jm-ref-bars {
        min-height: 12.5rem;
    }

    .bar-1 { height: 6.5rem; }
    .bar-2 { height: 9rem; }
    .bar-3 { height: 11rem; }

    .jm-ref-micro-stats {
        grid-template-columns: 1fr;
    }

    .jm-ref-final-card {
        padding: 1.75rem 1.3rem;
        border-radius: 1.95rem;
    }

    .jm-home-ref .jm-ref-pricing .card .btn,
    .jm-home-ref .jm-ref-pricing .btn-group {
        width: 100%;
    }
}

@media screen and (max-width: 420px) {
    .jm-home-ref .navbar > .container-fluid,
    .jm-ref-hero-inner,
    .jm-home-ref .container-xl,
    .jm-home-ref .container {
        padding-left: 0.8rem;
        padding-right: 0.8rem;
    }

    .jm-ref-hero-inner {
        padding-bottom: 2rem;
    }

    .jm-ref-hero-visual {
        min-height: 22.5rem;
    }

    .jm-ref-layer-back {
        display: none;
    }

    .jm-ref-layer-main {
        inset: 0;
        border-radius: 1.4rem;
    }

    .jm-ref-phone-card {
        width: 10.7rem;
        margin-top: 4.85rem;
        padding: 0.8rem;
    }

    .jm-ref-floating-left {
        width: 5.9rem;
        top: 5.1rem;
    }

    .jm-ref-layer-stat {
        width: 6.3rem;
        left: 0.75rem;
        bottom: 0.35rem;
    }

    .jm-ref-layer-stat strong {
        font-size: 1.35rem;
    }

    .jm-ref-main-nav {
        display: none;
    }

    .jm-ref-glass-section,
    .jm-ref-show-card,
    .jm-ref-chart-card,
    .jm-ref-feature-card,
    .jm-ref-faq-item,
    .jm-home-ref .jm-ref-pricing .card {
        border-radius: 1.4rem;
    }
}

/* ===== WARM HOMEPAGE REDESIGN ===== */

.jm-home-warm {
  background:
    radial-gradient(circle at top left, rgba(31, 26, 23, 0.04), transparent 32%),
    radial-gradient(circle at bottom right, rgba(186, 145, 80, 0.06), transparent 30%),
    linear-gradient(180deg, #f7f3eb 0%, #efe8dc 100%);
  min-height: 100vh;
}

.jm-home-warm .navbar,
[data-bs-theme="light"] .jm-home-warm .navbar,
[data-bs-theme] .jm-home-warm .navbar {
  background: transparent !important;
  box-shadow: none !important;
}

.jm-home-warm .navbar .nav-link,
.jm-home-warm .navbar .nav-link-icon,
.jm-home-warm .navbar .nav-link-title,
.jm-home-warm .navbar .jm-profile-name,
.jm-home-warm .navbar .navbar-toggler-icon {
  color: #1f1a17 !important;
}

.jm-home-warm .navbar .jm-designation {
  color: #675f55 !important;
}

.jm-warm-main {
  padding-bottom: 3rem;
}

.jm-warm-hero {
  padding: 2rem 0 0;
}

.jm-warm-hero-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
  min-height: calc(100vh - 200px);
}

.jm-warm-hero-copy {
  max-width: 520px;
}

.jm-warm-kicker {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.66);
  border: 1px solid rgba(255, 255, 255, 0.82);
  box-shadow: 0 10px 24px rgba(40, 31, 20, 0.05);
  font-size: 0.72rem;
  font-weight: 800;
  color: #675f55;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
}

.jm-warm-hero-copy h1 {
  font-family: "Onest", sans-serif;
  font-size: clamp(2.2rem, 5vw, 3.4rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -0.06em;
  color: #1f1a17;
  margin: 0 0 1rem;
}

.jm-warm-hero-copy p {
  font-size: 1rem;
  line-height: 1.65;
  color: #675f55;
  max-width: 42ch;
  margin: 0 0 1.75rem;
}

/* CTA */
.jm-warm-cta {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.jm-warm-join-form {
  width: 100%;
  max-width: 400px;
}

.jm-warm-input-group {
  display: flex;
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(255, 255, 255, 0.92);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 14px 32px rgba(40, 31, 20, 0.08);
  height: 54px;
}

.jm-warm-input-group input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 0 18px;
  font-size: 0.9rem;
  font-family: "Onest", sans-serif;
  font-weight: 600;
  color: #1f1a17;
  outline: none;
}

.jm-warm-input-group input::placeholder {
  color: #978d81;
  font-weight: 500;
}

.jm-warm-btn-join {
  background: #1f1a17;
  color: #fff;
  border: none;
  padding: 0 22px;
  font-family: "Onest", sans-serif;
  font-weight: 800;
  font-size: 0.84rem;
  letter-spacing: -0.02em;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.14s;
}

.jm-warm-btn-join:hover {
  background: #2d2520;
}

.jm-warm-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.jm-warm-btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.66);
  border: 1px solid rgba(255, 255, 255, 0.82);
  box-shadow: 0 10px 24px rgba(40, 31, 20, 0.05);
  font-size: 0.84rem;
  font-weight: 800;
  color: #1f1a17;
  text-decoration: none;
  letter-spacing: -0.02em;
  transition: all 0.15s;
  cursor: pointer;
}

.jm-warm-btn-secondary:hover {
  background: rgba(255, 255, 255, 0.88);
  color: #1f1a17;
  box-shadow: 0 4px 16px rgba(40, 31, 20, 0.08);
  text-decoration: none;
}

.jm-warm-btn-secondary:active {
  transform: scale(0.97);
}

/* Hero visual */
.jm-warm-hero-visual {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.jm-warm-preview-card {
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(255, 255, 255, 0.92);
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(40, 31, 20, 0.1);
}

.jm-warm-preview-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  background: linear-gradient(135deg, #2c2218, #1f1a17);
}

.jm-warm-preview-dots {
  display: flex;
  gap: 6px;
}

.jm-warm-preview-dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
}

.jm-warm-preview-dots span:first-child { background: #cc5c45; }
.jm-warm-preview-dots span:nth-child(2) { background: #d4a024; }
.jm-warm-preview-dots span:last-child { background: #2f8f64; }

.jm-warm-preview-label {
  font-size: 0.76rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.6);
  letter-spacing: -0.01em;
}

.jm-warm-preview-body {
  padding: 0;
}

.jm-warm-preview-body img {
  width: 100%;
  height: auto;
  display: block;
  max-height: 340px;
  object-fit: cover;
}

/* Stats row */
.jm-warm-stats-row {
  display: flex;
  gap: 10px;
}

.jm-warm-stat {
  flex: 1;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.88);
  border-radius: 18px;
  padding: 16px 14px;
  text-align: left;
  box-shadow: 0 10px 24px rgba(40, 31, 20, 0.05);
}

.jm-warm-stat strong {
  display: block;
  font-family: "Onest", sans-serif;
  font-size: 1.4rem;
  font-weight: 800;
  color: #1f1a17;
  letter-spacing: -0.04em;
  line-height: 1;
}

.jm-warm-stat span {
  display: block;
  margin-top: 5px;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #978d81;
}

/* Footer override for warm page */
.jm-home-warm .footer {
  background: transparent;
}

/* ===== RESPONSIVE ===== */
@media screen and (max-width: 991px) {
  .jm-warm-hero-inner {
    grid-template-columns: 1fr;
    gap: 2rem;
    min-height: auto;
    padding: 1rem 0 2rem;
  }

  .jm-warm-hero-copy {
    max-width: none;
    text-align: center;
    margin: 0 auto;
  }

  .jm-warm-hero-copy p {
    margin-left: auto;
    margin-right: auto;
  }

  .jm-warm-cta {
    align-items: center;
  }

  .jm-warm-actions {
    justify-content: center;
  }
}

@media screen and (max-width: 767px) {
  .jm-warm-hero-copy h1 {
    font-size: clamp(1.8rem, 8vw, 2.4rem);
  }

  .jm-warm-hero-copy p {
    font-size: 0.92rem;
  }

  .jm-warm-input-group {
    height: 48px;
    border-radius: 14px;
  }

  .jm-warm-btn-join {
    padding: 0 16px;
    font-size: 0.8rem;
  }

  .jm-warm-preview-card {
    border-radius: 16px;
  }

  .jm-warm-stats-row {
    gap: 8px;
  }

  .jm-warm-stat {
    padding: 12px 10px;
    border-radius: 14px;
  }

  .jm-warm-stat strong {
    font-size: 1.1rem;
  }

  .jm-warm-stat span {
    font-size: 0.62rem;
  }

  .jm-warm-btn-secondary {
    padding: 8px 14px;
    font-size: 0.8rem;
    border-radius: 12px;
  }
}

@media screen and (max-width: 575px) {
  .jm-warm-hero {
    padding: 1rem 0 0;
  }

  .jm-warm-kicker {
    font-size: 0.66rem;
    padding: 6px 12px;
  }

  .jm-warm-actions {
    flex-direction: column;
    width: 100%;
  }

  .jm-warm-btn-secondary {
    width: 100%;
    justify-content: center;
  }

  .jm-warm-join-form {
    max-width: none;
  }
}

/* ===== TASKHUB-STYLE HOMEPAGE ===== */

.jm-home-task {
    background:
        radial-gradient(circle at top left, rgba(255, 219, 106, 0.2), transparent 24%),
        radial-gradient(circle at 92% 18%, rgba(126, 104, 255, 0.16), transparent 20%),
        linear-gradient(180deg, #f9f6ef 0%, #fffdf9 28%, #ffffff 100%);
    min-height: 100vh;
    color: #1d2433;
}

.jm-home-task .navbar,
[data-bs-theme="light"] .jm-home-task .navbar,
[data-bs-theme] .jm-home-task .navbar {
    background: transparent !important;
    box-shadow: none !important;
}

.jm-home-task .navbar {
    padding-top: 1.2rem;
    padding-bottom: 0.8rem;
}

.jm-home-task .navbar > .container-fluid,
.jm-home-task .container-xl {
    max-width: 1240px;
}

.jm-home-task .navbar .nav-link,
.jm-home-task .navbar .nav-link-icon,
.jm-home-task .navbar .nav-link-title,
.jm-home-task .navbar .jm-profile-name,
.jm-home-task .navbar .text-secondary,
.jm-home-task .navbar .dropdown-toggle,
.jm-home-task .navbar .dropdown-toggle::after,
.jm-home-task .navbar .navbar-toggler,
.jm-home-task .navbar .navbar-toggler-icon {
    color: #222937 !important;
}

.jm-home-task .navbar .jm-designation {
    color: #7c8699 !important;
}

.jm-home-task .footer {
    background: #131116;
    color: rgba(255, 255, 255, 0.72);
    padding-top: 2rem;
    padding-bottom: 2rem;
}

/* ====== EasyWeek-inspired redesign ====== */
.jm-home-task {
    font-family: "Onest", sans-serif;
    background: #ffffff;
}

/* Header */
.jm-home-task .navbar {
    background: #ffffff !important;
    border-bottom: 1px solid rgba(20, 23, 29, 0.08);
    box-shadow: none !important;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.jm-home-task .navbar .nav-link,
.jm-home-task .navbar .nav-link-title {
    color: #14171d !important;
    font-weight: 600;
    font-family: "Onest", sans-serif;
}

.jm-home-task .navbar .nav-link:hover,
.jm-home-task .navbar .nav-link-title:hover {
    color: #56af40 !important;
}

.jm-home-task .navbar .linkpulse-brand-text {
    color: #14171d !important;
    font-family: "Onest", sans-serif !important;
}

.jm-home-task .navbar .icon-linkpulse {
    color: #56af40 !important;
}

.jm-home-task .navbar .Jm-upgrade-btn {
    background: #56af40 !important;
    border-color: #56af40 !important;
    border-radius: 0.625rem !important;
}

.jm-home-task .navbar .jm-nav-cta-btn {
    background: #56af40;
    color: #ffffff !important;
    padding: 0.5rem 1.25rem;
    border-radius: 0.625rem;
    font-weight: 800;
    transition: background 0.15s ease;
}

.jm-home-task .navbar .jm-nav-cta-btn:hover {
    background: #348e23;
    color: #ffffff !important;
}

.jm-home-task .footer {
    border-top: 1px solid rgba(20, 23, 29, 0.08);
}

.jm-home-task .footer .link-secondary {
    color: #728477 !important;
}

.jm-task-shell {
    overflow: hidden;
}

.jm-task-main {
    padding-bottom: 0.5rem;
}

.jm-task-hero {
    padding: 0 1.875rem 0;
    background: #ffffff;
}

.jm-task-hero-block {
    position: relative;
    background: url('/images/bg.webp') center center / cover no-repeat;
    border-radius: 1.875rem;
    overflow: hidden;
    padding-bottom: 4rem;
}

.jm-task-hero-grid {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4rem;
    padding-top: 3.5rem;
}

/* Decorative floating icons */
.jm-task-hero-deco {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}

.jm-deco-icon {
    position: absolute;
    width: 3rem;
    height: 3rem;
    border-radius: 0.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 24px rgba(0, 19, 106, 0.1);
}

.jm-deco-1 { top: 8%;  left: 4%;  transform: rotate(-8deg); }
.jm-deco-2 { top: 22%; left: 2%;  transform: rotate(5deg);  }
.jm-deco-3 { top: 55%; left: 3%;  transform: rotate(-5deg); }
.jm-deco-4 { top: 8%;  right: 4%; transform: rotate(7deg);  }
.jm-deco-5 { top: 28%; right: 2%; transform: rotate(-6deg); }
.jm-deco-6 { top: 58%; right: 3%; transform: rotate(4deg);  }

/* Ensure hero content stays above deco icons */
.jm-task-hero-block .container-xl {
    position: relative;
    z-index: 2;
}

.jm-task-kicker,
.jm-task-section-tag,
.jm-task-section-tag-light {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.9rem;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0;
}

.jm-task-kicker,
.jm-task-section-tag {
    background: #e0f0db;
    color: #348e23;
    border: none;
    box-shadow: none;
}

.jm-task-section-tag-light {
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.jm-task-hero-copy h1,
.jm-task-section-head h2,
.jm-task-dashboard-copy h2,
.jm-task-faq-copy h2,
.jm-task-final-card h2 {
    font-family: "Onest", sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
    text-wrap: balance;
}

.jm-task-hero-copy {
    text-align: center;
    max-width: 58rem;
    width: 100%;
}

.jm-task-hero-copy h1 {
    font-size: clamp(2.25rem, 5vw, 4rem);
    line-height: 1.08;
    color: #14171d;
    max-width: none;
    margin: 1rem auto 1.2rem;
    letter-spacing: -0.03em;
}

.jm-task-hero-copy p,
.jm-task-section-head p,
.jm-task-dashboard-copy p,
.jm-task-faq-copy p,
.jm-task-final-card p,
.jm-task-feature-card p,
.jm-task-faq-item p {
    color: #323232;
    font-size: 1rem;
    line-height: 1.7;
    font-weight: 400;
}

.jm-task-hero-copy p {
    max-width: 54ch;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.8rem;
}

.jm-task-hero-actions {
    display: grid;
    gap: 1rem;
    max-width: 36rem;
    margin: 0 auto;
}

.jm-task-join-form {
    margin: 0;
}

.jm-task-input-shell {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem;
    border-radius: 0.75rem;
    background: #ffffff;
    border: 2px solid #f3f5f7;
    transition: border-color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.jm-task-input-shell:focus-within {
    border-color: #56af40;
    background: #ffffff;
}

.jm-task-input-shell input {
    flex: 1 1 auto;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    padding: 0.5rem 0.95rem;
    color: #14171d;
    font-size: 0.98rem;
    font-weight: 600;
    font-family: "Onest", sans-serif;
}

.jm-task-input-shell input::placeholder {
    color: #728477;
    font-weight: 600;
}

.jm-task-btn-primary,
.jm-task-btn-secondary,
.jm-task-btn-dark,
.jm-task-btn-outline,
.jm-task-link-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3rem;
    padding: 0.75rem 1.5rem;
    border-radius: 0.625rem;
    font-weight: 800;
    font-size: 0.95rem;
    font-family: "Onest", sans-serif;
    text-decoration: none;
    transition: background 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.jm-task-btn-primary:hover,
.jm-task-btn-secondary:hover,
.jm-task-btn-dark:hover,
.jm-task-btn-outline:hover,
.jm-task-link-ghost:hover {
    text-decoration: none;
}

.jm-task-btn-primary {
    border: none;
    color: #ffffff;
    background: #56af40;
}

.jm-task-btn-primary:hover {
    background: #348e23;
    color: #ffffff;
}

.jm-task-secondary-actions,
.jm-task-final-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.85rem;
}

.jm-task-btn-secondary {
    background: #14171d;
    color: #ffffff;
}

.jm-task-btn-secondary:hover {
    background: #348e23;
    color: #ffffff;
}

.jm-task-link-ghost {
    background: #e0f0db;
    color: #348e23;
    font-weight: 700;
}

.jm-task-link-ghost:hover {
    background: #c8e5c0;
    color: #348e23;
}

.jm-task-btn-dark {
    background: #14171d;
    color: #ffffff;
}

.jm-task-btn-dark:hover {
    background: #56af40;
    color: #ffffff;
}

.jm-task-btn-outline {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.jm-task-btn-outline:hover {
    background: rgba(255, 255, 255, 0.22);
    color: #ffffff;
}

.jm-task-trust-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.8rem;
}

.jm-task-trust-badge {
    min-width: 8rem;
    padding: 0.95rem 1rem;
    border-radius: 1.25rem;
    background: #f3f5f7;
    border: none;
    box-shadow: none;
}

.jm-task-trust-badge strong,
.jm-task-trust-badge span {
    display: block;
}

.jm-task-trust-badge strong {
    color: #14171d;
    font-size: 1.1rem;
    font-weight: 700;
}

.jm-task-trust-badge span {
    color: #728477;
    font-size: 0.8rem;
    margin-top: 0.2rem;
    font-weight: 600;
}

.jm-task-hero-visual {
    /* Escape container — full viewport width */
    position: relative;
    /* Flex: left card + center card side by side, aligned to bottom */
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 1.5rem;
}

.jm-task-browser-card {
    border-radius: 1.25rem;
    background: #ffffff;
    border: 1px solid rgba(20, 23, 29, 0.07);
    box-shadow: 0 20px 80px rgba(0, 19, 106, 0.1);
}

.jm-task-browser-top {
    display: flex;
    gap: 0.4rem;
    padding-bottom: 1rem;
}

.jm-task-browser-top span {
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 50%;
    background: rgba(106, 118, 152, 0.18);
}

.jm-task-browser-top span:first-child {
    background: #ffcc58;
}

.jm-task-browser-top span:nth-child(2) {
    background: #56af40;
}

.jm-task-browser-top span:last-child {
    background: #ff4931;
}

.jm-task-browser-back {
    position: relative;
    left: auto;
    top: auto;
    width: 220px;
    flex-shrink: 0;
    padding: 1.1rem;
    transform: rotate(-5deg) translateY(2.5rem);
    z-index: 1;
    align-self: flex-end;
}

.jm-task-browser-metrics {
    display: grid;
    gap: 0.8rem;
}

.jm-task-browser-metrics div {
    padding: 1rem;
    border-radius: 1rem;
    background: #f3f5f7;
}

.jm-task-browser-metrics small,
.jm-task-mini-nav,
.jm-task-phone-head small,
.jm-task-dashboard-head small,
.jm-task-floating small,
.jm-task-preview-header small {
    color: #728477;
    font-size: 0.78rem;
    font-weight: 600;
}

.jm-task-browser-metrics strong,
.jm-task-phone-head strong,
.jm-task-dashboard-head strong,
.jm-task-floating strong,
.jm-task-preview-header strong {
    display: block;
    color: #14171d;
    font-size: 1.05rem;
    font-weight: 700;
}

.jm-task-browser-main {
    position: relative;
    inset: auto;
    flex: 0 0 auto;
    width: min(680px, 58vw);
    padding: 1.4rem;
    background: #ffffff;
    box-shadow: 0 40px 120px rgba(0, 19, 106, 0.13);
    z-index: 2;
}

.jm-task-mini-nav {
    display: flex;
    justify-content: space-between;
    gap: 0.7rem;
    font-weight: 700;
    padding-bottom: 1rem;
    color: #14171d;
}

.jm-task-visual-grid {
    display: grid;
    grid-template-columns: 15.6rem minmax(0, 1fr);
    gap: 1.15rem;
    align-items: start;
}

.jm-task-phone-panel,
.jm-task-dashboard-panel,
.jm-task-preview-panel,
.jm-task-feature-card,
.jm-task-faq-item,
.jm-task-final-card,
.jm-task-dashboard-card,
.jm-task-workflow-card {
    border-radius: 1.25rem;
    border: 1px solid rgba(20, 23, 29, 0.07);
    box-shadow: 0 10px 20px rgba(0, 19, 106, 0.05);
    transition: box-shadow 0.15s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.15s cubic-bezier(0.4, 0, 0.2, 1),
                border-color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

/* EasyWeek-style hover elevation */
.jm-task-feature-card:hover {
    box-shadow: 0 20px 100px rgba(0, 19, 106, 0.1);
    transform: translateY(-3px);
    border-color: rgba(86, 175, 64, 0.2);
}

.jm-task-workflow-card:hover {
    box-shadow: 0 20px 100px rgba(0, 19, 106, 0.1);
    transform: translateY(-3px);
}

.jm-task-phone-panel {
    padding: 1rem;
    background: #ffffff;
}

.jm-task-phone-head {
    display: flex;
    justify-content: space-between;
    gap: 0.7rem;
    margin-bottom: 1rem;
}

.jm-task-message-list {
    display: grid;
    gap: 0.7rem;
}

.jm-task-message-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border-radius: 0.75rem;
    background: #f3f5f7;
}

.jm-task-message-item.active {
    background: #e0f0db;
    border: 1px solid rgba(86, 175, 64, 0.2);
}

.jm-task-avatar {
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #56af40;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 800;
    flex-shrink: 0;
}

.jm-task-avatar.alt {
    background: #2d67ff;
}

.jm-task-avatar.yellow {
    background: #ffa800;
    color: #ffffff;
}

.jm-task-message-item strong,
.jm-task-note-card strong,
.jm-task-preview-mini-card strong,
.jm-task-planner-list strong {
    display: block;
    color: #14171d;
    font-size: 0.88rem;
    font-weight: 700;
}

.jm-task-message-item small,
.jm-task-note-card small,
.jm-task-planner-list small {
    color: #728477;
    font-size: 0.76rem;
    font-weight: 600;
}

.jm-task-panel-btn {
    width: 100%;
    margin-top: 1rem;
    min-height: 2.95rem;
    border: none;
    border-radius: 0.625rem;
    background: #56af40;
    color: #ffffff;
    font-weight: 800;
    font-family: "Onest", sans-serif;
    transition: background 0.15s ease;
}

.jm-task-panel-btn:hover {
    background: #348e23;
}

.jm-task-dashboard-panel {
    min-height: 100%;
    padding: 1.15rem;
    background: #ffffff;
}

.jm-task-dashboard-head,
.jm-task-preview-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
    margin-bottom: 1rem;
}

.jm-task-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    background: #e0f0db;
    color: #348e23;
    font-size: 0.74rem;
    font-weight: 800;
}

.jm-task-pill.soft {
    background: rgba(255, 255, 255, 0.22);
    color: #ffffff;
}

.jm-task-chart-area {
    display: grid;
    grid-template-columns: 10.5rem minmax(0, 1fr);
    gap: 1rem;
    align-items: end;
}

.jm-task-ring-card {
    padding: 1rem;
    border-radius: 1rem;
    background: #f3f5f7;
    text-align: center;
}

.jm-task-ring,
.jm-task-preview-ring,
.jm-task-score-circle {
    position: relative;
    display: grid;
    place-items: center;
    width: 7.4rem;
    height: 7.4rem;
    margin: 0 auto;
    border-radius: 50%;
}

.jm-task-ring,
.jm-task-preview-ring {
    background: conic-gradient(#56af40 0 72%, #e0f0db 72% 100%);
}

.jm-task-ring::before,
.jm-task-preview-ring::before,
.jm-task-score-circle::before {
    content: "";
    position: absolute;
    inset: 0.8rem;
    border-radius: 50%;
    background: #ffffff;
}

.jm-task-ring span,
.jm-task-preview-ring span,
.jm-task-score-circle strong {
    position: relative;
    z-index: 1;
    font-size: 1.25rem;
    font-weight: 800;
    color: #14171d;
}

.jm-task-bars {
    min-height: 10rem;
    display: flex;
    align-items: end;
    gap: 0.55rem;
    padding: 1rem 0.4rem 0.3rem;
}

.jm-task-bars span {
    flex: 1 1 0;
    border-radius: 0.5rem 0.5rem 0.3rem 0.3rem;
    background: #56af40;
    opacity: 0.65;
}

.jm-task-bars .bar-a { height: 46%; }
.jm-task-bars .bar-b { height: 62%; opacity: 0.8; }
.jm-task-bars .bar-c { height: 38%; }
.jm-task-bars .bar-d { height: 78%; opacity: 1; }
.jm-task-bars .bar-e { height: 58%; opacity: 0.8; }
.jm-task-bars .bar-f { height: 84%; opacity: 1; }

.jm-task-people-row {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    margin-top: 1rem;
}

.jm-task-user-stack {
    display: flex;
    align-items: center;
}

.jm-task-user-stack span,
.jm-task-preview-users span {
    width: 2.2rem;
    height: 2.2rem;
    margin-left: -0.45rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #56af40;
    border: 2px solid #ffffff;
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 800;
}

.jm-task-user-stack span:first-child,
.jm-task-preview-users span:first-child {
    margin-left: 0;
}

.jm-task-note-card {
    flex: 1 1 auto;
    padding: 0.9rem 1rem;
    border-radius: 1rem;
    background: #e0f0db;
}

.jm-task-floating {
    position: absolute;
    padding: 1rem 1.1rem;
    border-radius: 1.25rem;
    background: #ffffff;
    border: 1px solid rgba(20, 23, 29, 0.07);
    box-shadow: 0 20px 100px rgba(0, 19, 106, 0.1);
}

.jm-task-floating strong {
    margin: 0.2rem 0 0.05rem;
    color: #14171d;
}

.jm-task-floating span {
    color: #728477;
    font-size: 0.78rem;
    font-weight: 600;
}

.jm-task-floating-left {
    left: max(1.5rem, 3vw);
    bottom: 2rem;
    z-index: 3;
}

.jm-task-floating-right {
    right: max(1.5rem, 3vw);
    top: 1.5rem;
    z-index: 3;
}

.jm-task-logos,
.jm-task-difference,
.jm-task-dashboard-showcase,
.jm-task-workflow,
.jm-task-integrations,
.jm-task-faq,
.jm-task-pricing,
.jm-task-final-cta {
    padding: 2rem 0 5rem;
}

.jm-task-logos {
    background: #f3f5f7;
    padding: 3rem 0;
    margin-bottom: 5rem;
}

.jm-task-section-head {
    max-width: 46rem;
    margin: 0 auto 2.4rem;
}

.jm-task-section-head.text-center {
    text-align: center;
}

.jm-task-section-head h2,
.jm-task-dashboard-copy h2,
.jm-task-faq-copy h2,
.jm-task-final-card h2 {
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.1;
    margin: 0.75rem 0 0.9rem;
    color: #14171d;
}

.jm-task-logo-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 1.5rem 3rem;
    margin-top: 2.5rem;
}

.jm-task-logo-strip img {
    height: 2rem;
    width: auto;
    max-width: 120px;
    object-fit: contain;
    filter: grayscale(100%) opacity(0.55);
    transition: filter 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.jm-task-logo-strip img:hover {
    filter: grayscale(0%) opacity(1);
}

.jm-task-feature-cards,
.jm-task-workflow-grid {
    display: grid;
    gap: 1.3rem;
}

.jm-task-feature-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.jm-task-feature-card {
    position: relative;
    overflow: hidden;
    min-height: 19rem;
    padding: 2rem;
    background: #ffffff;
}

.jm-task-feature-card span,
.jm-task-workflow-top span {
    display: inline-flex;
    margin-bottom: 0.9rem;
    color: #728477;
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.jm-task-feature-card h3 {
    font-family: "Onest", sans-serif;
    font-size: 1.45rem;
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: #14171d;
    margin-bottom: 0.8rem;
    max-width: 13ch;
    font-weight: 700;
}

.jm-task-feature-card-cream::before,
.jm-task-feature-card-sky::before,
.jm-task-feature-card-violet::before {
    content: "";
    position: absolute;
    width: 12rem;
    height: 12rem;
    right: -3rem;
    bottom: -3rem;
    border-radius: 50%;
}

.jm-task-feature-card-cream::before {
    background: radial-gradient(circle at center, rgba(86, 175, 64, 0.14), rgba(86, 175, 64, 0));
}

.jm-task-feature-card-sky::before {
    background: radial-gradient(circle at center, rgba(45, 103, 255, 0.1), rgba(45, 103, 255, 0));
}

.jm-task-feature-card-violet::before {
    background: radial-gradient(circle at center, rgba(255, 168, 0, 0.14), rgba(255, 168, 0, 0));
}

.jm-task-feature-art {
    margin-top: 1.6rem;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
}

.jm-task-feature-metric {
    min-width: 6.5rem;
    padding: 1rem;
    border-radius: 1rem;
    background: #f3f5f7;
}

.jm-task-feature-metric strong {
    display: block;
    color: #14171d;
    font-size: 1.4rem;
    font-weight: 700;
}

.jm-task-feature-metric small {
    color: #728477;
    font-size: 0.74rem;
    font-weight: 600;
}

.jm-task-feature-line {
    flex: 1 1 auto;
    height: 4.8rem;
    border-radius: 1rem;
    background: #f3f5f7;
}

.jm-task-dashboard-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.95fr);
    gap: 2rem;
    align-items: center;
    padding: 2.5rem;
    background: #14171d;
    color: #ffffff;
    position: relative;
    overflow: hidden;
}

.jm-task-dashboard-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 82% 20%, rgba(86, 175, 64, 0.15), transparent 45%);
}

.jm-task-dashboard-copy,
.jm-task-dashboard-preview {
    position: relative;
    z-index: 1;
}

.jm-task-dashboard-copy h2,
.jm-task-dashboard-copy p,
.jm-task-final-card h2,
.jm-task-final-card p {
    color: #ffffff;
}

.jm-task-bullet-list {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0 0;
    display: grid;
    gap: 0.85rem;
}

.jm-task-bullet-list li {
    position: relative;
    padding-left: 1.5rem;
    color: rgba(255, 255, 255, 0.9);
    font-weight: 700;
}

.jm-task-bullet-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55rem;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: #56af40;
}

.jm-task-preview-panel {
    padding: 1.2rem;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(16px);
}

.jm-task-preview-body {
    display: grid;
    grid-template-columns: 8rem minmax(0, 1fr) 7.2rem;
    gap: 0.9rem;
    align-items: center;
}

.jm-task-preview-stat,
.jm-task-preview-mini-card,
.jm-task-preview-side {
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.1);
}

.jm-task-preview-stat strong {
    display: block;
    color: #ffffff;
    font-size: 1.65rem;
    font-weight: 700;
}

.jm-task-preview-stat small {
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.75rem;
    font-weight: 600;
}

.jm-task-preview-lines {
    display: grid;
    gap: 0.6rem;
    margin-top: 0.8rem;
}

.jm-task-preview-lines span {
    height: 0.75rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
}

.jm-task-preview-lines span:nth-child(2) {
    width: 82%;
    background: rgba(86, 175, 64, 0.55);
}

.jm-task-preview-lines span:nth-child(3) {
    width: 64%;
}

.jm-task-preview-side {
    text-align: center;
}

.jm-task-preview-ring {
    width: 5.9rem;
    height: 5.9rem;
    background: conic-gradient(#56af40 0 84%, rgba(86, 175, 64, 0.2) 84% 100%);
}

.jm-task-preview-users {
    display: flex;
    justify-content: center;
    margin-top: 0.8rem;
}

.jm-task-workflow-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.jm-task-workflow-card {
    min-height: 17rem;
    padding: 1.6rem;
    position: relative;
    overflow: hidden;
}

.jm-task-workflow-card.violet {
    background: #14171d;
    color: #ffffff;
}

.jm-task-workflow-card.yellow {
    background: #e0f0db;
}

.jm-task-workflow-card.lime {
    background: #f3f5f7;
}

.jm-task-workflow-card.white {
    background: #ffffff;
}

.jm-task-workflow-card.violet .jm-task-workflow-top span {
    color: rgba(255, 255, 255, 0.7);
}

.jm-task-final-card .jm-task-section-tag-light {
    color: rgba(255, 255, 255, 0.9);
}

.jm-task-collab-stack {
    display: grid;
    gap: 0.85rem;
    margin-top: 1.5rem;
}

.jm-task-collab-stack div {
    height: 2.9rem;
    border-radius: 0.625rem;
    background: rgba(255, 255, 255, 0.15);
}

.jm-task-collab-stack div:nth-child(2) {
    width: 86%;
}

.jm-task-collab-stack div:nth-child(3) {
    width: 72%;
}

.jm-task-collab-stack div:nth-child(4) {
    width: 58%;
}

.jm-task-score-circle {
    margin-top: 1.7rem;
    background: conic-gradient(#56af40 0 85%, rgba(86, 175, 64, 0.15) 85% 100%);
}

.jm-task-calendar-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 1.5rem;
}

.jm-task-calendar-grid span {
    aspect-ratio: 1;
    border-radius: 0.5rem;
    background: rgba(20, 23, 29, 0.08);
}

.jm-task-calendar-grid span:nth-child(3),
.jm-task-calendar-grid span:nth-child(8),
.jm-task-calendar-grid span:nth-child(11) {
    background: #56af40;
}

.jm-task-planner-list {
    display: grid;
    gap: 0.8rem;
    margin-top: 1.5rem;
}

.jm-task-planner-list div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.9rem 1rem;
    border-radius: 0.75rem;
    background: #f3f5f7;
}

.jm-task-integrations {
    text-align: center;
}

.jm-task-integration-grid {
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    gap: 0.85rem;
    max-width: 52rem;
    margin: 0 auto;
}

.jm-task-integration-grid span {
    aspect-ratio: 1;
    border-radius: 1rem;
    display: grid;
    place-items: center;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 800;
    box-shadow: 0 10px 20px rgba(0, 19, 106, 0.05);
    transition: box-shadow 0.15s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: default;
}

.jm-task-integration-grid span:hover {
    box-shadow: 0 20px 40px rgba(0, 19, 106, 0.15);
    transform: translateY(-4px) scale(1.08);
}

.jm-task-integration-grid .c-blue { background: #2d67ff; }
.jm-task-integration-grid .c-violet { background: #56af40; }
.jm-task-integration-grid .c-yellow { background: #ffa800; }
.jm-task-integration-grid .c-green { background: #348e23; }
.jm-task-integration-grid .c-pink { background: #ff4931; }
.jm-task-integration-grid .c-cyan { background: #56af40; opacity: 0.7; }
.jm-task-integration-grid .c-lime { background: #e0f0db; color: #14171d; }
.jm-task-integration-grid .c-orange { background: #ffa800; opacity: 0.8; }
.jm-task-integration-grid .c-indigo { background: #2d67ff; opacity: 0.7; }
.jm-task-integration-grid .c-aqua { background: #f3f5f7; color: #14171d; }

.jm-task-faq-grid {
    display: grid;
    grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
    gap: 2rem;
    align-items: start;
}

.jm-task-faq-list {
    display: grid;
    gap: 1rem;
}

.jm-task-faq-item {
    background: #ffffff;
    border-radius: 1rem;
    box-shadow: 0 10px 20px rgba(0, 19, 106, 0.05);
    overflow: hidden;
}

.jm-task-faq-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.4rem 1.6rem;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    color: #14171d;
    font-size: 1.05rem;
    font-weight: 700;
    font-family: inherit;
    transition: color 0.15s;
}

.jm-task-faq-btn:hover,
.jm-task-faq-btn.open {
    color: #56af40;
}

.jm-task-faq-icon {
    flex-shrink: 0;
    color: #728477;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1),
                color 0.15s;
}

.jm-task-faq-btn.open .jm-task-faq-icon {
    transform: rotate(180deg);
    color: #56af40;
}

.jm-task-faq-body {
    max-height: 600px;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.jm-task-faq-body p {
    padding: 0 1.6rem 1.4rem;
    margin: 0;
    color: #728477;
    font-size: 0.97rem;
    line-height: 1.7;
    font-weight: 600;
}

.jm-home-task .jm-task-pricing .container {
    max-width: 100%;
    padding: 0;
}

.jm-home-task .jm-task-pricing .mt-3 {
    margin-top: 0 !important;
}

.jm-home-task .jm-task-pricing .jm-heading h1 {
    font-family: "Onest", sans-serif;
    font-size: clamp(2.1rem, 4vw, 3rem);
    color: #14171d;
    letter-spacing: -0.02em;
}

.jm-home-task .jm-task-pricing .jm-heading p {
    color: #728477;
}

.jm-home-task .jm-task-pricing .btn-group {
    padding: 0.35rem;
    border-radius: 0.75rem;
    background: #f3f5f7;
}

.jm-home-task .jm-task-pricing .btn-group .btn {
    border-radius: 0.625rem !important;
    color: #728477;
    font-weight: 700;
}

.jm-home-task .jm-task-pricing .btn-group .btn.active {
    background: #ffffff;
    color: #14171d;
    box-shadow: 0 10px 20px rgba(0, 19, 106, 0.05);
}

.jm-home-task .jm-task-pricing .card {
    border: 1px solid rgba(20, 23, 29, 0.07);
    border-radius: 1.25rem;
    background: #ffffff;
    box-shadow: 0 10px 20px rgba(0, 19, 106, 0.05);
    overflow: hidden;
}

.jm-home-task .jm-task-pricing .card-body {
    padding: 2rem 1.4rem;
}

.jm-home-task .jm-task-pricing .card .btn {
    border-radius: 0.625rem;
    background: #56af40;
    color: #ffffff;
    font-weight: 800;
    border: none;
}

.jm-home-task .jm-task-pricing .card .btn:hover {
    background: #348e23;
}

.jm-home-task .jm-task-pricing .featured {
    transform: scale(1.03);
    border-color: rgba(86, 175, 64, 0.3);
}

.jm-task-final-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.75rem;
    align-items: center;
    padding: 2.5rem;
    background: #56af40;
    position: relative;
    overflow: hidden;
}

.jm-task-final-card::before {
    content: "";
    position: absolute;
    right: -4rem;
    top: -4rem;
    width: 14rem;
    height: 14rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
}

.jm-task-final-card h2,
.jm-task-final-card p {
    color: #ffffff;
    position: relative;
    z-index: 1;
}

.jm-task-final-card p {
    color: rgba(255, 255, 255, 0.85);
}

.jm-task-final-card .jm-task-section-tag-light {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.25);
    position: relative;
    z-index: 1;
}

.jm-task-final-card .jm-task-btn-dark {
    background: #14171d;
    color: #ffffff;
    z-index: 1;
    position: relative;
}

.jm-task-final-card .jm-task-btn-dark:hover {
    background: #000000;
    color: #ffffff;
}

.jm-task-final-actions {
    position: relative;
    z-index: 1;
}

@media screen and (max-width: 1199px) {
    .jm-task-dashboard-card,
    .jm-task-faq-grid {
        grid-template-columns: 1fr;
    }

    .jm-task-hero-grid {
        gap: 2.8rem;
    }

    .jm-task-section-head,
    .jm-task-dashboard-copy,
    .jm-task-faq-copy {
        text-align: center;
        justify-self: center;
    }

    .jm-task-dashboard-copy h2,
    .jm-task-faq-copy h2,
    .jm-task-final-card h2 {
        max-width: none;
    }

    .jm-task-section-head p,
    .jm-task-dashboard-copy p,
    .jm-task-faq-copy p {
        margin-left: auto;
        margin-right: auto;
    }

    .jm-task-logo-strip {
        margin-left: auto;
        margin-right: auto;
    }

    .jm-task-hero-visual {
        max-width: 760px;
    }

    .jm-task-preview-body {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media screen and (max-width: 991px) {
    .jm-task-hero {
        padding: 1rem 1rem 0;
    }

    .jm-task-hero-block {
        border-radius: 1.25rem;
        padding-bottom: 2.5rem;
    }

    .jm-deco-1, .jm-deco-2, .jm-deco-3 { left: 1%; }
    .jm-deco-4, .jm-deco-5, .jm-deco-6 { right: 1%; }

    .jm-home-task .navbar .navbar-collapse {
        margin-top: 0.8rem;
        padding: 1rem 1.25rem;
        border-radius: 1.25rem;
        background: #ffffff;
        box-shadow: 0 20px 100px rgba(0, 19, 106, 0.1);
    }

    .jm-task-logo-strip,
    .jm-task-feature-cards,
    .jm-task-workflow-grid,
    .jm-task-integration-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .jm-task-visual-grid {
        grid-template-columns: 1fr;
    }

    .jm-task-browser-main {
        inset: 0;
    }

    .jm-task-browser-back {
        display: none;
    }

    .jm-task-hero-visual {
        gap: 1rem;
        padding: 0 1rem;
    }

    .jm-task-browser-back {
        width: 180px;
    }

    .jm-task-browser-main {
        width: min(580px, 60vw);
    }

    .jm-task-floating-left,
    .jm-task-floating-right {
        display: none;
    }

    .jm-task-preview-body {
        grid-template-columns: 1fr;
    }

    .jm-home-task .jm-task-pricing .featured {
        transform: none;
    }
}

@media screen and (max-width: 767px) {
    .jm-home-task .navbar > .container-fluid,
    .jm-home-task .container-xl {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .jm-task-hero {
        padding: 0.75rem 0.75rem 0;
    }

    .jm-task-hero-block {
        border-radius: 1rem;
        padding-bottom: 2rem;
    }

    /* Hide deco icons on small screens */
    .jm-task-hero-deco { display: none; }

    .jm-task-hero-copy h1 {
        font-size: clamp(1.9rem, 9vw, 2.25rem);
    }

    .jm-task-hero-copy p,
    .jm-task-section-head p,
    .jm-task-dashboard-copy p,
    .jm-task-faq-copy p,
    .jm-task-final-card p {
        font-size: 0.96rem;
    }

    .jm-task-input-shell {
        flex-direction: column;
        align-items: stretch;
        border-radius: 1.5rem;
        padding: 0.8rem;
    }

    .jm-task-input-shell input {
        padding: 0.3rem 0.8rem 0;
        text-align: center;
    }

    .jm-task-btn-primary,
    .jm-task-btn-secondary,
    .jm-task-btn-dark,
    .jm-task-btn-outline,
    .jm-task-link-ghost {
        width: 100%;
    }

    .jm-task-secondary-actions,
    .jm-task-final-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .jm-task-hero-visual {
        flex-direction: column;
        align-items: center;
        padding: 0;
        gap: 0.75rem;
    }

    .jm-task-browser-back {
        width: 100%;
        max-width: 320px;
        transform: none;
        align-self: center;
    }

    .jm-task-browser-main {
        width: 100%;
        max-width: 420px;
        padding: 1rem;
        border-radius: 1.25rem;
    }

    .jm-task-chart-area {
        grid-template-columns: 1fr;
    }

    .jm-task-people-row {
        flex-direction: column;
        align-items: stretch;
    }

    .jm-task-dashboard-card,
    .jm-task-final-card {
        padding: 1.6rem;
    }
}

@media screen and (max-width: 560px) {
    .jm-task-logo-strip,
    .jm-task-feature-cards,
    .jm-task-workflow-grid,
    .jm-task-integration-grid {
        grid-template-columns: 1fr;
    }

    .jm-task-trust-row {
        display: grid;
        grid-template-columns: 1fr;
    }

    .jm-task-hero-visual {
    }

    .jm-task-phone-panel,
    .jm-task-dashboard-panel,
    .jm-task-feature-card,
    .jm-task-dashboard-card,
    .jm-task-workflow-card,
    .jm-task-faq-item,
    .jm-task-final-card,
    .jm-home-task .jm-task-pricing .card {
        border-radius: 1.25rem;
    }

    .jm-task-browser-main {
        position: relative;
    }

    .jm-task-mini-nav {
        flex-wrap: wrap;
    }

    .jm-home-task .jm-task-pricing .btn-group {
        width: 100%;
    }

    .jm-home-task .jm-task-pricing .btn-group .btn {
        flex: 1 1 50%;
    }
}

/* ============================================
   JM SITE HEADER — EasyWeek-style navbar
   ============================================ */

.jm-site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    font-family: "Onest", sans-serif;
    background: transparent;
    padding: 0 75px 0;
    transition: background 0.2s, padding 0.2s;
}

.jm-site-header.scrolled {
    background: transparent;
    padding: 0.5rem 75px 0;
}

.jm-site-header__inner {
    display: flex;
    align-items: center;
    max-width: 89.5rem;
    margin: 0 auto;
    padding: 0 1.5rem;
    height: 64px;
    gap: 2rem;
    background: #ffffff;
    border-radius: 0.875rem;
    transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.jm-site-header.scrolled .jm-site-header__inner {
    box-shadow: 0 8px 32px rgba(0, 19, 106, 0.12);
}

/* Logo */
.jm-site-header__logo {
    margin: 0;
    padding: 0;
    flex-shrink: 0;
    font-size: inherit;
    font-weight: inherit;
    line-height: 1;
}

.jm-site-header__logo-link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.jm-site-header__logo-img {
    height: 36px;
    width: auto;
    display: block;
}

.jm-site-header__brand {
    font-family: "Onest", sans-serif;
    font-weight: 800;
    font-size: 1.25rem;
    color: #14171d;
    letter-spacing: -0.02em;
    line-height: 1;
}

/* Desktop nav */
.jm-site-header__nav {
    display: flex;
    align-items: center;
    flex: 1;
    justify-content: center;
}

/* Gray pill container — wraps all nav links */
.jm-site-header__nav-pill {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    border-radius: 999px;
    padding: 0.3rem;
}

.jm-site-header__nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.875rem;
    font-family: "Onest", sans-serif;
    font-size: 0.875rem;
    font-weight: 600;
    color: #464d4d;
    text-decoration: none;
    border-radius: 999px;
    white-space: nowrap;
    transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1),
                background 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.jm-site-header__nav-link svg {
    flex-shrink: 0;
    opacity: 0.6;
    transition: opacity 0.15s ease;
}

.jm-site-header__nav-link:hover {
    color: #14171d;
    background: #ffffff;
}

.jm-site-header__nav-link:hover svg {
    opacity: 1;
}

.jm-site-header__nav-link--active {
    color: #56af40;
    background: #ffffff;
}

.jm-site-header__nav-link--active svg {
    opacity: 1;
    color: #56af40;
}

.jm-site-header__nav-link--active:hover {
    color: #348e23;
    background: #ffffff;
}

/* Language dropdown in nav */
.jm-site-header__lang-dropdown .dropdown-toggle::after {
    margin-left: 0.2rem;
}

/* Right-side actions */
.jm-site-header__actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
    margin-left: auto;
}

/* Login link */
.jm-site-header__login-link {
    font-family: "Onest", sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #464d4d;
    text-decoration: none;
    padding: 0.4rem 0.5rem;
    transition: color 0.15s ease;
}

.jm-site-header__login-link:hover {
    color: #14171d;
}

/* CTA button (green) */
.jm-site-header__cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1.25rem;
    background: #56af40 !important;
    color: #ffffff !important;
    font-family: "Onest", sans-serif;
    font-size: 0.9375rem;
    font-weight: 800;
    border-radius: 0.625rem;
    text-decoration: none;
    border: none;
    transition: background 0.15s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
}

.jm-site-header__cta-btn:hover {
    background: #348e23 !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* User dropdown toggle */
.jm-site-header__user-dropdown {
    position: relative;
}

.jm-site-header__user-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.5rem;
    border-radius: 0.625rem;
    cursor: pointer;
    text-decoration: none;
    color: #14171d;
    transition: background 0.15s ease;
}

.jm-site-header__user-toggle:hover {
    background: #f3f5f7;
    color: #14171d;
}

.jm-site-header__avatar {
    display: inline-block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    background-color: #e0f0db;
    flex-shrink: 0;
}

.jm-site-header__user-name {
    font-family: "Onest", sans-serif;
    font-size: 0.875rem;
    font-weight: 700;
    color: #14171d;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Mobile toggle button — hidden on desktop, shown on mobile via media query */
.jm-site-header__mobile-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: none;
    border: 1.5px solid rgba(20, 23, 29, 0.15);
    border-radius: 0.5rem;
    color: #14171d;
    cursor: pointer;
    margin-left: auto;
    flex-shrink: 0;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.jm-site-header__mobile-toggle:hover {
    background: #f3f5f7;
    border-color: rgba(20, 23, 29, 0.25);
}

/* Mobile nav — hidden by default, shown when Bootstrap adds .show */
.jm-site-header__mobile-nav {
    display: none;
    border-top: 1px solid rgba(20, 23, 29, 0.08);
    background: #ffffff;
}

.jm-site-header__mobile-nav.show {
    display: block;
}

.jm-site-header__mobile-inner {
    max-width: 89.5rem;
    margin: 0 auto;
    padding: 1rem 1.25rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.jm-site-header__mobile-link {
    display: block;
    padding: 0.6rem 0.75rem;
    font-family: "Onest", sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #464d4d;
    text-decoration: none;
    border-radius: 0.5rem;
    transition: color 0.15s ease, background 0.15s ease;
}

.jm-site-header__mobile-link:hover {
    color: #14171d;
    background: #f3f5f7;
}

.jm-site-header__mobile-cta {
    margin-top: 0.5rem;
    text-align: center;
    justify-content: center;
    padding: 0.65rem 1.25rem;
}

/* Responsive: shrink padding on mid screens */
@media screen and (max-width: 1200px) {
    .jm-site-header {
        padding: 0.75rem 40px 0;
    }
    .jm-site-header__inner {
        padding: 0 1.25rem;
    }
}

@media screen and (max-width: 767px) {
    .jm-site-header {
        padding: 0.5rem 12px 0;
    }
    .jm-site-header__inner {
        padding: 0 1rem;
        height: 58px;
        gap: 0.75rem;
        border-radius: 0.75rem;
    }

    /* Hide desktop nav and actions on mobile */
    .jm-site-header__nav {
        display: none !important;
    }

    .jm-site-header__actions {
        display: none !important;
    }

    /* Show mobile toggle on mobile */
    .jm-site-header__mobile-toggle {
        display: flex;
    }
}

/* ============================================
   HERO HOVER FLOAT IMAGE (happn-style effect)
   ============================================ */

.jm-hover-word {
    display: inline;
    cursor: default;
    text-decoration: underline;
    text-decoration-color: rgba(86, 175, 64, 0.35);
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
    transition: text-decoration-color 0.2s ease;
}

.jm-hover-word:hover {
    text-decoration-color: #56af40;
}

.jm-hover-float {
    position: fixed;
    pointer-events: none;
    z-index: 9999;
    width: 200px;
    height: 260px;
    border-radius: 1.25rem;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22);
    opacity: 0;
    transform: scale(0.82) rotate(0deg);
    transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform, opacity, left, top;
}

.jm-hover-float--visible {
    opacity: 1;
    transform: scale(1) rotate(var(--tilt, 0deg));
}

.jm-hover-float img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* =====================================================
   Reviews section — jm-task-reviews
   ===================================================== */
.jm-task-reviews {
    padding: 5rem 0;
}

.jm-task-reviews-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
    margin-top: 3rem;
}

.jm-task-review-card {
    background: #ffffff;
    border-radius: 1.25rem;
    padding: 2rem;
    box-shadow: 0 10px 20px rgba(0, 19, 106, 0.05);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    transition: box-shadow 0.15s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.jm-task-review-card:hover {
    box-shadow: 0 20px 60px rgba(0, 19, 106, 0.1);
    transform: translateY(-2px);
}

.jm-task-review-stars {
    display: flex;
    gap: 0.15rem;
}

.jm-task-review-text {
    color: #464d4d;
    font-size: 0.97rem;
    line-height: 1.72;
    font-weight: 600;
    margin: 0;
    flex: 1;
}

.jm-task-review-author {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.jm-task-review-avatar {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    font-weight: 800;
    flex-shrink: 0;
}

.jm-review-color-green  { background: #e0f0db; color: #348e23; }
.jm-review-color-blue   { background: #dde9ff; color: #2d67ff; }
.jm-review-color-violet { background: #ede8ff; color: #7c3aed; }
.jm-review-color-yellow { background: #fff3cc; color: #b45309; }

.jm-task-review-author strong {
    display: block;
    color: #14171d;
    font-size: 0.93rem;
    font-weight: 700;
    line-height: 1.3;
}

.jm-task-review-author small {
    color: #728477;
    font-size: 0.83rem;
    font-weight: 600;
}

@media (max-width: 991px) {
    .jm-task-reviews-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .jm-task-reviews-grid {
        grid-template-columns: 1fr;
    }
}

/* =====================================================
   Landing footer — jm-landing-footer
   ===================================================== */
.jm-landing-footer {
    background: #14171d;
    color: #a0aab4;
    font-family: "Onest", sans-serif;
    margin-top: 0;
}

.jm-landing-footer__inner {
    max-width: 89.5rem;
    margin: 0 auto;
    padding: 4rem 75px;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 2fr);
    gap: 4rem;
    align-items: start;
}

.jm-landing-footer__logo {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    margin-bottom: 1rem;
}

.jm-landing-footer__logo-img {
    height: 2rem;
    width: auto;
    filter: brightness(0) invert(1);
}

.jm-landing-footer__logo-name {
    font-size: 1.25rem;
    font-weight: 800;
    color: #ffffff;
    letter-spacing: -0.02em;
}

.jm-landing-footer__tagline {
    font-size: 0.92rem;
    line-height: 1.65;
    font-weight: 600;
    color: #728477;
    margin: 0.75rem 0 1.5rem;
    max-width: 28ch;
}

.jm-landing-footer__socials {
    display: flex;
    gap: 0.75rem;
}

.jm-landing-footer__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.625rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: background 0.15s, border-color 0.15s;
}

.jm-landing-footer__social-link:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.16);
}

.jm-landing-footer__nav {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.jm-landing-footer__col-title {
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #ffffff;
    margin: 0 0 1.1rem;
}

.jm-landing-footer__col-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.jm-landing-footer__col-list a {
    color: #728477;
    font-size: 0.93rem;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.15s;
}

.jm-landing-footer__col-list a:hover {
    color: #56af40;
}

.jm-landing-footer__bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.jm-landing-footer__bottom .jm-landing-footer__inner {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    grid-template-columns: 1fr;
    gap: 0;
}

.jm-landing-footer__bottom span {
    font-size: 0.88rem;
    font-weight: 600;
    color: #728477;
}

.jm-landing-footer__bottom a {
    color: #a0aab4;
    text-decoration: none;
    transition: color 0.15s;
}

.jm-landing-footer__bottom a:hover {
    color: #56af40;
}

@media (max-width: 991px) {
    .jm-landing-footer__inner {
        grid-template-columns: 1fr;
        gap: 2.5rem;
        padding: 3rem 40px;
    }

    .jm-landing-footer__tagline {
        max-width: none;
    }

    .jm-landing-footer__nav {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .jm-landing-footer__inner {
        padding: 2.5rem 20px;
    }

    .jm-landing-footer__nav {
        grid-template-columns: 1fr 1fr;
    }
}

/* ── Hero stat cards ── */
.jm-hero-stat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 0.875rem;
}

.jm-hero-stat-card {
    background: #ffffff;
    border-radius: 1.25rem;
    padding: 1.25rem 1.25rem;
    box-shadow: 0 10px 30px rgba(0, 19, 106, 0.07);
    display: flex;
    align-items: center;
    gap: 0.875rem;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.jm-hero-stat-card:hover {
    box-shadow: 0 20px 60px rgba(0, 19, 106, 0.12);
    transform: translateY(-2px);
}

.jm-hero-stat-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.jm-hero-stat-body {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    flex: 1;
    min-width: 0;
}

.jm-hero-stat-body strong {
    font-size: 1rem;
    font-weight: 700;
    color: #14171d;
    line-height: 1.2;
}

.jm-hero-stat-body small {
    font-size: 0.75rem;
    color: #728477;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.jm-hero-stat-pill {
    background: #e0f0db;
    color: #348e23;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.2rem 0.5rem;
    border-radius: 999px;
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .jm-hero-stat-grid {
        max-width: 100%;
    }
}

/* =====================================================
   MOBILE ADAPTIVE — comprehensive overrides
   ===================================================== */

/* Tablet: 768–991px */
@media (max-width: 991px) {

    /* Hero */
    .jm-task-hero {
        padding: 0.875rem 0.875rem 0;
    }
    .jm-task-hero-block {
        border-radius: 1.25rem;
        padding-bottom: 2.5rem;
    }
    .jm-task-hero-grid {
        gap: 2.5rem;
        padding-top: 2.5rem;
    }
    .jm-hero-stat-grid {
        grid-template-columns: 1fr 1fr;
        max-width: 480px;
        margin: 0 auto;
    }

    /* Sections padding */
    .jm-task-logos,
    .jm-task-difference,
    .jm-task-dashboard-showcase,
    .jm-task-workflow,
    .jm-task-integrations,
    .jm-task-reviews,
    .jm-task-faq,
    .jm-task-final-cta {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    /* FAQ */
    .jm-task-faq-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    .jm-task-faq-copy {
        text-align: center;
    }

    /* Final CTA */
    .jm-task-final-card {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 2.5rem 2rem;
    }
    .jm-task-final-actions {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.75rem;
        width: 100%;
    }
    .jm-task-final-card .jm-task-btn-dark,
    .jm-task-btn-outline {
        width: 100%;
        max-width: 280px;
    }
}

/* Mobile: ≤767px */
@media (max-width: 767px) {

    /* Hero */
    .jm-task-hero {
        padding: 0.625rem 0.625rem 0;
    }
    .jm-task-hero-block {
        border-radius: 1rem;
        padding-bottom: 2rem;
    }
    .jm-task-hero-grid {
        gap: 2rem;
        padding-top: 2rem;
    }
    .jm-task-hero-deco {
        display: none;
    }
    .jm-task-hero-copy {
        padding: 0 0.5rem;
    }
    .jm-task-hero-copy h1 {
        font-size: clamp(1.85rem, 8vw, 2.5rem);
        letter-spacing: -0.025em;
    }
    .jm-task-hero-copy p {
        font-size: 0.95rem;
    }
    .jm-task-kicker {
        font-size: 0.78rem;
    }

    /* Hero form */
    .jm-task-hero-actions {
        max-width: 100%;
        padding: 0 0.5rem;
    }
    .jm-task-input-shell {
        flex-direction: column;
        align-items: stretch;
        padding: 0.75rem;
        gap: 0.625rem;
        border-radius: 1rem;
    }
    .jm-task-input-shell input {
        text-align: center;
        padding: 0.4rem 0.75rem;
    }
    .jm-task-btn-primary {
        width: 100%;
    }

    /* Hero stat cards */
    .jm-hero-stat-grid {
        grid-template-columns: 1fr;
        gap: 0.625rem;
        padding: 0 0.5rem;
        max-width: 100%;
    }
    .jm-hero-stat-card {
        padding: 1rem;
        gap: 0.625rem;
        border-radius: 1rem;
    }
    .jm-hero-stat-icon {
        width: 2rem;
        height: 2rem;
        border-radius: 0.625rem;
        flex-shrink: 0;
    }
    .jm-hero-stat-icon svg {
        width: 16px;
        height: 16px;
    }
    .jm-hero-stat-body strong {
        font-size: 0.9rem;
    }
    .jm-hero-stat-body small {
        font-size: 0.7rem;
    }
    .jm-hero-stat-pill {
        display: none;
    }

    /* Section headers */
    .jm-task-section-head h2,
    .jm-task-faq-copy h2 {
        font-size: clamp(1.5rem, 6vw, 2rem);
    }

    /* Reviews */
    .jm-task-reviews-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .jm-task-review-card {
        padding: 1.5rem;
    }

    /* FAQ */
    .jm-task-faq-grid {
        grid-template-columns: 1fr;
    }
    .jm-task-faq-btn {
        padding: 1.1rem 1.25rem;
        font-size: 0.93rem;
    }
    .jm-task-faq-body p {
        padding: 0 1.25rem 1.25rem;
        font-size: 0.9rem;
    }

    /* Final CTA */
    .jm-task-final-card {
        padding: 2rem 1.5rem;
        border-radius: 1.25rem;
    }

    /* Container padding */
    .jm-home-task .container-xl {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* Small mobile: ≤480px */
@media (max-width: 480px) {

    .jm-task-hero-copy h1 {
        font-size: clamp(1.65rem, 7.5vw, 2rem);
    }

    .jm-hero-stat-card {
        padding: 0.875rem 0.75rem;
        gap: 0.5rem;
    }

    .jm-task-final-card {
        padding: 1.75rem 1.25rem;
    }

    .jm-landing-footer__nav {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .jm-landing-footer__inner {
        padding: 2rem 1.25rem;
    }
}