/*==================================================
  LAPTOP
==================================================*/

@media (max-width: 1199px) {

    .desktop-nav {
        gap: 20px;
    }

    .hero-content h1 {
        font-size: 52px;
    }
}

/*==================================================
  TABLET
==================================================*/

@media (max-width: 991px) {

    .desktop-nav,
    .header-cta {
        display: none;
    }

    .menu-toggle {
        display: flex;
    }

    .hero-section {
        padding: 110px 0 54px;
    }

    .hero-content {
        max-width: 650px;
    }

    .hero-content h1 {
        max-width: 620px;
    }

    .application-card {
        margin-top: 6px;
    }

    .trust-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .trust-item:nth-child(2) {
        border-right: none;
    }

    .trust-item:nth-child(-n+2) {
        border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    }
}

/*==================================================
  MOBILE
==================================================*/

@media (max-width: 575px) {

    .header-inner {
        min-height: 70px;
    }

    .brand-logo img {
        height: 46px;
    }

    .mobile-menu {
        top: 70px;
    }

    .hero-section {
        padding: 96px 0 44px;
    }

    .hero-grid-pattern {
        opacity: 0.2;
    }

    .hero-content h1 {
        font-size: 39px;
        letter-spacing: -1.3px;
    }

    .hero-content>p {
        font-size: 14px;
    }

    .hero-actions {
        flex-direction: column;
        align-items: flex-start;
    }

    .primary-button {
        width: 100%;
    }

    .application-card-header {
        padding: 20px;

        flex-direction: column;
    }

    .application-card h2 {
        font-size: 24px;
    }

    .secure-badge {
        align-self: flex-start;
    }

    .application-divider {
        padding: 0 20px;
    }

    .client-form-wrapper {
        padding: 18px;
    }

    .application-card-footer {
        padding: 15px 18px;

        grid-template-columns: 1fr;
    }

    .trust-grid {
        grid-template-columns: 1fr;
    }

    .trust-item {
        min-height: auto;

        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    }

    .trust-item:last-child {
        border-bottom: none;
    }
}

/*==================================================
  PROCESS RESPONSIVE
==================================================*/

@media (max-width: 1199px) {

    .process-flow {
        grid-template-columns: repeat(2, 1fr);

        gap: 20px;
    }

    .process-line {
        display: none;
    }

    .process-step {
        min-height: 290px;
    }
}

@media (max-width: 991px) {

    .process-section {
        padding: 76px 0;
    }

    .process-heading {
        grid-template-columns: 1fr;

        gap: 18px;

        margin-bottom: 40px;
    }

    .process-heading>p {
        max-width: 650px;
    }
}

@media (max-width: 575px) {

    .process-section {
        padding: 62px 0;
    }

    .process-heading h2 {
        font-size: 32px;
        letter-spacing: -0.8px;
    }

    .process-heading>p {
        font-size: 13px;
    }

    .process-flow {
        grid-template-columns: 1fr;
    }

    .process-step {
        min-height: auto;

        padding: 20px 20px 72px;
    }

    .process-step-top {
        margin-bottom: 22px;
    }

    .process-icon {
        width: 48px;
        height: 48px;

        font-size: 20px;
    }

    .process-status {
        left: 20px;
        bottom: 20px;
    }

    .process-note {
        grid-template-columns: auto 1fr;

        align-items: start;
    }

    .process-note a {
        grid-column: 1 / -1;

        padding-left: 53px;
    }
}

/*==================================================
  LOAN OPTIONS RESPONSIVE
==================================================*/

@media (max-width: 1199px) {

    .options-layout {
        gap: 42px;
    }

    .options-interface {
        grid-template-columns: 1fr;
    }

    .options-tabs {
        border-right: none;
        border-bottom: 1px solid var(--border);
    }

    .option-detail {
        min-height: 460px;
    }
}

@media (max-width: 991px) {

    .options-section {
        padding: 76px 0;
    }

    .options-layout {
        grid-template-columns: 1fr;
    }

    .options-intro {
        position: static;
    }

    .options-intro h2,
    .options-intro>p {
        max-width: 680px;
    }
}

@media (max-width: 575px) {

    .options-section {
        padding: 62px 0;
    }

    .options-intro h2 {
        font-size: 32px;
        letter-spacing: -0.8px;
    }

    .options-interface {
        border-radius: 16px;
    }

    .options-tabs {
        padding: 9px;
    }

    .option-tab {
        padding: 13px 11px;
    }

    .option-tab-icon {
        width: 38px;
        height: 38px;

        font-size: 17px;
    }

    .option-detail {
        min-height: auto;

        padding: 28px 22px;
    }

    .option-detail h3 {
        font-size: 25px;
    }

    .option-detail-button {
        width: 100%;
    }

    .option-detail-note {
        margin-top: 28px;
    }
}

/*==================================================
  WHY CHOOSE US RESPONSIVE
==================================================*/

@media (max-width: 991px) {

    .why-section {
        padding: 76px 0;
    }

    .why-heading {
        grid-template-columns: 1fr;

        gap: 18px;

        margin-bottom: 38px;
    }

    .why-heading>p {
        max-width: 680px;
    }

    .why-feature-card {
        grid-template-columns: 1fr;
    }

    .why-side-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: none;
    }
}

