@media only screen and (min-width: 768px) {

    .section {
        padding-block: 60px;
    }

    .text-h,
    .text-p {
        text-align: center;
    }

    .text-h {
        font-size: 32px;
        font-weight: 500;
    }

    .text-p {
        max-width: 600px;
        margin-inline: auto;
    }

    .header .container {
        margin: 0 auto;
    }

    .header .hdr-logo-img {
        height: 30px;
    }

    .header .hdr-nav {
        display: flex;
        justify-content: flex-end;
        background-color:rgba(0,0,0,.7);
    }

    .header .hdr-nav-list {
        background-color: white;
        max-width: 400px;
    }

    .hero .her-con-w-bg {
        height: 500px;
    }

    .hero .her-ggl {
        position: absolute;
        bottom: 0;
        left: 20px;
    }

    .hero .her-rate {
        text-shadow: none;
    }

    .hero .her-rate-sel {
        max-width: 400px;
    }

    .hero .her-rate-sel-txt {
        margin-top: 20px;
    }

    .hero .her-rate-sel-con {
        display: flex;
        align-items: center;
        column-gap: 10px;
    }

    .hero .her-rate-sel-con div.relative {
        flex: 1;
    }

    .hero .her-rate-sel-btn {
        width: auto;
        margin-top: 0;
    }

    .hero .her-list {
        display: flex;
        column-gap: 30px;
        margin-top: 20px;
    }

    .hero .her-list-itm {
        align-items: unset;
        column-gap: 15px;
    }

    .hero .her-list-icon {
        width: 40px;
        height: 40px;
    }

    .hero .her-list-icon .icon {
        width: 25px;
        height: 25px;
    }

    .hero .her-list-con {
        flex: 1;
    }

    .hero-basic .her-con-w-bg {
        height: 400px;
    }

    .hero-basic .her-h2 {
        width: 400px;
    }

    .hero-basic .her-ggl {
        left: unset;
        bottom: 20px;
        right: 20px;
        margin-block: 0;
    }

    .hero-basic .her-list {
        flex-wrap: wrap;
    }

    .hero-basic .her-list-itm {
        width: calc(50% - 15px);
    } 

    .options .container {
        width: 100%;
        margin-inline: 0;
    }

    .options .opt-itm {
        display: flex;
        flex-direction: column;
        min-height: 450px;
        max-height: 450px;
    }

    .options .opt-itm-img-con {
        flex: 1;
        height: 240px;
        transition: .2s ease-in-out;
    }

    .options .opt-itm-p {
        flex: 1;
    }

    .options .opt-itm-p,
    .options .opt-itm-link-txt,
    .options .opt-itm-link-icon {
        max-height: 0px;
        overflow: hidden;
        transition: max-height .2s ease-in-out;
    }

    .options .opt-itm-link {
        border-color: var(--grey-4);
    }

    .options .opt-itm.is-active .opt-itm-img-con {
        flex: unset;
    }

    .options .opt-itm.is-active .opt-itm-p,
    .options .opt-itm.is-active .opt-itm-link-txt,
    .options .opt-itm.is-active .opt-itm-link-icon {
        max-height: 1000px;
    }

    .options .opt-itm.is-active .opt-itm-link {
        border-color: var(--theme-color-2);
    }

    .options .arrow {
        position: absolute;
        top: calc(50% - 20px);
        z-index: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        background-color: var(--blue-4);
        border: none;
        border-radius: 100%;
    }

    .options .arrow svg {
        width: 15px;
        height: 15px;
    }

    .options .arrow svg * {
        fill: var(--blue-2);
    }

    .options .arrow.prev {
        left: 15px;
        transform: rotate(180deg);
    }

    .options .arrow.next {
        right: 15px;
    }

    .options .opt-cta {
        flex-wrap: nowrap;
    }

    .options .opt-cta-txt {
        width: auto;
    }

    .testimonial .tes-block {
        display: flex;
        max-width: 800px;
    }

    .testimonial .tes-con {
        flex: 1;
        padding: 0 20px 0 0;
        margin: 0 20px 0 0;
        border-bottom: none;
        border-right: 1px solid var(--grey-2);
    }

    .testimonial .tes-cta {
        width: 200px;
    }

    .why .why-con {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
    }

    .why .why-itm {
        width: calc(50% - 10px);
        margin-bottom: 0;
    }

    .why .why-btns {
        display: flex;
        justify-content: center;
        column-gap: 10px;
        margin-top: 30px;
    }

    .why .why-btn {
        width: auto;
    }

    .hardwork .container {
        padding: 30px 40px;
    }

    .hardwork .text-h,
    .hardwork .text-p {
        text-align: left;
        margin-inline: 0;
    }

    .calculator .calc-quote {
        max-width: 500px;
        margin-inline: auto;
    }

    .calculator .calc-swt {
        display: flex;
    }

    .calculator .calc-swt-opt {
        padding-block: 15px;
    }

    .calculator .calc-lts {
        gap: 10px;
    }

    .calculator .calc-lt {
        width: calc((100% / 6) - (50px / 6));
    }

    .calculator .calc-tabs {
        max-width: 930px; /* 960 - ( 15 padding left, 15 padding right) */
    }

    .calculator .calc-res-btns {
        display: flex;
        column-gap: 10px;
    }

    .lenders .lend-con {
        gap: 20px;
    }

    .lenders .lend-itm {
        width: calc((100% / 4) - 15px);
    }

    .news .text-h,
    .news .text-p {
        text-align: left;
    }

    .news .text-p {
        margin-inline: 0;
    }

    .faqs .faqs-con {
        max-width: 800px;
        margin-inline: auto;
    }

    .form {
        gap: 15px 20px;
    }

    .form .form-field-1-2 {
        width: calc(50% - 10px);
    }

    .form .form-btns {
        display: flex;
        align-items: center;
        column-gap: 10px;
    }

    .form .form-btn {
        flex: 1;
        min-width: 240px;
        margin-bottom: 0;
    }

    .form .form-note {
        text-align: left;
    }
}

