@media (min-width: 769px) {
    .nav, .nav:not(.sticky) {
        background: rgba(255, 255, 255, .98);
        border-bottom: 1px solid rgba(237, 50, 55, .1);
        box-shadow: 0 8px 28px rgba(66, 25, 30, .06);
    }
    .nav:not(.sticky) .nav-links, .nav:not(.sticky) .btn-nav {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }
    .hero { background-color: #fff5f6; }

    .hero > .container {
        width: 100%;
        max-width: none;
        padding-right: clamp(32px, 3vw, 58px);
        padding-left: clamp(82px, 6.8vw, 130px);
    }

    .hero-left {
        width: min(50%, 860px);
        max-width: 860px;
        margin-left: 0;
    }

    .hero-benefits {
        gap: 10px;
    }

    .benefit-item {
        min-height: 168px;
        padding: 10px 8px;
    }
    .hero::after {
        background: linear-gradient(90deg, #fff5f6 0%, rgba(255,245,246,.98) 35%, rgba(255,248,249,.78) 51%, rgba(255,255,255,0) 73%);
    }
    .hero-trust {
        right: clamp(58px, 5vw, 96px);
        bottom: -14px;
        width: min(620px, 36%);
        min-height: 96px;
        padding: 14px 12px;
        border-radius: 8px;
        background: rgba(255,255,255,.96);
    }
    .hero-trust > div {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        min-width: 0;
        padding: 0 12px;
        color: #292326;
        font-size: .78rem;
        line-height: 1.42;
        text-align: left;
    }
    .hero-trust > div + div { border-left: 1px solid rgba(237,50,55,.18); }
    .hero-trust i { flex: 0 0 auto; color: #ed3237; font-size: 2rem; }
    .hero-trust strong { display: block; font-size: .82rem; line-height: 1.35; }

    .hero > .container > .hero-more {
        position: absolute;
        left: clamp(82px, 6.8vw, 130px);
        bottom: -58px;
        margin: 0;
    }

    .hero .free-badge {
        right: clamp(28px, 3vw, 58px);
        max-width: calc(100vw - 56px);
    }
}

@media (min-width: 769px) and (max-width: 1100px) {
    .hero-trust { right: 24px; width: 46%; padding-inline: 8px; }
    .hero-trust > div { gap: 10px; padding-inline: 10px; font-size: .72rem; }
    .hero-trust i { font-size: 1.75rem; }
}

@media (max-width: 768px) {
    .nav {
        width: 100%;
        max-width: 100vw;
        overflow: hidden;
    }

    .nav-toggle {
        display: flex !important;
        align-items: center;
        justify-content: center;
        flex: 0 0 42px;
        width: 42px;
        height: 42px;
        margin-left: auto;
    }

    .hero .free-badge {
        top: 8px;
        right: 8px;
        width: 156px;
        max-width: calc(100vw - 16px);
        padding: 9px 11px;
        gap: 8px;
        transform: none;
    }

    .hero .free-badge i { font-size: 1.6rem; }
    .hero .free-badge strong { font-size: 1rem; }

    .hero {
        min-height: 0;
        padding: 94px 0 18px;
        background-color: #fff5f6;
        background-size: auto 58%;
        background-position: 68% 45%;
        background-repeat: no-repeat;
    }

    .hero::after {
        background: linear-gradient(180deg, rgba(255,247,248,.99) 0%, rgba(255,247,248,.94) 27%, rgba(255,255,255,.1) 43%, rgba(255,255,255,.06) 65%, rgba(255,247,248,.92) 77%, #fff5f6 100%);
    }

    .hero > .container,
    .hero .container {
        width: 100%;
        min-height: 0;
        padding: 0 16px;
    }

    .hero-inner,
    .hero-left {
        display: block;
        width: 100%;
        min-height: 0;
    }

    .eyebrow {
        max-width: calc(100% - 160px);
        margin: 0 0 12px;
        font-size: .76rem;
    }

    .hero-title {
        max-width: 72%;
        margin: 0 0 10px;
        font-size: clamp(2rem, 8.7vw, 2.65rem);
        line-height: 1.03;
    }

    .hero-sub {
        max-width: 62%;
        margin: 0;
        font-size: .72rem;
        line-height: 1.5;
    }

    .hero-benefits {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 5px;
        margin: 245px 0 8px;
    }

    .benefit-item {
        min-height: 126px;
        padding: 9px 3px;
        border-radius: 7px;
    }

    .benefit-item i { width: 34px; height: 34px; font-size: 1.15rem; }
    .benefit-item strong { min-height: 30px; font-size: .52rem; line-height: 1.22; }
    .benefit-item .value { font-size: 1.25rem; }
    .benefit-item .stars { font-size: .66rem; letter-spacing: 0; white-space: nowrap; }
    .benefit-item small { font-size: .46rem; }

    .hero-cta {
        display: block;
        margin: 0 0 8px;
    }

    .hero-cta > .btn { display: none; }

    .hero-cta .membership-badge {
        display: flex;
        width: 100%;
        min-height: 42px;
        margin: 0;
        padding: 8px 10px;
        justify-content: center;
        border: 0;
        border-radius: 6px;
        background: #ed3237;
        color: #fff;
        font-size: .72rem;
    }

    .hero-trust {
        position: relative;
        right: auto;
        bottom: auto;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
        min-height: 78px;
        margin: 0 0 8px;
        padding: 8px 4px;
        border-radius: 7px;
    }

    .hero-trust > div {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        min-width: 0;
        padding: 0 5px;
        font-size: .52rem;
        line-height: 1.25;
        text-align: left;
    }

    .hero-trust > div + div { border-left: 1px solid rgba(237,50,55,.18); }
    .hero-trust i { flex: 0 0 auto; color: #ed3237; font-size: 1.35rem; }
    .hero-trust strong { font-size: .54rem; line-height: 1.25; }

    .hero-more {
        position: static;
        min-height: 28px;
        margin: 0;
        justify-content: center;
        gap: 6px;
        font-size: .62rem;
    }

    .hero-more > a { padding: 5px 12px; font-size: .66rem; }
}

@media (max-width: 380px) {
    .hero { background-size: auto 55%; }
    .hero-title { max-width: 76%; font-size: 1.9rem; }
    .hero-sub { max-width: 68%; }
    .hero-benefits { margin-top: 225px; }
    .benefit-item { min-height: 120px; }
}