@media (max-width: 767px) {

    .why-side-grid {
        grid-template-columns: 1fr;
    }

    .why-bottom-bar {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 575px) {

    .why-section {
        padding: 62px 0;
    }

    .why-heading h2 {
        font-size: 32px;
        letter-spacing: -0.8px;
    }

    .why-feature-content {
        padding: 28px 22px;
    }

    .why-feature-content h3 {
        font-size: 24px;
    }

    .why-feature-visual {
        padding: 20px;
    }

    .why-side-card {
        min-height: auto;

        padding: 24px 21px;
    }

    .why-bottom-bar {
        padding: 16px;
    }
}

/*==================================================
  SECURITY RESPONSIVE
==================================================*/

@media (max-width: 991px) {

    .security-section {
        padding: 76px 0;
    }

    .security-layout {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .security-content h2,
    .security-content>p {
        max-width: 680px;
    }
}

@media (max-width: 575px) {

    .security-section {
        padding: 62px 0;
    }

    .security-content h2 {
        font-size: 32px;
        letter-spacing: -0.8px;
    }

    .security-list-item {
        padding: 15px;
    }

    .security-button {
        width: 100%;
    }

    .security-panel {
        border-radius: 18px;
    }

    .security-panel-top {
        padding: 23px 21px;
    }

    .security-panel-top h3 {
        font-size: 23px;
    }

    .security-panel-icon {
        width: 46px;
        height: 46px;

        flex-basis: 46px;

        font-size: 20px;
    }

    .security-panel-body {
        padding: 8px 21px;
    }

    .security-row {
        align-items: flex-start;
        flex-direction: column;

        gap: 6px;
    }

    .security-row strong {
        max-width: 100%;

        text-align: left;
    }

    .security-panel-note {
        margin: 5px 21px 23px;
    }
}

/*==================================================
  FAQ RESPONSIVE
==================================================*/

@media (max-width: 991px) {

    .faq-section {
        padding: 76px 0;
    }

    .faq-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .faq-intro {
        position: static;
    }

    .faq-intro h2,
    .faq-intro>p {
        max-width: 680px;
    }
}

@media (max-width: 575px) {

    .faq-section {
        padding: 62px 0;
    }

    .faq-intro h2 {
        font-size: 32px;
        letter-spacing: -0.8px;
    }

    .faq-cta {
        width: 100%;
    }

    .faq-question {
        padding: 20px 0;
        font-size: 15px;
    }

    .faq-question i {
        width: 31px;
        height: 31px;
        flex-basis: 31px;
    }

    .faq-answer p {
        padding: 0 0 21px;
        font-size: 12px;
    }
}

/*==================================================
  FINAL CTA RESPONSIVE
==================================================*/

@media (max-width: 991px) {

    .final-cta-section {
        padding: 72px 0;
    }

    .final-cta-panel {
        grid-template-columns: 1fr;

        padding: 40px;
    }

    .final-cta-action {
        text-align: left;
    }

    .final-cta-action small {
        margin-left: 0;
    }
}

@media (max-width: 575px) {

    .final-cta-section {
        padding: 58px 0;
    }

    .final-cta-panel {
        padding: 28px 22px;

        border-radius: 18px;
    }

    .final-cta-content h2 {
        font-size: 30px;
        letter-spacing: -0.8px;
    }

    .final-cta-notes {
        flex-direction: column;
        gap: 10px;
    }

    .final-cta-action {
        min-width: 0;
    }

    .final-cta-button {
        width: 100%;
    }
}

/*==================================================
  FOOTER RESPONSIVE
==================================================*/

@media (max-width: 991px) {

    .footer {
        padding: 60px 0 25px;
    }

    .footer-main {
        grid-template-columns: 1fr;

        gap: 48px;
    }

    .footer-brand>p {
        max-width: 620px;
    }

    .footer-navigation {
        max-width: 650px;
    }
}

@media (max-width: 767px) {

    .footer-trust {
        grid-template-columns: 1fr;
    }

    .footer-trust-item {
        min-height: 72px;
    }

    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 575px) {

    .footer {
        padding: 48px 0 22px;
    }

    .footer-logo img {
        height: 56px;
    }

    .footer-navigation {
        grid-template-columns: 1fr;

        gap: 28px;
    }

    .footer-legal {
        padding: 20px 17px;
    }

    .footer-bottom-links {
        flex-wrap: wrap;
    }
}

/*==================================================
  LEGAL MODAL RESPONSIVE
==================================================*/

@media (max-width: 575px) {

    .legal-modal {
        padding: 10px;

        align-items: flex-end;
    }

    .legal-modal-dialog {
        max-height: 94vh;

        border-radius: 18px 18px 0 0;
    }

    .legal-modal-header {
        padding: 19px 18px;
    }

    .legal-modal-header h3 {
        font-size: 23px;
    }

    .legal-modal-close {
        width: 38px;
        height: 38px;

        flex-basis: 38px;
    }

    .legal-modal-body {
        max-height: calc(94vh - 88px);

        padding: 22px 18px 28px;
    }

    .legal-form-button {
        width: 100%;
    }
}