@media only screen and (min-width: 960px) {

    .container {
        width: 930px;
        max-width: 100%;
        margin-inline: auto;
    }

    .header .container {
        padding: 15px 0;
    }

    .hero-basic .her-list-itm {
        width: calc((100% / 3) - 20px);
    }

    .hardwork .container {
        display: flex;
        align-items: center;
    }

    .hardwork .hdwk-tel {
        margin-bottom: 0;
    }

    .hardwork .hdwk-btns {
        flex: 1;
    }

    .hardwork .hdwk-btn {
        margin-top: 0;
    }

    .hardwork .hdwk-btn:first-child {
        margin-bottom: 10px;
    }

    .calculator .container {
        padding-inline: 15px;
    }

    .calculator .calc-tabs-slider {
        max-width: 1900px; /* (930 * 2) + 40 */
    }

    .calculator .calc-tabs-slider.active {
        margin-left: -960px; /* full width incl. paddings */
    }

    .calculator .calc-tab {
        width: 930px; /* full width excl. paddings */
        display: flex;
        align-items: flex-start;
    }

    .calculator .calc-inps {
        width: 50%;
    }

    .calculator .calc-res {
        width: 50%;
        margin-top: 0;
        padding-inline: 40px;
    }

    .calculator .calc-res-btns {
        flex-direction: column;
    }

    .news .news-con {
        width: calc(930px + ((100vw - 930px) / 2));
        padding-inline: 0;
        margin-left: calc((100vw - 930px) / 2);
    }

    .news .news-img {
        height: 180px;
    }

    .quick-quote .container {
        display: flex;
        column-gap: 40px;
    }

    .quick-quote .qq-con {
        width: 360px;
    }

    .quick-quote .qq-con .text-h,
    .quick-quote .qq-con .text-p {
        text-align: left;
    }

    .quick-quote .form {
        flex: 1;
        margin-top: 0;
    }

    .footer .ftr-nav-itm:last-child {
        border-bottom: 1px solid var(--grey-2);
    }
}