* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* --- CSS VARIABLES & RESET --- */
:root {

    --ink: #233358;
    --paper: #ffffff;
    --bg: #eef1f4;
    --gold: #b88e2f;
    --line: #e2e6ec;
    --muted: #000;
    background: var(--paper);
    color: var(--ink);
    line-height: 1.6;
    overflow-x: hidden;
    --primary-blue: #233358;
    --dark-text: #000;
    --light-text: #555555;
    --accent-gold: #b88e2f;
    --bg-light: #F4F5F7;
    --white: #FFFFFF;
    --border-color: #DDDDDD;
    --heloc-navy: #233358;
    --heloc-dark: #233358;
    --heloc-gold: #b88e2f;
    --heloc-gold-light: #E8D5A3;
    --heloc-gold-glow: rgba(201, 162, 75, .15);
    --heloc-light: #F7F8FA;
    --heloc-border: #E2E6EC;
    --heloc-text: #1E2A3A;
    --heloc-muted: #000;
    --heloc-white: #FFFFFF;
    --heloc-radius: 8px;
    --heloc-radius-lg: 16px;
    --heloc-shadow: 0 4px 20px rgba(27, 42, 74, .06);
    --heloc-shadow-lg: 0 20px 60px rgba(27, 42, 74, .12);
    color: var(--heloc-text);
    background: var(--heloc-white);
    --cc-navy: #233358;
    --cc-navy-deep: #233358;
    --cc-gold: #b88e2f;
    --cc-gold-light: rgba(184, 142, 47, 0.1);
    --cc-light-gray: #F4F5F7;
    --cc-blue-gray: #D8DFE7;
    --cc-white: #FFFFFF;
    --cc-text: #000;
    --cc-text-soft: #000;
    --cc-line: #E6E9EF;
}



@font-face {
    font-family: 'visby-bold';
    src: url('../font/visbycf-bold-webfont.woff2') format('woff2'),
        url('../font/visbycf-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



@font-face {
    font-family: 'visby-extra-bold';
    src: url('../font/visbycf-extrabold-webfont.woff2') format('woff2'),
        url('../font/visbycf-extrabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'visby-heavy';
    src: url('../font/visbycf-heavy-webfont.woff2') format('woff2'),
        url('../font/visbycf-heavy-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'visby-medium';
    src: url('../font/visbycf-medium-webfont.woff2') format('woff2'),
        url('../font/visbycf-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'visby-regular';
    src: url('../font/visbycf-regular-webfont.woff2') format('woff2'),
        url('../font/visbycf-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'gothamblack';
    src: url('../font/gotham_black-webfont.woff2') format('woff2'),
        url('../font/gotham_black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: 'visby-medium';
    color: var(--dark-text);
    line-height: 1.5;
    background-color: var(--white);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    letter-spacing: 0.5px;
    color: #000;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--primary-blue);
    line-height: 1.2;
    text-transform: capitalize;
}

h1,
h2 {
    font-family: 'visby-extra-bold';
}

h3,
h4,
h5,
h6 {
    font-family: 'visby-bold';
}

a {
    text-decoration: none;
    color: inherit;
    transition: 0.3s;
}

ul {
    list-style: none;
}

.btn {
    font-family: 'visby-bold';
    display: inline-block;
}

.container {
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 15px;
}

/* --- HEADER --- */
header {
    background: var(--white);
    padding: 20px 0;
    position: relative;
    z-index: 100;
}

.header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo-area {
    display: flex;
    max-width: 280px;
}

.logo-area img {
    width: 100%;
}

.navbar-nav {
    display: flex;
    align-items: center;
    gap: 30px;
}

.logo-icon {
    font-size: 1.8rem;
    color: var(--primary-blue);
    border: 2px solid var(--primary-blue);
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-family: var(--font-heading);
    line-height: 1;
}

.logo-text {
    font-family: var(--font-heading);
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--primary-blue);
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.logo-text span {
    display: block;
    font-weight: 500;
    font-size: 0.65rem;
}

nav ul {
    display: flex;
    gap: 30px;
}

nav a {
    font-family: 'visby-bold';
    font-size: 14px;
    font-weight: 700;
    color: #01172b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding-bottom: 5px;
}

.navbar-nav nav a.active {
    border-bottom: 2px solid #b88e2f;
}

.navbar-nav .header-menu li a:hover {
    border-bottom: 2px solid #b88e2f;
}

.btn-header {
    background-color: #233358;
    color: var(--white);
    padding: 14px 25px;
    border-radius: 6px;
    font-weight: 600;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: center;
    cursor: pointer;
    border: unset;
}

.btn-header:hover {
    background-color: #b88e2f;
}

.bg-set {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

html,
body {
    overflow-x: hidden !important;
    padding-right: 0px !important;
}

/* --- EXACT HERO SECTION --- */
.hero {
    position: relative;

    padding-top: 90px;

    padding-bottom: 170px;

    background-image: url('../images/header-img.png');

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

}

.hero.about-page-hero {
    background-image: url('../images/image-box.png');
}

.officer-info {
    margin-bottom: 25px;
}

.officer-info p {
    color: #fff;
    font-size: 16px;
}

/* Right-side image wrapper with diagonal cut and gradient fade */

.hero-image-wrapper {

    position: absolute;

    top: 0;

    right: 0;

    width: 65%;

    height: 100%;

    z-index: 1;

    /* Slanted cut on the left side of the image */

    clip-path: polygon(15% 0, 100% 0, 100% 100%, 0% 100%);

    /* Gradient mask to fade the image into the background */

    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 25%);

    mask-image: linear-gradient(to right, transparent 0%, black 25%);

}



.hero-image-wrapper img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    object-position: center right;

}



.hero-content {

    position: relative;

    z-index: 2;

    /* width: 50%; */

    padding-top: 20px;

}



.hero-sub {

    font-family: 'visby-medium';

    font-size: 24px;

    color: var(--dark-text);

    font-weight: 400;

    margin-bottom: 5px;

    text-transform: uppercase;

    letter-spacing: 0.5px;

    line-height: 1;

}



.mortgage-btn {

    margin-top: 30px;

    display: flex;

    align-items: center;

    gap: 25px;

}

.inner-btn {

    margin-top: 30px;

    display: flex;

    align-items: center;

    gap: 25px;

}

.inner-btn .btn-gold:hover {

    background-color: #fff;

    color: #233358;

}

.inner-btn .outline-btn {

    border: unset;

}

.inner-btn .outline-btn:hover {

    background-color: var(--accent-gold);

    color: var(--white);

}

.primary-btn {

    background-color: #233358;

    color: var(--white);

    padding: 12px 30px;

    border-radius: 100px;

    border: 1px solid #233358;

    font-weight: 600;

    font-size: 16px;

}



.primary-btn:hover {

    background-color: #b88e2f;

    color: var(--white);

    border: 1px solid #b88e2f;

}



.outline-btn {

    background-color: #FFF;

    color: #233358;

    padding: 12px 30px;

    border-radius: 100px;

    border: 1px solid #233358;

    font-weight: 600;

    font-size: 16px;

}



.outline-btn:hover {

    background-color: #233358;

    color: #fff;

}



.hero h1 {

    font-size: 66px;

    color: var(--primary-blue);

    margin-bottom: 15px;

    font-weight: bold;

    text-transform: uppercase;

    line-height: 1;

    letter-spacing: 0px;

}



.hero p {

    font-size: 24px;

    color: var(--dark-text);

    font-weight: 400;

    line-height: 1.4;

    max-width: 520px;

}



/* --- EXACT RESOURCES BAR --- */

.resources-wrapper {

    position: relative;

    z-index: 10;

    margin-top: -115px;

    padding-bottom: 60px;

}

.resources-icon {
    width: 100%;
    height: 42px;
    min-width: 42px;
    max-width: 42px;
}

.resources-icon img {

    width: 100%;

}

.resources-bar {

    background-color: #233358;

    color: var(--white);

    padding: 20px 45px 35px;

    border-radius: 12px;

    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);

}



.resources-title {

    font-size: 20px;

    text-transform: uppercase;

    letter-spacing: 1px;

    font-weight: 700;

    display: flex;

    flex-direction: column;

    gap: 6px;

    margin-bottom: 25px;

    font-family: 'visby-extra-bold';

}



/* Underline below "MORTGAGE RESOURCES" */

.resources-title::after {

    content: "";

    display: block;

    width: 80px;

    height: 2px;

    background-color: var(--white);

}



.resources-wrapper .resources-links {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 20px;

}



.resource-item {

    display: flex;

    align-items: center;

    gap: 10px;

    font-size: 1.1rem;

    line-height: 1.2;

    font-family: 'visby-bold';

}



.resource-item i {

    font-size: 2.2rem;

    color: rgba(255, 255, 255, 0.95);

}



/* --- PATH CARDS SECTION --- */

.paths-section {

    padding-bottom: 60px;

    background: var(--white);

}



.paths-section h3 {

    font-family: 'visby-bold';

    font-size: 24px;

    margin-bottom: 15px;

    color: var(--dark-text);

    font-weight: 600;

}



/* .cards-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 25px;

} */



.paths-section .card {
    border: 1px solid #5f666b;
    border-radius: 6px;
    padding: 30px 25px;
    background: #fff;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 0;
}

.paths-section .cards-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.paths-section .slick-dots li {

    margin: 0 0px;

}



.paths-section .slick-dots li button:before {

    font-size: 12px;

}



.paths-section .slick-dots li.slick-active button:before {

    opacity: .75;

    color: #233358;

}



.paths-section .slick-dots li button:before {

    opacity: unset;

    color: #dbdfe4;

}



.card:hover {

    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);

    border-color: var(--primary-blue);

}



.card-icon-box {

    background-color: var(--primary-blue);

    width: 70px;

    height: 70px;

    border-radius: 8px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 15px;

}



.card-icon-box img {

    width: 60%;

    object-fit: contain;

}



.card-icon-box i {

    color: var(--white);

    font-size: 1.8rem;

}



.paths-section .card h4 {

    font-family: var(--font-heading);

    font-size: 16px;

    text-transform: uppercase;

    margin-bottom: 12px;

    color: #233358;

    font-weight: 700;

    letter-spacing: 0.5px;

}



.paths-section .card p {

    font-size: 16px;

    color: #000;

    margin-bottom: 30px;

    line-height: 1.3;

    flex-grow: 1;

}



.read-more {

    font-size: 16px;

    font-weight: 700;

    color: var(--accent-gold);

    display: flex;

    align-items: center;

    gap: 5px;

}





/* --- FEATURE SECTION (Phil) --- */

.feature-section {
    background-color: #EBEBEB;
    padding: 0;
    background-attachment: fixed;
    overflow: hidden;
    position: relative;
    background-image: url('../images/smart.png');
}



.feature-section .feature-inner {

    display: flex;

    align-items: center;

    justify-content: space-between;

}



.feature-section .feature-area img {

    width: 43%;

    height: auto;

    object-fit: cover;

    object-position: top;

    position: absolute;

    right: 0;

    bottom: 0;

}



.feature-section .feature-text {

    flex: 1;

    padding: 100px 0;

    max-width: 720px;

    padding-left: 60px;

}



.feature-section .feature-text h2 {

    font-size: 36px;

    color: var(--primary-blue);

    margin-bottom: 25px;

    line-height: 1.05;

}



.feature-section .feature-text p {

    color: #233358;

    margin-bottom: 35px;

    font-size: 20px;

    line-height: 1.4;

}



.btn-gold {

    background-color: var(--accent-gold);

    color: var(--white);

    padding: 12px 30px;

    border-radius: 100px;

    font-weight: 600;

    font-size: 16px;

}

.btn-gold:hover {

    background-color: #233358;

}



.btn-white {

    background-color: #fff;

    color: #233358;

    padding: 12px 30px;

    border-radius: 100px;

    font-weight: 600;

    font-size: 16px;

}

.btn-white:hover {

    background-color: var(--accent-gold);

    color: var(--white);

}

.feature-image-area {

    flex: 1;

    align-self: flex-end;

    display: flex;

    justify-content: flex-end;

    position: relative;

}



.feature-image-area img {

    position: absolute;

    bottom: 0;

    width: 380px;

    height: 420px;

    object-fit: cover;

    object-position: top;

    left: 45%;

    transform: translateX(-55%);

}



.feature-caption {

    position: absolute;

    bottom: 40px;

    right: 0px;

    color: #000;

    max-width: 180px;

    line-height: 1.4;

    text-align: left;

}



.feature-section .feature-caption h5 {

    font-size: 18px;

    color: #000;

}



.feature-section .feature-caption p {

    font-size: 16px;

}



/* --- TESTIMONIAL SECTION --- */

.testimonial-section {
    background-attachment: fixed;
    position: relative;

    padding: 50px 20px;

    background-image: url('../images/testimonial1.png');

}





/* =================================

           SLIDER WRAPPER

        ================================= */



.testimonial-container {

    position: relative;



    width: 100%;

    max-width: 1050px;



    margin: 0 auto;



    z-index: 5;

}





.testimonial-slider {

    width: 100%;

}





/* =================================

           TESTIMONIAL ITEM

        ================================= */



.testimonial-slide {

    padding: 0 0px;

    outline: none;

}



.testimonial-card {

    position: relative;

    width: 100%;

    padding: 30px 90px 25px 30px;

    background: rgb(255 255 255 / 74%);

    /* border: 1px solid rgb(255 255 255 / 38%); */

    border-radius: 25px;

    /* box-shadow: 0 15px 40px rgba(0, 0, 0, 0.10); */

    backdrop-filter: blur(10px);

    -webkit-backdrop-filter: blur(10px);

}



/* =================================

           TITLE

        ================================= */

.testimonial-title {

    margin-bottom: 0px;

    color: #233358;

    font-size: 30px;

    line-height: 1.05;

    font-family: 'visby-extra-bold';

}



/* =================================

           TEXT

        ================================= */



.testimonial-text {

    max-width: 700px;

    margin-bottom: 15px;

    color: #000;

    font-size: 16px;

    line-height: 1.3;

    padding-left: 80px;

    font-family: 'visby-medium';

}



.testimonial-quote-icon {

    width: 100%;

    max-width: 60px;

    min-width: 60px;

}



.testimonial-quote-icon img {

    width: 100%;

}



.testimonial-wrap {

    display: flex;

    align-items: center;

    gap: 15px;

    margin-bottom: 13px;

}



.testimonial-quote-icon i {

    font-size: 80px;

    color: #233358;

}



.testimonial-text strong {

    color: #000;

    margin-top: 20px;

    display: block;

    font-family: 'visby-bold';

}





/* =================================

           BOTTOM AREA

        ================================= */



.testimonial-bottom {

    display: flex;



    align-items: center;



    justify-content: flex-end;



    gap: 28px;

}





/* =================================

           STARS

        ================================= */



.testimonial-stars {

    display: flex;

    align-items: center;

    gap: 3px;

    color: #ffce38;

    font-size: 18px;

}



.testimonial-stars span {

    color: #ffc82e;



    font-size: 29px;



    line-height: 1;

}



.testimonial-author {

    color: #000;

    font-size: 20px;

    line-height: 1;

    font-weight: 400;

}





/* =================================

           SLICK ARROWS

        ================================= */



.testimonial-slider .slick-prev,

.testimonial-slider .slick-next {

    position: absolute;



    top: 50%;



    width: 45px;

    height: 70px;



    transform: translateY(-50%);



    z-index: 10;



    border: 0;



    background: transparent;



    font-size: 0;



    cursor: pointer;

}





.testimonial-slider .slick-prev {

    left: -60px;

}



.testimonial-slider .slick-next {

    right: -60px;

}





/* Remove default Slick arrows */



.testimonial-slider .slick-prev:before,

.testimonial-slider .slick-next:before {

    display: none;

}





/* =================================

           CUSTOM ARROW

        ================================= */



.testimonial-slider .slick-prev:after {

    content: "";



    position: absolute;



    top: 50%;

    left: 8px;



    transform: translateY(-50%);



    width: 0;

    height: 0;



    border-top: 34px solid transparent;

    border-bottom: 34px solid transparent;



    border-right: 27px solid #ffffff;

}





.testimonial-slider .slick-next:after {

    content: "";



    position: absolute;



    top: 50%;

    right: 8px;



    transform: translateY(-50%);



    width: 0;

    height: 0;



    border-top: 34px solid transparent;

    border-bottom: 34px solid transparent;



    border-left: 27px solid #ffffff;

}





/* =================================

           SLICK DOTS

        ================================= */



.testimonial-slider .slick-dots {

    bottom: -35px;

}



.testimonial-slider .slick-dots li button:before {

    color: #ffffff;

    opacity: 0.6;

}



.testimonial-slider .slick-dots li.slick-active button:before {

    color: #ffffff;

    opacity: 1;

}





/* =================================

           TABLET

        ================================= */



/* --- CTA SECTION --- */

.cta-section {

    padding: 50px 0 70px;

    text-align: center;

    position: relative;

}



.hero-v-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #e6e8e9;
    clip-path: polygon(0 0,

            100% 0,

            100% 72%,

            50% 100%,

            0 72%);
}



.cta-section h2 {

    font-size: 32px;

    color: var(--primary-blue);

    margin-bottom: 15px;

}

.cta-section .container {
    position: relative;
}



.cta-section p {
    color: #000;
    font-size: 18px;
    max-width: 800px;
    margin: 0 auto 35px;
}



.cta-section .cta-buttons {

    display: flex;

    justify-content: center;

    gap: 60px;

}



.cta-section .btn-cta {

    background-color: var(--white);

    color: #233358;

    padding: 8px 10px 8px 40px;

    border-radius: 30px;

    font-weight: 600;

    font-size: 16px;

    display: flex;

    align-items: center;

    gap: 20px;

    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);

}



.cta-section .btn-cta i {

    background: var(--primary-blue);

    color: var(--white);

    border-radius: 50%;

    width: 35px;

    height: 35px;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 16px;

}



.btn-cta:hover {

    background-color: var(--primary-blue);

    color: var(--white);

}



.btn-cta:hover i {

    background: var(--white);

    color: var(--primary-blue);

}



/* --- FORM SECTION --- */

.form-section {

    padding: 50px 0;

    background: var(--white);

}



.form-section .lead-form {

    max-width: 1000px;

    margin: 0 auto;

}



.form-section .form-header {

    margin-bottom: 40px;

}



.form-section .form-header h2 {

    font-size: 32px;

    color: var(--primary-blue);

    margin-bottom: 15px;

    font-family: 'visby-heavy';

}



.form-section .form-header p {

    color: #000;

    font-size: 18px;

}



.form-section .form-row {

    margin-bottom: 25px;

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 20px;

    grid-template-columns: 2fr 1.6fr;

}



.form-section .form-group {

    flex: 1;

}



.form-section .form-group label {

    display: block;

    font-size: 14px;

    font-weight: 700;

    text-transform: uppercase;

    color: #000;

    margin-bottom: 8px;

    letter-spacing: 0.5px;

}



.form-section input.number {

    width: 75%;

}



.form-section input,

.form-section textarea {

    width: 100%;

    padding: 15px;

    border: 1px solid #6d6e71;

    border-radius: 10px;

    font-size: 1rem;

    color: #6d6e71;

    background: #fff;

    letter-spacing: 0.5px;

}



.form-section input::placeholder {

    text-transform: uppercase;

    font-size: 0.9rem;

    color: #666;

}



.form-section input:focus,

.form-section textarea:focus {

    outline: none;

    border-color: var(--primary-blue);

    box-shadow: 0 0 0 2px rgba(75, 111, 129, 0.1);

}



.form-section textarea {

    height: 150px;

    resize: vertical;

}



.form-section .submit-container {

    text-align: center;

    margin-top: 30px;

}


.form-section .submit-btn {
    background-color: #233358;
    color: var(--white);
    border: none;
    padding: 15px 80px;
    border-radius: 30px;
    font-size: 18px;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: 0.3s;
    width: fit-content;
}



.form-section .submit-btn:hover {

    background-color: #b88e2f;

}



/* --- FOOTER --- */

.footer-wrap {
    background-color: #fff;
    /* color: var(--white); */
    padding: 50px 0 30px;
    border-top: 1px solid #e2e6ec;
}

.footer-wrap .footer-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 30px;
    margin-bottom: 30px;
    gap: 20px;
}



.footer-wrap .footer-logo .logo-icon {

    border-color: var(--white);

    color: var(--white);

}



.equal-logo {

    width: 25px;

    height: 25px;

}



.footer-wrap .equal-logo img {

    width: 100%;

}



.footer-wrap .equal-logo {

    width: 100%;

    height: auto;

    max-width: 60px;

    min-width: 60px;

}



.footer-wrap .footer-logo .logo-text {

    color: var(--white);

}



.footer-wrap .footer-nav {

    display: flex;

    gap: 30px;

    margin-left: auto;

}



.footer-wrap .footer-nav a {

    text-transform: uppercase;

    font-weight: 600;

    font-size: 16px;

    letter-spacing: 1px;

    font-family: var(--font-heading);

}



.footer-wrap .social-icons {

    display: flex;

    gap: 15px;

    justify-content: right;

    margin-top: 10px;

}



.footer-wrap .social-icons a {

    font-size: 22px;

    color: var(--white);

}



.footer-wrap .social-icons a:hover {

    color: var(--accent-gold);

}



.footer-wrap .footer-bottom {

    display: flex;

    justify-content: space-between;

    align-items: flex-start;

    font-size: 0.65rem;

    line-height: 1.5;

    opacity: 0.9;

}



.footer-wrap .legal-text {

    max-width: 100%;

    display: flex;

    gap: 10px;

    align-items: center;

}



.footer-wrap .legal-text i {

    font-size: 1rem;

    margin-top: 2px;

}



.footer-wrap .legal-text p {

    font-size: 13px;

    color: #000;

    line-height: 1.5;

}



.navbar-toggle {

    display: none;



    width: 44px;

    height: 44px;



    padding: 8px;



    border: 0;

    outline: none;



    background: transparent;



    cursor: pointer;



    flex-direction: column;

    justify-content: center;

    align-items: center;



    gap: 5px;

}



.navbar-toggle span {

    display: block;



    width: 27px;

    height: 2px;



    background: #222222;



    transition: 0.3s ease;

}





/* =========================

           Overlay

        ========================= */



.menu-overlay {

    display: none;

}



/* --- RESPONSIVE ADJUSTMENTS --- */







.legacy-section {

    position: relative;

    width: 100%;

    height: 460px;

    overflow: hidden;

    background: #ffffff;

}





/* =========================

           MAIN CONTAINER

        ========================= */



.legacy-container {

    position: relative;

    width: 100%;

    max-width: 1180px;

    height: 100%;

    margin: 0 auto;

}





/* =========================

           GREY DIAGONAL BACKGROUND

        ========================= */



.legacy-diagonal {

    position: absolute;

    top: 30px;

    left: 0;

    width: 100%;

    height: 750px;

    background: #c9d2dc;

    clip-path: polygon(0% 0%,

            100% 58%,

            100% 100%,

            0% 34%);

    z-index: 1;

}



/* .legacy-diagonal {

    position: absolute;

    top: 30px;

    left: 0;

    width: 100%;

    height: 100%;

    background: #c9d2dc;

    clip-path: polygon(

                0% 0%,

                100% 60%,

                100% 100%,

                0% 44%

            );

    z-index: 1;

} */

/* =========================

           LEFT DECORATIVE LINES

        ========================= */


.legacy-lines-left {
    position: absolute;
    left: -260px;
    bottom: 50px;
    height: 210px;
    z-index: 3;
}



.legacy-lines-left span {

    position: absolute;



    left: 0;

    top: 0;



    width: 125px;

    height: 125px;



    border: 2px solid rgba(255, 255, 255, 0.8);

}



.legacy-lines-left span:nth-child(1) {

    transform: translate(0, 0);

}



.legacy-lines-left span:nth-child(2) {

    transform: translate(10px, 10px);

}



.legacy-lines-left span:nth-child(3) {

    transform: translate(20px, 20px);

}



.legacy-lines-left span:nth-child(4) {

    transform: translate(30px, 30px);

}





/* =========================

           RIGHT DECORATIVE LINES

        ========================= */



.legacy-lines-right {

    position: absolute;

    right: 0;

    bottom: 0;

}



.legacy-lines-right img {

    position: absolute;

    right: 0;

    bottom: 0px;

    /* width: 100%; */

    height: 300px;

}





/* =========================

           PEOPLE AREA

        ========================= */



.legacy-people {

    position: absolute;

    left: 0;

    bottom: 0;



    width: 53%;

    height: 100%;



    z-index: 5;

}



/* =========================

           PERSON COMMON

        ========================= */



.legacy-person {

    position: absolute;

}



.legacy-person img {

    display: block;

    width: 100%;

    height: auto;

}





/* =========================

           PHIL

        ========================= */



.legacy-phil {

    position: absolute;

    width: 315px;

    height: 350px;

    top: 0;

    right: 150px;

    /* z-index: 2; */

}







/* Phil Label */



.legacy-phil-label {

    position: absolute;

    top: 40px;

    left: -100px;

    width: 170px;

    text-align: center;

    color: #000;

    line-height: 1.15;

    z-index: 20;

}



.legacy-phil-label strong {
    display: block;
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 4px;
    color: #233358;
}



.legacy-phil-label span {

    display: block;

    font-size: 14px;

    font-weight: 400;

}





/* =========================

           PJ

        ========================= */



.legacy-pj {

    position: absolute;



    width: 350px;

    height: 340px;



    left: 200px;

    bottom: -5px;



    z-index: 5;

}



.legacy-pj-image {

    position: absolute;



    left: 45px;

    bottom: 0;



    width: 305px;

}





/* PJ Label */



.legacy-pj-label {

    position: absolute;



    top: 95px;

    left: -120px;



    width: 190px;



    text-align: center;



    color: #000;



    line-height: 1.15;



    z-index: 20;

}



.legacy-pj-label strong {

    display: block;
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 4px;
    color: #233358;

}



.legacy-pj-label span {
    display: block;
    font-size: 14px;
    font-weight: 400;
}





/* =========================

           RIGHT CONTENT

        ========================= */



.legacy-content {

    position: absolute;



    top: 48px;

    right: 100px;



    width: 50%;



    z-index: 10;

}





/* =========================

           HEADING

        ========================= */



.legacy-title {

    color: #233358;

    font-family: 'visby-bold';

    margin-bottom: 30px;



}



.legacy-title-small {

    display: block;

    font-size: 32px;

}



.legacy-title-bottom {

    display: flex;

    align-items: self-start;

    margin-top: -2px;

}



.legacy-driven {

    font-size: 32px;

    font-weight: 700;

    white-space: nowrap;

}



.legacy-word {

    margin-left: 10px;

    font-size: 70px;

    font-weight: 800;

    line-height: 0.95;

    letter-spacing: -3px;

    white-space: nowrap;

    font-family: 'gothamblack';

}



.legacy-description {

    width: 100%;

    max-width: 450px;

    color: #233358;

    font-size: 16px;

    font-weight: 400;

    line-height: 1.4;

    padding-left: 35px;

}



/*Contact Page*/

.contact-banner {

    background-image: url('../images/contact-bg.jpg');

}



.main-banner {
    padding: 80px 0;
    position: relative;
    z-index: 1;
    /* background-attachment: fixed; */
}



/* .main-banner::before {

    content: "";

    position: absolute;

    inset: 0;

    background: rgb(35 51 88 / 76%);

    z-index: -1;

} */


.main-banner h1 {
    font-size: 50px;
    margin-bottom: 12px;
    color: #233358;
    line-height: 1;
    text-transform: capitalize;
}



.main-banner p {

    font-size: 24px;

    margin-bottom: 0px;

    max-width: 700px;

    font-family: 'visby-medium';

}

.block-pd {

    padding-top: 80px;

    padding-bottom: 80px;

}



.contact-wrapper .contact-grid {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 70px;

}



.contact-wrapper .section-divider {

    border: 1px solid #fff;

    margin: 30px 0;

    width: 80%;

}



.contact-wrapper .contact-form {

    width: 100%;

}



.social-icons-wrapper h4 {

    font-size: 22px;

    color: #fff;

    margin-bottom: 10px;

}



.contact-wrapper .form-row {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 24px;

    margin-bottom: 24px;

}



.contact-wrapper .form-group {

    display: flex;

    flex-direction: column;

}



.contact-wrapper .social-icons a i {
    padding: 10px;
    background: #fff;
    border-radius: 5px;
    color: #233358;
    font-size: 22px;
    transition: all 0.5s ease;
}



.contact-wrapper .social-icons a i:hover {

    background: #b88e2f;

    color: #fff;

}



.contact-wrapper .social-icons {

    display: flex;

    align-items: center;

    gap: 10px;

}



.contact-wrapper .form-group label {

    font-size: 14px;

    font-weight: 600;

    margin-bottom: 8px;

    font-family: 'visby-bold';

    color: #000;

}


.contact-address {
    background: #233358;
    padding: 30px;
    border-radius: 15px;
    white-space: normal;
    word-wrap: anywhere;
}



.contact-wrapper .form-group input,

.contact-wrapper .form-group textarea {

    width: 100%;

    padding: 14px 16px;

    border: 1px solid #ddd;

    border-radius: 6px;

    font-size: 15px;

    outline: none;

    box-sizing: border-box;

}



.contact-wrapper .form-group input:focus,

.contact-wrapper .form-group textarea:focus {

    border-color: #233358;

}



.contact-wrapper .form-group textarea {

    resize: vertical;

}



.contact-wrapper .full-width {

    width: 100%;

    margin-bottom: 24px;

}



.contact-wrapper .form-submit button {

    border: 0;

    border-radius: 6px;

    cursor: pointer;

    background-color: var(--accent-gold);

    color: var(--white);

    padding: 14px 35px;

    font-weight: 600;

    font-size: 16px;

}



.contact-wrapper .form-header {

    margin-bottom: 25px;

}



.contact-wrapper .form-header h2 {

    font-size: 32px;

    margin-bottom: 10px;

}



.contact-wrapper .form-header p {

    font-size: 16px;

    color: #000;

}



.contact-wrapper .contact-right {

    border: 1px solid #233358;

    padding: 30px;

    border-radius: 15px;

    background: #fff;

    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);

    box-shadow: 0 0 15px rgba(0, 0, 0, 0.12);

}



.contact-wrapper .contact-icon {

    display: flex;

    align-items: self-start;

    gap: 15px;

    color: #fff;

}



.contact-wrapper .contact-info a {

    font-family: 'visby-medium';

}



.contact-wrapper .contact-icon i {

    background: #b88e2f;

    padding: 10px;

    border-radius: 5px;

    font-size: 24px;

    color: #fff;

}


.contact-info p {
    max-width: 330px;
}

.contact-info h4 {

    font-size: 18px;

    color: #fff;

    margin-bottom: 4px;

    letter-spacing: 1px;

}



.cta-wrapper {

    background: linear-gradient(120deg, #1f3a4a 0%, #4b7c84 100%);

    background: #e6e8e9;

}



.cta-wrapper .cta-band {

    text-align: center;

}



.cta-wrapper .cta-band h2 {

    font-size: 36px;

    margin-bottom: 20px;

}



.cta-wrapper .cta-band p {

    font-size: 18px;

    color: #000;

    max-width: 720px;

    margin: 0 auto 30px;

}



.cta-wrapper .band-buttons {

    display: flex;

    justify-content: center;

    gap: 40px;

}



.cta-wrapper .btn-cta {
    background-color: #233358;
    color: #fff;
    padding: 8px 10px 8px 40px;
    border-radius: 30px;
    font-weight: 600;
    font-size: 16px;
    display: flex;
    align-items: center;
    gap: 20px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}



.cta-wrapper .btn-cta i {
    background: #ffffff;
    color: #233358;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}



.cta-wrapper .btn-cta:hover {

    background-color: #b88e2f;

    color: var(--white);

}



.cta-wrapper .btn-cta:hover i {

    background: var(--white);

    color: var(--primary-blue);

}



.er {

    font-size: 15px;

    text-transform: uppercase;

    margin-bottom: 20px;

    color: #b88e2f;

    letter-spacing: 1px;

}



.banner-text {

    max-width: 750px;

}



.loan-option-banner h1 {

    margin-bottom: 25px !important;

}



.loan-option-banner {

    background-image: url('../images/mortgage-loan.jpg');

}



.section-heading {

    text-align: center;

    margin-bottom: 50px;

}



.eyebrow {

    color: #b88e2f;

    font-size: 14px;

    letter-spacing: 1.5px;

    display: block;

    margin-bottom: 12px;

    text-transform: uppercase;

    font-family: 'visby-bold';

}



.section-heading h2 {

    font-size: clamp(32px, 4vw, 46px);

    line-height: 1.15;

    margin-bottom: 20px;

}



.loan-options .loan-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 24px;

}



.loan-options .loan-card {

    position: relative;

    border: 1px solid #e5e5e5;

    border-radius: 14px;

    padding: 32px;

    background: #fff;

    transition: .35s ease;

    overflow: hidden;

}



.loan-options .loan-card:hover {

    transform: translateY(-8px);

    box-shadow: 0 18px 45px rgba(25, 42, 81, .12);

    border-color: #c29143;

}



.loan-options .loan-card.featured {

    background: #192a51;

    color: #fff;

}



.popular {

    position: absolute;

    top: 20px;

    right: 20px;

    background: #c29143;

    color: #fff;

    padding: 6px 10px;

    border-radius: 30px;

    font-size: 10px;

    font-weight: 700;

    text-transform: uppercase;

}



.loan-options .loan-icon {

    width: 60px;

    height: 60px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 12px;

    background: #f6f3ed;

    color: #c29143;

    font-size: 24px;

    margin-bottom: 25px;

    border: 1px solid #f6f3ed;

}



.featured .loan-icon {

    background: rgba(255, 255, 255, .12);

}



.loan-options .loan-card h3 {

    /* font-size: 24px; */

    /* margin-bottom: 12px; */

    /* font-family: 'visby-extra-bold'; */

    font-family: var(--font-heading);

    font-size: 20px;

    /* text-transform: uppercase; */

    margin-bottom: 12px;

    color: #233358;

    font-weight: 700;

    letter-spacing: 0.5px;

}



.section-heading p {

    color: #000;

    font-size: 18px;

    font-family: 'visby-medium';

    max-width: 650px;

    margin: 0 auto;

}



.loan-options .loan-card p {

    color: #000;

    font-size: 16px;

    margin-bottom: 22px;

    font-family: 'visby-medium';

}



/* =========================

           FEATURE SECTION

        ========================= */



.why-section {

    background: #f8f8f8;

}



.why-section .why-grid {

    display: grid;

    grid-template-columns: .85fr 1fr;

    align-items: center;

    gap: 80px;

}



.why-section .why-image img {

    width: 100%;

    height: 500px;

    object-fit: cover;

    border-radius: 18px;

}





.why-section .why-content h2 {

    font-size: 45px;

    line-height: 1.15;

    margin-bottom: 20px;

}



.why-section .why-content>p {

    margin-bottom: 30px;

}



.why-section .benefit-list {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 25px;

}



.why-section .benefit {

    display: flex;

    gap: 15px;

}



.why-section .benefit-icon {

    flex: 0 0 45px;

    width: 45px;

    height: 45px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #b88e2f;

    border-radius: 8px;

    color: #fff;

}



.why-section .benefit h4 {

    font-size: 16px;

    margin-bottom: 4px;

}



.why-section .benefit p {

    font-size: 13px;

    font-family: 'visby-medium';

}



/* =========================

           PROCESS

        ========================= */



.process-section .process-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 25px;

}



.process-section .process-card {

    position: relative;

    padding: 25px;

    border-top: 2px solid #b88e2f;

}



.process-section .process-number {

    font-size: 30px;
    padding: 0;

    font-weight: 800;

    color: #233358;

    margin-bottom: 16px;

    font-family: 'visby-extra-bold';

    line-height: 1;
    background-color: transparent;

}



.process-section .process-card h3 {

    font-size: 20px;

    margin-bottom: 10px;

}



.process-section .process-card p {
    color: #000;
    font-size: 15px;
}





/* =========================================================

           INTRO

        ========================================================= */



.intro-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    align-items: center;

    gap: 70px;

}



.intro-image {

    position: relative;

}



.intro-image img {

    width: 100%;

    object-fit: cover;

    border-radius: 10px;

}



.intro-content .section-label,

.section-label {

    display: block;

    color: #c69338;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.3px;

    margin-bottom: 12px;

}



.intro-content h2 {

    font-size: 39px;

    line-height: 1.15;

    font-weight: 800;

    margin-bottom: 20px;

}



.intro-content p {

    line-height: 1.5;

    margin-bottom: 15px;

}



.intro-content .outline-btn {

    margin-top: 10px;

}





/* =========================================================

           CENTER HEADING

        ========================================================= */



.center-heading {

    max-width: 700px;

    margin: 0 auto 55px;

    text-align: center;

}



.center-heading h2 {

    font-size: 39px;

    line-height: 1.15;

    font-weight: 800;

    margin-bottom: 16px;

}



.center-heading p {

    font-size: 12px;

    line-height: 1.7;

}





/* =========================================================

           BENEFITS

        ========================================================= */



.benefits-section {

    background: #f5f6f6;

}



.benefits-section .benefits-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 18px;

}



.benefits-section .benefit-card {

    background: #fff;

    border: 1px solid #e1e3e4;

    padding: 28px 22px;

    border-radius: 7px;

    transition: .3s ease;

}



.benefits-section .benefit-card:hover {

    transform: translateY(-5px);

    box-shadow: 0 15px 30px rgba(0, 0, 0, .07);

}



.benefits-section .benefit-icon {

    width: 50px;

    height: 50px;

    border-radius: 7px;

    background: #b88e2f;

    color: #fff;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 20px;

    font-size: 20px;

}



.benefits-section .benefit-card h3 {

    font-size: 16px;

    margin-bottom: 10px;

}



.benefits-section .benefit-card p {

    font-size: 14px;

    line-height: 1.65;

}





/* =========================================================

           FEATURE STRIP

        ========================================================= */



.feature-strip {

    background: #233358;

    padding: 55px 0;

}

.feature-strip .strip-info h2 {

    font-size: 46px;

    color: #fff;

}

.feature-strip .feature-strip-inner {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

}



.feature-strip .feature-strip span {

    color: #e0b04e;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.3px;

}



.feature-strip .feature-strip h2 {

    color: #fff;

    font-size: 33px;

    line-height: 1.2;

    margin-top: 5px;

}





/* =========================================================

           LOAN OPTIONS

        ========================================================= */



.conventional-financing .option-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 20px;

}



.conventional-financing .option-item {

    display: grid;

    grid-template-columns: 60px 1fr;

    gap: 15px;

    border: 1px solid #e0e0e0;

    padding: 28px;

    border-radius: 8px;

    transition: .3s ease;

}



.conventional-financing .option-item:hover {

    box-shadow: 0 10px 25px rgba(0, 0, 0, .05);

}



.conventional-financing .option-number {

    font-size: 40px;

    font-weight: 800;

    color: #b88e2f;

    font-family: 'visby-extra-bold';

    line-height: 1;

}



.conventional-financing .option-item h3 {

    font-size: 22px;

    line-height: 1.3;

    margin-bottom: 10px;

}

.conventional-financing .option-item p {

    font-size: 14px;

    line-height: 1.65;

    font-family: 'visby-medium';

}



/* =========================================================

           WHO SECTION

        ========================================================= */



.who-section {

    background: #f5f5f5;

}



.who-section .who-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 70px;

    align-items: center;

}



.who-section .who-content h2 {

    font-size: 39px;

    line-height: 1.15;

    font-weight: 800;

    margin-bottom: 20px;

}



.who-section .who-content>p {

    font-size: 16px;

    line-height: 1.5;

    margin-bottom: 25px;

    font-family: 'visby-medium';

}



.who-section .check-list {

    list-style: none;

    margin-bottom: 30px;

}



.who-section .check-list li {

    display: flex;

    align-items: center;

    gap: 12px;

    font-size: 16px;

    margin-bottom: 13px;

    font-family: 'visby-medium';

}



.who-section .check-list i {

    width: 20px;

    height: 20px;

    border-radius: 50%;

    background: #b88e2f;

    color: #fff;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 9px;

}



.who-section .who-image {

    position: relative;

}



.who-section .who-image img {

    width: 100%;

    object-fit: cover;

    border-radius: 10px;

}



.who-section .image-badge {

    position: absolute;

    bottom: 25px;

    left: -25px;

    background: #233358;

    color: #fff;

    padding: 20px 25px;

    display: flex;

    align-items: center;

    gap: 15px;

    border-radius: 12px;

}



.who-section .image-badge strong {

    color: #e1b34d;

    font-size: 32px;

    line-height: 1;

}



.who-section .image-badge span {

    font-size: 12px;

    line-height: 1.5;

}

.conventional-banner {
    background-image: url('https://stage.cuselleration.com/crescenzoteam/wp-content/uploads/2026/09/conventional-loan-bg.png');
}



/* =========================================================

           REQUIREMENTS

        ========================================================= */



.qualification-section .requirements-heading {

    max-width: 700px;

    margin-bottom: 50px;

}



.qualification-section .requirements-heading h2 {

    font-size: 39px;

    line-height: 1.15;

    font-weight: 800;

    margin-bottom: 17px;

}



.qualification-section .requirements-heading p {

    font-size: 16px;

}



.qualification-section .requirements-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 22px;

}



.qualification-section .requirement {

    border-top: 2px solid #c69338;

    padding-top: 24px;

}



.qualification-section .req-icon {

    width: 46px;

    height: 46px;

    border-radius: 6px;

    background: #eef1f2;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 17px;

    color: #233358;

}



.qualification-section .requirement h3 {

    font-size: 18px;

    margin-bottom: 10px;

}



.qualification-section .requirement p {

    font-size: 15px;

    line-height: 1.65;

}





.fha-benefits-section .benefit-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 25px;

}



/* =========================

           FEATURE SPLIT

        ========================= */





.fha-loan-difference .feature-wrapper {

    display: grid;

    grid-template-columns: .9fr 1.1fr;

    align-items: center;

    gap: 80px;

}



.fha-loan-difference .feature-image img {

    width: 100%;

    height: 560px;

    object-fit: cover;

    border-radius: 7px;

}



.fha-loan-difference .feature-content .eyebrow {

    display: block;

    margin-bottom: 15px;

    color: #b88e2f;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;

}



.fha-loan-difference .feature-content h2 {

    margin-bottom: 20px;

    font-size: 46px;

}



.fha-loan-difference .feature-content>p {

    margin-bottom: 30px;

    font-size: 17px;

}



.fha-loan-difference .feature-list {

    display: grid;

    gap: 20px;

}



.fha-loan-difference .feature-list-item {

    display: flex;

    gap: 17px;

}



.fha-loan-difference .check-icon {

    flex-shrink: 0;

    width: 28px;

    height: 28px;

    margin-top: 3px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #b88e2f;

    color: #fff;

    border-radius: 50%;

    font-size: 12px;

}



.fha-loan-difference .feature-list-item h4 {

    margin-bottom: 4px;

    font-size: 17px;

}



.fha-loan-difference .feature-list-item p {

    color: #666;

    font-size: 14px;

}



/* =========================

           WHO SECTION

        ========================= */



.fha-loan-option {

    background: #233358;

    color: #fff;

}



.fha-loan-option .who-wrapper {

    display: grid;

    grid-template-columns: .85fr 1.15fr;

    gap: 80px;

    align-items: center;

}



.fha-loan-option .who-content .eyebrow {

    color: #d8b66b;

}



.fha-loan-option .who-content h2 {

    margin-bottom: 20px;

    font-size: 46px;

    color: #fff;

}



.fha-loan-option .who-list {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 15px;

}



.fha-loan-option .who-item {

    display: flex;

    align-items: center;

    gap: 13px;

    padding: 20px;

    background: rgba(255, 255, 255, .08);

    border: 1px solid rgba(255, 255, 255, .12);

    border-radius: 5px;

}



.fha-loan-option .who-item i {

    color: #d8b66b;

}



/* =========================

           PROCESS

        ========================= */



.closing-process-section .process-grid {

    display: grid;

    grid-template-columns: repeat(5, 1fr);

    gap: 15px;

}



.closing-process-section .process-card {

    position: relative;

    padding: 30px 20px;

    border-top: 2px solid #b88e2f;

}



.closing-process-section .process-number {

    margin-bottom: 20px;

    color: #b88e2f;

    font-size: 14px;

    font-weight: 700;

}



.closing-process-section .process-card h3 {

    margin-bottom: 12px;

    font-size: 19px;

}



.closing-process-section .process-card p {

    color: #666;

    font-size: 14px;

}



.fha-faq-section {

    position: relative;

    background: #f8f8f5;

    overflow: hidden;

}



.fha-faq-section::before {

    content: "";

    position: absolute;

    width: 450px;

    height: 450px;

    border-radius: 50%;

    background: rgba(35, 51, 88, 0.04);

    top: -220px;

    left: -220px;

    pointer-events: none;

}



.fha-faq-section::after {

    content: "";

    position: absolute;

    width: 350px;

    height: 350px;

    border-radius: 50%;

    background: rgba(35, 51, 88, 0.035);

    right: -180px;

    bottom: -180px;

    pointer-events: none;

}

.fha-faq-inner .section-heading {

    text-align: left;

}

.fha-faq-inner {

    position: relative;

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 20px;

    grid-template-columns: 1.5fr 2fr;

}



/* =========================================

           HEADING

        ========================================= */



.fha-faq-heading {

    max-width: 760px;

    margin: 0 auto 55px;

    text-align: center;

}



.fha-faq-eyebrow {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 18px;

    font-size: 13px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;

    color: #233358;

}



.fha-faq-eyebrow::before,

.fha-faq-eyebrow::after {

    content: "";

    width: 28px;

    height: 1px;

    background: #233358;

}



.fha-faq-heading h2 {

    margin: 0;

    font-size: 52px;

    line-height: 1.1;

    font-weight: 700;

    letter-spacing: -1.8px;

    color: #233358;

}



.fha-faq-heading p {

    max-width: 620px;

    margin: 20px auto 0;

    font-size: 16px;

    line-height: 1.7;

    color: #6d7480;

}



/* =========================================

           FAQ LIST

        ========================================= */



.fha-faq-list {

    max-width: 900px;

    margin: 0 auto;

}



.fha-faq-item {

    position: relative;

    margin-bottom: 14px;

    background: #ffffff;

    border: 1px solid #e2e5e9;

    border-radius: 14px;

    overflow: hidden;

    transition:

        border-color 0.3s ease,

        box-shadow 0.3s ease,

        transform 0.3s ease;

}



.fha-faq-item:hover {

    border-color: #c9ced6;

    box-shadow: 0 8px 25px rgba(35, 51, 88, 0.06);

}



.fha-faq-item.active {

    border-color: #233358;

    box-shadow: 0 12px 35px rgba(35, 51, 88, 0.09);

}



/* =========================================

           QUESTION BUTTON

        ========================================= */



.fha-faq-question {

    width: 100%;

    border: 0;

    outline: none;

    background: transparent;

    padding: 25px 28px 15px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    text-align: left;

    cursor: pointer;

}



.fha-faq-question-text {

    flex: 1;

    font-size: 17px;

    line-height: 1.5;

    font-weight: 600;

    color: #233358;

}



/* =========================================

           ICON

        ========================================= */



.fha-faq-icon {

    flex: 0 0 40px;

    width: 40px;

    height: 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #f1f3f6;

    color: #233358;

    font-size: 14px;

    transition:

        transform 0.35s ease,

        background 0.35s ease,

        color 0.35s ease;

}



.fha-faq-item.active .fha-faq-icon {

    transform: rotate(45deg);

    background: #233358;

    color: #ffffff;

}



/* =========================================

           ANSWER

        ========================================= */



.fha-faq-answer {

    display: grid;

    grid-template-rows: 0fr;

    opacity: 0;

    transition:

        grid-template-rows 0.4s ease,

        opacity 0.3s ease;

}



.fha-faq-answer-inner {

    min-height: 0;

    overflow: hidden;

}



.fha-faq-answer-content {

    padding: 0 28px 25px;

    font-size: 15px;

    line-height: 1.75;

    color: #69717d;

}



.fha-faq-item.active .fha-faq-answer {

    grid-template-rows: 1fr;

    opacity: 1;

}



/* =========================================

           CTA

        ========================================= */



.fha-faq-cta {

    max-width: 900px;

    margin: 45px auto 0;

    padding: 30px 35px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    background: #233358;

    border-radius: 16px;

}



.fha-faq-cta-content h3 {

    margin-bottom: 7px;

    font-size: 20px;

    line-height: 1.3;

    font-weight: 600;

    color: #ffffff;

}



.fha-faq-cta-content p {

    margin: 0;

    font-size: 14px;

    line-height: 1.6;

    color: rgba(255, 255, 255, 0.75);

}

.financial-story-section .benefits-grid {

    grid-template-columns: repeat(3, 1fr);

}

.financial-details-section .feature-inner {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 80px;

    align-items: center;

}

.financial-details-section .feature-title h2 {

    font-size: 46px;

    color: #fff;

}

.financial-details-section .feature-content p {

    margin-bottom: 20px;

    font-size: 17px;

    color: #fff;

}

.financial-details-section .feature-content ul {

    list-style: none;

}

.financial-details-section {

    background-color: #233358;

}

.financial-details-section .feature-content ul i {

    width: 20px;

    height: 20px;

    border-radius: 50%;

    background: #b88e2f;

    color: #fff;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 9px;

}

.financial-details-section .feature-content ul li {

    display: flex;

    align-items: center;

    gap: 13px;

    padding: 14px 0;

    border-bottom: 1px solid #ffffff3b;

    font-size: 17px;

    font-family: 'visby-bold';

    color: #fff;

}



.usda-grid {

    display: grid;

    grid-template-columns: .8fr 1.2fr;

    gap: 80px;

    align-items: start;

}

.st {

    font-size: clamp(32px, 4vw, 46px);

    line-height: 1.15;

    margin-bottom: 20px;

}

.usda-right p {

    font-size: 17px;

    margin-bottom: 20px;

}

.highlight {

    background: #233358;

    color: #fff;

    padding: 45px 0;

}

.highlight-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 30px;

}

.highlight-item {

    display: flex;

    align-items: center;

    gap: 18px;

    border-right: 1px solid rgba(255, 255, 255, .18);

}

.highlight-icon {

    width: 50px;

    height: 50px;

    border-radius: 50%;

    background: rgba(255, 255, 255, .1);

    display: flex;

    align-items: center;

    justify-content: center;

    color: #d2ae63;

    font-size: 19px;

}

.about-page-hero {

    padding-top: 90px;

    padding-bottom: 90px;

    overflow: hidden;

}

.story-section .section-heading p {
    max-width: 90%;
    margin: 0 auto 15px;
}

.bio-grid {

    display: grid;

    grid-template-columns: repeat(1, 1fr);

    gap: 40px;

}

.bio-card {
    display: flex;
    gap: 50px;
    align-items: flex-start;
    /* background: var(--bg-light); */
    border-radius: 10px;
    padding: 30px;
    background: linear-gradient(270deg, #5b89b72e 0%, #0a244100 100%);
}

.bio-image {
    flex-shrink: 0;
    width: 40%;
    /* height: 140px; */
    /* border-radius: 50%; */
    overflow: hidden;
    /* background: #dfe4e8; */
}

.bio-info {

    flex: 1;

}

.bio-image img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    object-position: top;

}

.bio-title {

    display: block;

    font-family: var(--font-heading);

    font-size: 15px;

    font-weight: 700;

    color: var(--accent-gold);

    text-transform: uppercase;

    letter-spacing: 0.5px;

    margin-bottom: 12px;

}

.bio-name {

    font-size: 40px;

    color: var(--primary-blue);

    margin-bottom: 4px;

}

.bio-card .bio-text {
    font-size: 20px;
}


.values-section {

    padding: 80px 0;

    background: var(--bg-light);

}



.values-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 25px;

}



.value-card {

    background: #fff;

    border: 1px solid var(--border-color);

    border-radius: 6px;

    padding: 35px 25px;

    text-align: center;

    transition: 0.3s ease;

}



.value-card:hover {

    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);

    border-color: var(--primary-blue);

}



.value-icon {

    width: 65px;

    height: 65px;

    border-radius: 50%;

    background-color: var(--primary-blue);

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto 20px;

}



.value-icon i {

    color: var(--white);

    font-size: 1.6rem;

}



.value-card h4 {

    font-family: var(--font-heading);

    font-size: 18px;

    text-transform: uppercase;

    margin-bottom: 10px;

    letter-spacing: 0.5px;

}



.value-card p {

    font-size: 15px;

    color: var(--light-text);

    line-height: 1.4;

}


/* ---------- Header Nav Base ---------- */




.navbar-nav .header-menu li {

    position: relative;

}



.navbar-nav .header-menu li a {

    display: block;

    text-decoration: none;

    color: #233358;

    font-weight: 500;

    transition: color 0.2s ease;
    border-bottom: 2px solid transparent;
}



.navbar-nav .header-menu li a:hover {

    color: #233358;

}



/* ---------- Dropdown (Submenu) ---------- */

.navbar-nav .header-menu .sub-menu {

    list-style: none;

    margin: 0;

    padding: 8px 0;
    gap: 5px;
    position: absolute;

    top: 100%;

    left: 0;

    min-width: 260px;

    background: #fff;

    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);

    border-radius: 6px;

    opacity: 0;

    visibility: hidden;

    transform: translateY(10px);

    transition: all 0.25s ease;

    z-index: 999;

    display: flex;

    flex-direction: column;

}

.navbar-nav .header-menu .sub-menu li a:hover {
    border-bottom: none;
}

.navbar-nav .header-menu .sub-menu li a {
    border-bottom: none;
}

/* Show dropdown on hover (desktop) */

.navbar-nav .header-menu li:hover>.sub-menu {

    opacity: 1;

    visibility: visible;

    transform: translateY(0);

}



/* Submenu links */

.navbar-nav .header-menu .sub-menu li a {

    padding: 10px 20px;

    font-size: 14px;

    color: #233358;

    white-space: nowrap;

}



.navbar-nav .header-menu .sub-menu li a:hover {

    background: #f5f7fa;

    color: #233358;

}



/* Nested submenu (sub-submenu) opens to the right */

.navbar-nav .header-menu .sub-menu .sub-menu {

    top: 0;

    left: 100%;

    transform: translateX(10px);

}



.navbar-nav .header-menu .sub-menu li:hover>.sub-menu {

    transform: translateX(0);

}



/* Dropdown arrow indicator (auto for any parent item) */

.navbar-nav .header-menu li.menu-item-has-children>a::after {

    content: '\f107';

    font-family: 'Font Awesome 6 Free';

    font-weight: 900;

    margin-left: 8px;

    font-size: 11px;

    display: inline-block;

    transition: transform 0.2s ease;

}



/* Arrow points right for nested submenu items */

.navbar-nav .header-menu .sub-menu li.menu-item-has-children>a::after {

    content: '\f105';

    float: right;

    margin-left: 10px;

}



.wpcf7-not-valid-tip {
    font-size: 13px !important;
}



/* CF7 Response Output (Success/Error) */

.wpcf7-response-output {

    margin: 15px 0 0;

    padding: 12px 15px;

    border-radius: 6px;

    font-size: 14px;

    font-weight: 500;

    display: block;
    text-align: center;

}



/* Success Message (Green) */

.wpcf7 form.sent .wpcf7-response-output {

    color: #155724;

    background-color: #d4edda;

    border: 1px solid #c3e6cb;

}



/* Error Message (Red) */

.wpcf7 form.failed .wpcf7-response-output,

.wpcf7 form.invalid .wpcf7-response-output,

.wpcf7 form.unaccepted .wpcf7-response-output {

    color: #721c24;

    background-color: #f8d7da;

    border: 1px solid #f5c6cb;

}



/* Spam/Aborted */

.wpcf7 form.spam .wpcf7-response-output,

.wpcf7 form.aborted .wpcf7-response-output {

    color: #856404;

    background-color: #fff3cd;

    border: 1px solid #ffeeba;

}



/* Remove default spinner (optional) */

.wpcf7-spinner {

    display: none;

}



fieldset.hidden-fields-container {

    display: none;

}



.screen-reader-response {

    display: none;

}

.rs {
    background: #b88e2f;
}

.rs-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr) auto;
}

.rf {
    padding: 17px 20px;
    border-right: 1px solid rgba(255, 255, 255, .18);
}

.rs h4 {
    font-size: 30px;
    letter-spacing: .15em;
    text-transform: uppercase;
    margin-bottom: 0;
}

.rs p {
    font-size: 18px;
    color: #233358;
    font-family: 'visby-bold';
}

.intro-form-wrapper {
    background: var(--paper);
}

.intro-form-grid {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 70px;
    align-items: start;
}

.section-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 2.5px;
    color: var(--gold);
    margin-bottom: 16px;
    text-transform: uppercase;
}

.section-eyebrow::before {
    content: "";
    width: 28px;
    height: 1px;
    background: var(--gold);
}

.heading-block {
    font-size: clamp(30px, 3.5vw, 42px);
    font-weight: 700;
    line-height: 1.15;
    margin: 0 0 20px;
    letter-spacing: -.5px;
}

.intro-desc {
    color: #6b7280;
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 36px;
    max-width: 540px;
}

/* Timeline style steps */
.steps-list {
    position: relative;
}

.steps-list::before {
    content: "";
    position: absolute;
    left: 19px;
    top: 14px;
    bottom: 14px;
    width: 2px;
    background: linear-gradient(180deg, #c9962e, #e8edf5);
}

.step-item {
    display: flex;
    gap: 24px;
    padding: 0 0 32px;
    position: relative;
}

.step-item:last-child {
    padding-bottom: 0;
}

.step-num {
    font-size: 15px;
    font-weight: 700;
    color: #183a6b;
    background: #ffffff;
    border: 2px solid #c9962e;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    transition: .25s;
}

.step-item:hover .step-num {
    background: #c9962e;
    color: #fff;
}

.step-content h4 {
    margin: 6px 0 8px;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.2px;
}

.step-content p {
    margin: 0;
    color: #6b7280;
    font-size: 14.5px;
    line-height: 1.65;
}

.intro-right {
    position: sticky;
    top: 30px;
}

.preapproval-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    box-shadow: 0 25px 60px -20px rgba(18, 44, 82, .18);
    padding: 0;
    overflow: hidden;
    position: relative;
}

.preapproval-card::before {
    content: "";
    position: absolute;
    top: -60px;
    right: -60px;
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(201, 150, 46, .15), transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.card-head {
    padding: 28px 32px 22px;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(180deg, #f8fafd, #ffffff);
    position: relative;
}

.card-head .tag {
    font-size: 12px;
    letter-spacing: 2px;
    color: #c9962e;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 8px;
    display: block;
}

.preapproval-card h3 {
    color: #183a6b;
    font-size: 24px;
    margin: 0;
    line-height: 1.2;
}

.intro-form-wrapper .card-body {
    padding: 26px 32px 30px;
}

.intro-form-wrapper .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.intro-form-wrapper .form-group {
    margin-bottom: 14px;
}

.intro-form-wrapper .form-group label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .8px;
    color: #8a94a6;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.intro-form-wrapper .form-group input,
.intro-form-wrapper .form-group select {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    background: #f9fafb;
    transition: .2s;
    font-family: inherit;
}

.intro-form-wrapper .form-group input:focus,
.intro-form-wrapper .form-group select:focus {
    outline: none;
    border-color: var(--gold);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(201, 150, 46, .12);
}

.intro-form-wrapper .form-group input::placeholder {
    color: #a3aab8;
}

.intro-form-wrapper .btn-submit {
    width: 100%;
    background: #183a6b;
    color: #fff;
    border: none;
    padding: 16px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 14.5px;
    cursor: pointer;
    margin-top: 8px;
    transition: .25s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    letter-spacing: .3px;
    font-family: inherit;
}

.intro-form-wrapper .form-note {
    text-align: center;
    font-size: 12px;
    color: #9aa1af;
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.intro-form-wrapper .form-note i {
    color: #c9962e;
}

.story-feature.story-feature2 {
    grid-template-columns: 1fr 320px;
}


.story-feature {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 60px;
    align-items: start;
    padding: 44px;
    background: #233358;
    border: 1px solid #e2e6ec;
    border-radius: 24px;
    margin-bottom: 50px;
    position: relative;
    overflow: hidden;
}

.story-feature:last-child {
    margin-bottom: 0;
}

.story-feature::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: #233358;
    opacity: .9;
}

/* --- Feature photo (arch) --- */
.feature-photo {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1.15;
    border-radius: 180px 180px 20px 20px;
    overflow: hidden;
    background: #eef1f4;
    border: 8px solid #ffffff;
    box-shadow: 0 30px 60px -25px rgba(26, 26, 26, .22);
}

.feature-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

.feature-nmls {
    position: absolute;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    background: #233358;
    color: #fff;
    padding: 10px 18px;
    border-radius: 100px;
    font-size: 12px;
    letter-spacing: .5px;
    box-shadow: 0 12px 25px -8px rgba(0, 0, 0, .35);
    display: flex;
    align-items: center;
    font-family: 'visby-bold';
    gap: 8px;
    border: 2px solid #b88e2f;
    white-space: nowrap;
}

.feature-nmls i {
    color: #ffffff;
    font-size: 13px;
}

/* --- Feature content --- */
.feature-content {
    padding-top: 4px;
}

.feature-logo {
    margin-bottom: 22px;
}

.feature-logo img {
    height: 48px;
    width: auto;
    object-fit: contain;
    display: block;
}

.feature-role {
    display: inline-block;
    font-size: 14px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #b88e2f;
    font-weight: 700;
    margin-bottom: 10px;
    font-family: 'visby-bold';
}

.feature-name {
    font-size: clamp(28px, 3vw, 42px);
    font-weight: 800;
    color: #fff;
    margin-bottom: 10px;
    line-height: 1;
    letter-spacing: -.5px;
}

.feature-bio {
    font-size: 15.5px;
    line-height: 1.75;
    margin: 0 0 26px;
    color: #fff;
}

.feature-more {
    max-height: 0;
    overflow: hidden;
    transition: max-height .45s ease, opacity .3s ease;
    opacity: 0;
}

.feature-more.open {
    max-height: 600px;
    opacity: 1;
}

.feature-more p {
    font-size: 15.5px;
    line-height: 1.75;
    margin: 0 0 16px;
    color: #fff;
}

/* --- Read More button --- */
.read-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    padding: 6px 0;
    color: #b88e2f;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    font-family: inherit;
    margin-bottom: 24px;
    transition: .25s;
}

.read-more-btn:hover {
    color: #fff;
}

.read-more-btn i {
    font-size: 11px;
    transition: transform .3s ease;
}

.read-more-btn.open i {
    transform: rotate(180deg);
}

/* --- Feature accordion --- */
.feature-accordion {
    border-top: 1px solid #e2e6ec;
    border-bottom: 1px solid #e2e6ec;
    margin-bottom: 28px;
}

.facc-item {
    border-bottom: 1px solid #e2e6ec;
}

.facc-item:last-child {
    border-bottom: none;
}

.facc-btn {
    width: 100%;
    background: none;
    border: none;
    padding: 18px 0;
    display: flex;
    align-items: center;
    gap: 14px;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
    transition: .25s;
}

.facc-btn:hover .facc-label {
    color: #b88e2f;
}

.facc-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #eef1f4;
    color: #233358;
    display: grid;
    place-items: center;
    font-size: 12px;
    flex-shrink: 0;
    transition: .25s;
}

.facc-item.open .facc-icon {
    background: #233358;
    color: #fff;
}

.facc-label {
    flex: 1;
    font-size: 18px;
    color: #233358;
    transition: .25s;
    font-family: 'visby-bold';
}

.facc-arrow {
    color: #6b7280;
    font-size: 12px;
    transition: transform .3s ease;
}

.facc-item.open .facc-arrow {
    transform: rotate(180deg);
    color: #b88e2f;
}

.facc-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height .35s ease;
}

.facc-panel-inner {
    padding: 0 0 20px 46px;
    font-size: 14.5px;
    line-height: 1.75;
}

.facc-panel-list ul {
    list-style: disc;
    padding-left: 60px;
}

.facc-panel-list ul li {
    padding-bottom: 6px;
    font-family: 'visby-bold';
}

.facc-panel-inner p {
    margin: 0 0 6px;
    font-size: 16px;
}

.facc-panel-inner p:last-child {
    margin-bottom: 0;
}

.facc-panel-inner strong {
    color: #233358;
    padding-right: 3px;
}

.facc-panel-inner a {
    color: #b88e2f;
    text-decoration: none;
    font-weight: 600;
}

.facc-panel-inner a:hover {
    text-decoration: underline;
}

/* --- Feature CTA --- */
.feature-cta {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.feature-cta .btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 30px;
    font-size: 15px;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 100px;
    transition: .25s;
    border: 2px solid transparent;
    cursor: pointer;
}

.feature-cta .btn-dark {
    background: #233358;
    color: #fff;
    border-color: #233358;
}

.feature-cta .btn-dark:hover {
    background: #b88e2f;
    border-color: #b88e2f;
}

.feature-cta .btn-outline {
    background: transparent;
    color: #233358;
    border-color: #233358;
}

.feature-cta .btn-outline:hover {
    background: #233358;
    color: #fff;
}

.story-rs i {
    /* width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f1f3f6;
    font-size: 16px; */
    color: #fff;
}

.icon-rs {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: center;
    color: #fff;
}

.story-rs {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 30px;
    text-align: center;
}

.tm-social-icons {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 14px;
    margin-bottom: 20px;
}

.tm-social-icons a {
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: #233358;
    border-radius: 50%;
    text-decoration: none;
    font-size: 18px;
    transition: all 0.3s ease;
}

.tm-social-icons a:hover {
    background: #b88e2f;
    color: #fff;
}

.apply-bt .btn-gold:hover {
    background-color: #fff;
    color: #233358;
}

.feature-cta .btn-gold:hover {
    background-color: #fff;
    color: #233358;
}


.pc-container {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 28px;
}

/* ============ HERO: light bg, arch photo ============ */
.pc-hero {
    position: relative;
    background: var(--bg);
    padding: 60px 0 70px;
    overflow: hidden;
    border-bottom: 1px solid var(--line);
}

.pc-hero::before {
    content: '';
    position: absolute;
    top: -10%;
    right: -5%;
    width: 420px;
    height: 420px;
    background: radial-gradient(circle, rgba(201, 161, 59, .10) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.pc-hero-inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    align-items: center;
    gap: 60px;
}

/* LEFT: text */
.pc-hero-left {
    padding: 20px 0;
}

.pc-hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 700;
    margin-bottom: 24px;
    border-radius: 40px;
}

.pc-hero-left h1 {
    font-weight: 900;
    font-size: clamp(48px, 6vw, 88px);
    line-height: .98;
    letter-spacing: -2px;
    margin-bottom: 22px;
    color: var(--ink);
}

.pc-hero-left h1 .pc-last {
    color: var(--gold);
    font-weight: 600;
}

.pc-hero-role {
    font-size: 20px;
    color: #233358;
    max-width: 440px;
    margin-bottom: 30px;
    line-height: 1.7;
    font-family: 'visby-bold';
}

.pc-hero-role strong {
    color: var(--ink);
    font-weight: 700;
}

.pc-hero-social {
    display: flex;
    gap: 12px;
    margin-bottom: 34px;
}

.pc-hero-social a {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--paper);
    border: 1px solid var(--line);
    color: var(--ink);
    display: grid;
    place-items: center;
    text-decoration: none;
    font-size: 15px;
    transition: .25s;
}

.pc-hero-social a:hover {
    background: var(--ink);
    border-color: var(--ink);
    color: #fff;
    transform: translateY(-3px);
}

.pc-hero-cta {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

.pc-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 32px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 4px;
    transition: .25s;
    border: 2px solid transparent;
    cursor: pointer;
}

.pc-btn-dark {
    background: var(--ink);
    color: #fff;
    border-color: var(--ink);
}

.pc-btn-dark:hover {
    background: #b88e2f;
    border-color: #b88e2f;
}

.pc-btn-outline {
    background: transparent;
    color: var(--ink);
    border-color: var(--ink);
}

.pc-btn-outline:hover {
    background: var(--ink);
    color: #fff;
}

/* RIGHT: arch photo */
.pc-hero-right {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pc-hero-photo-wrap {
    position: relative;
    width: 100%;
    max-width: 420px;
    aspect-ratio: 1/1.05;
    border-radius: 220px 220px 20px 20px;
    overflow: hidden;
    background: var(--paper);
    border: 10px solid rgba(255, 255, 255, .85);
    box-shadow: 0 30px 60px -25px rgba(0, 0, 0, .18);
}

.pc-hero-photo-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

/* NMLS floating chip */
.pc-nmls-chip {
    position: absolute;
    bottom: 24px;
    left: 10px;
    background: var(--ink);
    color: #fff;
    padding: 14px 22px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .5px;
    box-shadow: 0 15px 30px -10px rgba(0, 0, 0, .25);
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 3;
    border: 2px solid var(--gold);
}

.pc-nmls-chip i {
    font-size: 15px;
    color: var(--gold);
}

/* ============ STATS BAR ============ */
.pc-stats-bar {
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    padding: 30px 0;
}

.pc-stats-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    text-align: center;
}

.pc-stat-item {
    border-right: 1px solid var(--line);
    padding: 6px 10px;
}

.pc-stat-item:last-child {
    border-right: none;
}

.pc-stat-num {
    font-family: 'Fraunces', serif;
    font-size: 32px;
    font-weight: 800;
    color: var(--ink);
    line-height: 1;
    margin-bottom: 6px;
}

.pc-stat-label {
    font-size: 12px;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: #233358;
    font-family: 'visby-bold';
}

/* ============ MAIN: BIO + SIDEBAR ============ */
.pc-main-block {
    padding: 90px 0 70px;
    background: var(--paper);
}

.pc-main-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 70px;
    align-items: start;
}

/* BIO */
.pc-bio-column .pc-section-tag {
    display: inline-block;
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 700;
    margin-bottom: 14px;
}

.pc-bio-column h2 {
    font-size: clamp(32px, 3.5vw, 46px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1px;
    margin-bottom: 30px;
    max-width: 580px;
    color: var(--ink);
}

.pc-bio-column h2 em {
    font-style: normal;
    color: var(--gold);
    font-weight: 600;
}

.pc-bio-body {
    columns: 1;
    column-gap: 40px;
}

.pc-bio-body p {
    font-size: 15.5px;
    line-height: 1.8;
    color: #000;
    margin-bottom: 18px;
    break-inside: avoid;
}

.pc-bio-body a {
    color: var(--ink);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 2px solid var(--gold);
}

.pc-bio-signature {
    margin-top: 30px;
    padding-top: 26px;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.pc-bio-signature .pc-sig-name {
    font-size: 26px;
    font-family: 'visby-bold';
}

/* SIDEBAR */
.pc-sidebar {
    position: sticky;
    top: 30px;
}

.pc-sidebar-title {
    font-size: 15px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #233358;
    font-weight: 700;
    font-family: 'visby-bold';
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
}

.pc-acc-item {
    border-bottom: 1px solid var(--line);
}

.pc-acc-btn {
    width: 100%;
    background: none;
    border: none;
    padding: 22px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
    gap: 16px;
}

.pc-acc-num {
    font-family: 'Fraunces', serif;
    font-size: 20px;
    font-weight: 600;
    color: var(--gold);
    min-width: 24px;
}

.pc-acc-label {
    flex: 1;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.2px;
    color: var(--ink);
    font-family: 'visby-bold';
}

.pc-acc-icon {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid var(--line);
    display: grid;
    place-items: center;
    font-size: 11px;
    color: var(--ink);
    transition: .3s;
    flex-shrink: 0;
    background: var(--paper);
}

.pc-acc-item.pc-open .pc-acc-icon {
    background: var(--ink);
    color: #fff;
    border-color: var(--ink);
    transform: rotate(45deg);
}

.pc-acc-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height .35s ease;
}

.pc-acc-panel-inner {
    padding: 0 0 24px 40px;
    font-size: 14.5px;
    line-height: 1.75;
    font-family: 'visby-bold';
    font-family: 'visby-medium';
}

.acc-list li {
    font-size: 16px;
    color: #233358;
    font-family: 'visby-bold';
}

.acc-list {
    list-style: disc;
}

.pc-acc-panel-inner strong {
    color: var(--ink);
}

/* CTA CARD — light bg, dark button */
.pc-sidebar-cta {
    margin-top: 30px;
    background: var(--bg);
    color: var(--ink);
    padding: 32px 28px;
    border-radius: 14px;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--line);
}

.pc-sidebar-cta::before {
    content: '';
    position: absolute;
    top: -40px;
    right: -40px;
    width: 140px;
    height: 140px;
    background: radial-gradient(circle, rgba(201, 161, 59, .18), transparent 70%);
    border-radius: 50%;
}

.pc-sidebar-cta h4 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 10px;
    position: relative;
    line-height: 1.25;
    color: var(--ink);
}

.pc-sidebar-cta p {
    font-size: 13.5px;
    color: #000;
    margin-bottom: 20px;
    position: relative;
    line-height: 1.6;
}

.pc-sidebar-cta .pc-btn {
    width: 100%;
    justify-content: center;
    position: relative;
    padding: 12px 20px;
    font-size: 15px;
}

/* ============ BADGES STRIP ============ */
.pc-badges-section {
    background: var(--bg);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 44px 0;
    overflow: hidden;
}

.pc-badges-label {
    text-align: center;
    font-size: 20px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #233358;
    font-weight: 700;
    margin-bottom: 28px;
    font-family: 'visby-bold';
}

.pc-badges-track {
    display: flex;
    gap: 70px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.pc-badge {
    filter: grayscale(100%);
    transition: .3s;
    flex-shrink: 0;
}

.pc-badge:hover {
    opacity: 1;
    filter: grayscale(0%);
    transform: scale(1.04);
}

.pc-badge img {
    height: 80px;
    width: auto;
    object-fit: contain;
}

.intro-form-wrapper .intro-ritgh img {
    width: 100%;
    height: 560px;
    object-fit: cover;
    border-radius: 7px;
}

.refi-page {
    color: ##233358;
    background: #ffffff;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

/* ============================================================
       HERO
       ============================================================ */
.refi-page .refi-hero {
    position: relative;
    background: #faf7f2;
    padding: 90px 0 120px;
    overflow: hidden;
}

.refi-page .refi-hero::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 42%;
    height: 100%;
    background: linear-gradient(160deg, #233358 0%, #0a1d31 100%);
    clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%);
    z-index: 1;
}

.refi-page .refi-hero::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 42%;
    height: 100%;
    background: transparent;
    clip-path: polygon(28% 0, 28.6% 0, 0.6% 100%, 0 100%);
    background-color: #b88e2f;
    z-index: 2;
    opacity: .9;
}

.refi-page .hero-inner {
    position: relative;
    z-index: 5;
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 60px;
    align-items: center;
}

.refi-page .hero-eyebrow {
    display: inline-block;
    font-size: 11.5px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #b88e2f;
    font-weight: 700;
    margin-bottom: 26px;
    padding-bottom: 10px;
    border-bottom: 2px solid #b88e2f;
}

.refi-page .hero-title {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(42px, 5.2vw, 68px);
    font-weight: 400;
    line-height: 1.08;
    letter-spacing: -1.2px;
    color: #233358;
    margin-bottom: 26px;
}

.refi-page .hero-title em {
    font-style: italic;
    color: #b88e2f;
    font-weight: 400;
}

.refi-page .hero-desc {
    font-size: 16.5px;
    line-height: 1.75;
    color: #4a5568;
    max-width: 500px;
    margin-bottom: 38px;
}

.refi-page .hero-cta-row {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

.refi-page .btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #b88e2f;
    color: #fff;
    padding: 17px 34px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all .25s;
    font-family: inherit;
}

.refi-page .btn-primary:hover {
    background: #233358;
    transform: translateY(-2px);
    box-shadow: 0 15px 30px -10px rgba(15, 41, 66, .35);
}

.refi-page .btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    color: #233358;
    padding: 17px 34px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    text-decoration: none;
    border: 2px solid #233358;
    cursor: pointer;
    transition: all .25s;
}

.refi-page .btn-ghost:hover {
    background: #233358;
    color: #fff;
}
.reviews-slider {
    max-width: 850px;
    margin: 0 auto;
    padding-bottom: 60px;
    position: relative;
}
.reviews-slider .swiper-pagination {
    position: absolute;
    bottom: 10px !important;
    left: 0;
    width: 100%;
    text-align: center;
}

.reviews-slider .swiper-pagination-bullet-active {
    background: #b98e2e;   /* gold, apne theme se match */
}
.reviews-slider .swiper-slide {
    height: auto;
}

.reviews-slider .quote {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.reviews-slider .review-text {
    font-size: 15px;
    line-height: 1.6;
    max-height: calc(1.6em * 5);   /* 3 lines */
    overflow-y: auto;
    padding-right: 8px;
    margin: 10px 0 15px;
    text-align: left;
}

.reviews-slider .review-text p {
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
}

.reviews-slider .review-text::-webkit-scrollbar {
    width: 4px;
}

.reviews-slider .review-text::-webkit-scrollbar-track {
    background: #eee;
    border-radius: 10px;
}

.reviews-slider .review-text::-webkit-scrollbar-thumb {
    background: #b98e2e;
    border-radius: 10px;
}

.reviews-slider .review-text {
    scrollbar-width: thin;
    scrollbar-color: #b98e2e #eee;
}

.reviews-slider .swiper-button-prev,
.reviews-slider .swiper-button-next {
    display: none !important;
}

.refi-page .hero-number-block {
    position: relative;
    z-index: 6;
    text-align: right;
    padding-left: 40px;
}

.refi-page .hero-number-block .label {
    font-size: 11px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #e8c874;
    font-weight: 700;
    margin-bottom: 14px;
}

.refi-page .hero-number-block .num {
    font-family: Georgia, serif;
    font-size: clamp(60px, 7vw, 96px);
    font-weight: 400;
    line-height: 1;
    color: #fff;
    letter-spacing: -3px;
    margin-bottom: 14px;
}

.refi-page .hero-number-block .num em {
    font-style: italic;
    color: #e8c874;
    font-weight: 400;
}

.refi-page .hero-number-block .caption {
    font-size: 13px;
    line-height: 1.6;
    color: #fff;
    max-width: 280px;
    margin-left: auto;
}

/* ============================================================
       WHY REFINANCE
       ============================================================ */
.refi-page .why-section {
    padding: 100px 0 80px;
    background: #ffffff;
}

.refi-page .why-header {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: end;
    /* margin-bottom: 60px; */
    padding-bottom: 40px;
    border-bottom: 1px solid #e5e7eb;
}

.refi-page .why-header h2 {
    font-size: clamp(32px, 3.8vw, 46px);
    font-weight: 400;
    line-height: 1.1;
    color: #233358;
}

.refi-page .why-header h2 em {
    font-style: normal;
    color: #b88e2f;
}

.refi-page .why-header p {
    font-size: 16px;
    line-height: 1.75;
    color: #000;
}

.refi-page .why-row {
    display: grid;
    grid-template-columns: 80px 1fr 1.2fr;
    gap: 40px;
    align-items: center;
    padding: 34px 0;
    border-bottom: 1px solid #e5e7eb;
    transition: .3s;
    position: relative;
}

.refi-page .why-row:hover {
    padding-left: 20px;
    background: linear-gradient(90deg, rgba(201, 150, 46, .04), transparent);
}

.refi-page .why-row::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 100%;
    background: #b88e2f;
    transform: scaleY(0);
    transform-origin: top;
    transition: transform .3s;
}

.refi-page .why-row:hover::before {
    transform: scaleY(1);
}

.refi-page .why-num {
    font-size: 32px;
    color: #b88e2f;
    line-height: 1;
    font-family: 'visby-bold';
}

.refi-page .why-title {
    font-size: 22px;
    font-weight: 400;
    color: #233358;
    line-height: 1.3;
    font-family: 'visby-bold';
}

.refi-page .why-desc {
    font-size: 16px;
    line-height: 1.7;
    color: #000;
}

/* ============================================================
       OPTIONS
       ============================================================ */
.refi-page .options-dark {
    background: #233358;
    color: #fff;
    padding: 60px 0;
    position: relative;
    overflow: hidden;
}

.refi-page .options-dark::before {
    content: "";
    position: absolute;
    top: -200px;
    right: -200px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(201, 150, 46, .14), transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.refi-page .options-header {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: end;
    /* margin-bottom: 70px; */
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    position: relative;
}

.refi-page .options-header h2 {
    font-size: clamp(32px, 3.8vw, 48px);
    font-weight: 400;
    line-height: 1.1;
    color: #fff;
}

.refi-page .options-header h2 em {
    font-style: italic;
    color: #e8c874;
}

.refi-page .options-header p {
    font-size: 16px;
    line-height: 1.75;
    color: #fff;
}

.refi-page .options-grid-text {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    position: relative;
}

.refi-page .options-grid-text::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 1px;
    height: 100%;
    background: rgba(255, 255, 255, .12);
    transform: translateX(-50%);
}

.refi-page .opt-block {
    padding: 44px 56px;
    position: relative;
}

.refi-page .opt-block:nth-child(odd) {
    padding-left: 0;
}

.refi-page .opt-block:nth-child(even) {
    padding-right: 0;
}

.refi-page .opt-block:nth-child(1),
.refi-page .opt-block:nth-child(2) {
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.refi-page .opt-eyebrow {
    font-size: 12px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #b88e2f;
    font-weight: 700;
    margin-bottom: 16px;
    display: block;
}

.refi-page .opt-title {
    font-size: 26px;
    font-weight: 400;
    line-height: 1.25;
    color: #fff;
    margin-bottom: 14px;
    font-family: 'visby-bold';
}

.refi-page .opt-desc {
    font-size: 14.5px;
    line-height: 1.7;
    color: #a8b5c8;
    max-width: 340px;
}

/* ============================================================
       HOW IT WORKS
       ============================================================ */
.refi-page .how-section {
    padding: 110px 0;
    background: #ffffff;
}

.refi-page .how-header {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: end;
    margin-bottom: 70px;
}

.refi-page .how-header h2 {
    font-family: Georgia, serif;
    font-size: clamp(32px, 3.8vw, 48px);
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: -1px;
    color: #233358;
}

.refi-page .how-header h2 em {
    font-style: italic;
    color: #b88e2f;
}

.refi-page .how-header p {
    font-size: 16px;
    line-height: 1.75;
    color: #000;
}

.refi-page .how-timeline {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    position: relative;
}

.refi-page .how-timeline::before {
    content: "";
    position: absolute;
    top: 22px;
    left: 22px;
    right: 22px;
    height: 1px;
    background: repeating-linear-gradient(90deg, #e5e7eb 0, #e5e7eb 6px, transparent 6px, transparent 12px);
    z-index: 1;
}

.refi-page .how-step {
    position: relative;
    z-index: 2;
}

.refi-page .how-dot {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid #233358;
    display: grid;
    place-items: center;
    font-family: Georgia, serif;
    font-size: 16px;
    font-weight: 700;
    color: #233358;
    margin-bottom: 22px;
    transition: .3s;
}

.refi-page .how-step:hover .how-dot {
    background: #b88e2f;
    border-color: #b88e2f;
    color: #fff;
    transform: scale(1.08);
}

.refi-page .how-title {
    font-family: Georgia, serif;
    font-size: 18px;
    font-weight: 700;
    color: #233358;
    margin-bottom: 10px;
    line-height: 1.3;
}

.refi-page .how-desc {
    font-size: 14px;
    line-height: 1.7;
    color: #000;
}

/* ============================================================
       GOLD BAND
       ============================================================ */
.refi-page .gold-band {
    background: #b88e2f;
    color: #233358;
    padding: 70px 0;
    position: relative;
    overflow: hidden;
}

.refi-page .gold-band::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image:
        linear-gradient(rgba(15, 41, 66, .04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 41, 66, .04) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
}

.refi-page .gold-inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.4fr auto auto;
    gap: 60px;
    align-items: center;
}

.refi-page .gold-copy h3 {
    font-family: Georgia, serif;
    font-size: clamp(24px, 2.8vw, 34px);
    font-weight: 400;
    line-height: 1.2;
    color: #233358;
    margin-bottom: 8px;
    letter-spacing: -.5px;
}

.refi-page .gold-copy p {
    font-size: 14.5px;
    color: #4a3a10;
    line-height: 1.6;
    max-width: 380px;
}

.refi-page .gold-stat {
    border-left: 2px solid rgba(15, 41, 66, .25);
    padding-left: 26px;
}

.refi-page .gold-stat .stat-num {
    font-family: Georgia, serif;
    font-size: clamp(36px, 4vw, 52px);
    font-weight: 400;
    line-height: 1;
    color: #233358;
    letter-spacing: -1.5px;
    margin-bottom: 8px;
}

.refi-page .gold-stat .stat-lbl {
    font-size: 10.5px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #4a3a10;
    font-weight: 700;
}

/* ============================================================
       TESTIMONIAL
       ============================================================ */
.refi-page .testimonial-section {
    padding: 120px 0;
    background: #ffffff;
    text-align: center;
    position: relative;
}

.refi-page .testimonial-section::before {
    content: "";
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 2px;
    background: #b88e2f;
}

.refi-page .testimonial-inner {
    max-width: 820px;
    margin: 0 auto;
    position: relative;
}

.refi-page .testimonial-quote {
    font-family: Georgia, serif;
    font-size: clamp(24px, 2.6vw, 34px);
    font-weight: 400;
    font-style: italic;
    line-height: 1.4;
    color: #233358;
    letter-spacing: -.5px;
    margin-bottom: 32px;
}

.refi-page .testimonial-quote em {
    color: #b88e2f;
    font-style: italic;
}

.refi-page .testimonial-author {
    font-size: 12px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #000;
    font-weight: 700;
}

/* ============================================================
       FINAL NOTE
       ============================================================ */

.refi-page .refi-note {
    padding: 28px 0;
    background: #f5f6f8;
    border-top: 1px solid #e5e7eb;
}

.refi-page .refi-note p {
    max-width: 980px;
    margin: 0 auto;
    color: #000;
    font-size: 12px;
    line-height: 1.7;
    text-align: center;
}


.heloc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 54px;
    padding: 0 32px;
    border-radius: var(--heloc-radius);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .3px;
    text-decoration: none;
    transition: all .3s cubic-bezier(.4, 0, .2, 1);
    position: relative;
    overflow: hidden;
}

.heloc-btn-primary {
    background: linear-gradient(135deg, var(--heloc-gold) 0%, #B8923E 100%);
    color: var(--heloc-white);
    border: none;
    box-shadow: 0 4px 15px rgba(201, 162, 75, .35);
}

.heloc-btn-primary:hover {
    background: linear-gradient(135deg, var(--heloc-navy) 0%, var(--heloc-dark) 100%);
    box-shadow: 0 6px 25px rgba(27, 42, 74, .35);
    transform: translateY(-2px);
}

.heloc-btn-outline {
    background: transparent;
    color: var(--heloc-navy);
    border: 2px solid var(--heloc-navy);
}

.heloc-btn-outline:hover {
    background: var(--heloc-navy);
    color: var(--heloc-white);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(27, 42, 74, .2);
}

/* =========================================================
           HERO — SPLIT DIAGONAL
        ========================================================= */

.heloc-hero {
    position: relative;
    padding: 110px 0 120px;
    background: linear-gradient(165deg, #F7F8FA 0%, #EDF0F5 100%);
    overflow: hidden;
}

.heloc-hero::before {
    content: "";
    position: absolute;
    top: -20%;
    right: -10%;
    width: 65%;
    height: 140%;
    background: linear-gradient(135deg, var(--heloc-navy) 0%, var(--heloc-dark) 100%);
    clip-path: polygon(25% 0, 100% 0, 100% 100%, 0 100%);
    border-radius: 0 0 0 80px;
}

.heloc-hero::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(ellipse at 75% 50%, rgba(201, 162, 75, .08) 0%, transparent 60%);
    pointer-events: none;
}

.heloc-hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr 460px;
    gap: 80px;
    align-items: center;
}

.heloc-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 28px;
    color: var(--heloc-gold);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 3px;
}

.heloc-eyebrow::before {
    content: "";
    width: 40px;
    height: 2px;
    background: linear-gradient(90deg, var(--heloc-gold), transparent);
}

.heloc-hero h1 {
    max-width: 680px;
    margin: 0 0 28px;
    color: var(--heloc-navy);
    font-size: clamp(46px, 5.5vw, 78px);
    line-height: 1.02;
    font-weight: 800;
    letter-spacing: -2.5px;
}

.heloc-hero h1 span {
    color: var(--heloc-gold);
    position: relative;
    display: inline-block;
}

.heloc-hero h1 span::after {
    content: "";
    position: absolute;
    bottom: 4px;
    left: 0;
    width: 100%;
    height: 12px;
    background: var(--heloc-gold-glow);
    z-index: -1;
    border-radius: 4px;
}

.heloc-hero-copy {
    max-width: 580px;
    margin: 0 0 38px;
    color: var(--heloc-muted);
    font-size: 18px;
    line-height: 1.8;
}

.heloc-hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

/* =========================================================
           EQUITY CARD — PREMIUM
        ========================================================= */

.heloc-equity-card {
    position: relative;
    padding: 38px;
    background: var(--heloc-white);
    border-radius: var(--heloc-radius-lg);
    box-shadow: var(--heloc-shadow-lg);
    border: 1px solid rgba(255, 255, 255, .8);
    backdrop-filter: blur(10px);
}

.heloc-equity-card::before {
    content: "";
    position: absolute;
    top: -3px;
    left: 30px;
    right: 30px;
    height: 3px;
    background: linear-gradient(90deg, var(--heloc-gold), var(--heloc-gold-light), var(--heloc-gold));
    border-radius: 3px;
}

.heloc-equity-card::after {
    content: "";
    position: absolute;
    width: 70px;
    height: 70px;
    right: -12px;
    bottom: -12px;
    background: linear-gradient(135deg, var(--heloc-gold), #B8923E);
    border-radius: var(--heloc-radius);
    z-index: -1;
    opacity: .6;
}

.heloc-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 24px;
    margin-bottom: 28px;
    border-bottom: 1px solid var(--heloc-border);
}

.heloc-card-label {
    color: var(--heloc-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.heloc-card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: linear-gradient(135deg, #FBF4E4, #F2E8D2);
    color: var(--heloc-gold);
    font-size: 20px;
    font-weight: 800;
    box-shadow: 0 2px 10px rgba(201, 162, 75, .2);
}

.heloc-card-title {
    margin-bottom: 10px;
    color: var(--heloc-navy);
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -.5px;
}

.heloc-card-text {
    margin-bottom: 28px;
    color: var(--heloc-muted);
    font-size: 14px;
    line-height: 1.75;
}

.heloc-equity-bar {
    height: 14px;
    margin-bottom: 12px;
    background: #EDF0F5;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}

.heloc-equity-bar span {
    display: block;
    width: 68%;
    height: 100%;
    background: linear-gradient(90deg, var(--heloc-gold), #D4B56A, var(--heloc-gold));
    border-radius: 20px;
    position: relative;
    animation: helocBarGrow 1.5s ease-out forwards;
}

@keyframes helocBarGrow {
    from {
        width: 0;
    }

    to {
        width: 68%;
    }
}

.heloc-bar-labels {
    display: flex;
    justify-content: space-between;
    color: var(--heloc-muted);
    font-size: 11px;
    font-weight: 600;
}

.heloc-card-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 30px;
}

.heloc-mini-box {
    padding: 18px;
    background: linear-gradient(135deg, #F7F8FA, #EDF0F5);
    border: 1px solid var(--heloc-border);
    border-radius: var(--heloc-radius);
    transition: all .3s ease;
}

.heloc-mini-box:hover {
    border-color: var(--heloc-gold);
    box-shadow: 0 4px 15px rgba(201, 162, 75, .15);
    transform: translateY(-2px);
}

.heloc-mini-box small {
    display: block;
    margin-bottom: 6px;
    color: var(--heloc-muted);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.heloc-mini-box strong {
    color: var(--heloc-navy);
    font-size: 16px;
    font-weight: 800;
}

/* =========================================================
           INTRO
        ========================================================= */

.heloc-intro {
    position: relative;
}

.heloc-intro::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--heloc-border), transparent);
}

.heloc-intro-grid {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 100px;
    align-items: start;
}

.heloc-section-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    color: var(--heloc-gold);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2.5px;
}

.heloc-section-label::before {
    content: "";
    width: 24px;
    height: 2px;
    background: var(--heloc-gold);
    border-radius: 2px;
}

.heloc-intro h2,
.heloc-section-heading h2 {
    margin: 0;
    color: var(--heloc-navy);
    font-size: clamp(36px, 4.5vw, 56px);
    line-height: 1.1;
    letter-spacing: -1.5px;
    font-weight: 800;
}

.heloc-intro-content p {
    margin: 0 0 22px;
    color: var(--heloc-muted);
    font-size: 17px;
    line-height: 1.85;
}

.heloc-intro-content p:last-child {
    margin-bottom: 0;
}

/* =========================================================
           USE CASES — DARK SECTION
        ========================================================= */

.heloc-uses {
    background: linear-gradient(135deg, var(--heloc-navy) 0%, var(--heloc-dark) 100%);
    position: relative;
    overflow: hidden;
}

.heloc-uses::before {
    content: "";
    position: absolute;
    top: -50%;
    right: -20%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(201, 162, 75, .1) 0%, transparent 70%);
    border-radius: 50%;
}

.heloc-section-heading.center {
    max-width: 720px;
    margin: 0 auto 60px;
    text-align: center;
}

.heloc-section-heading.center .heloc-section-label {
    justify-content: center;
}

.heloc-section-heading.center .heloc-section-label::before {
    display: none;
}

.heloc-section-heading.center h2 {
    color: var(--heloc-white);
}

.heloc-section-heading.center .heloc-section-label {
    color: var(--heloc-gold-light);
}

.heloc-use-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.heloc-use-card {
    position: relative;
    min-height: 280px;
    padding: 32px 28px;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: var(--heloc-radius-lg);
    transition: all .4s cubic-bezier(.4, 0, .2, 1);
    overflow: hidden;
    backdrop-filter: blur(10px);
}

.heloc-use-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, var(--heloc-gold), var(--heloc-gold-light));
    opacity: 0;
    transition: opacity .4s ease;
}

.heloc-use-card:hover {
    background: rgba(255, 255, 255, .12);
    border-color: rgba(201, 162, 75, .3);
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .3);
}

.heloc-use-card:hover::before {
    opacity: 1;
}

.heloc-use-number {
    display: inline-block;
    margin-bottom: 40px;
    padding: 6px 14px;
    background: rgba(201, 162, 75, .15);
    border: 1px solid rgba(201, 162, 75, .3);
    border-radius: 20px;
    color: #b88e2f;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.heloc-use-card h3 {
    margin: 0 0 14px;
    color: var(--heloc-white);
    font-size: 20px;
    /* font-weight: 700; */
    /* letter-spacing: -.3px; */
}

.heloc-why-visual img {
    width: 100%;
}

.heloc-use-card p {
    margin: 0;
    color: rgba(255, 255, 255, .65);
    font-size: 14px;
    line-height: 1.75;
}

/* =========================================================
           WHY HELOC
        ========================================================= */

.heloc-why-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.heloc-why-visual {
    position: relative;
    padding: 30px;
    background: linear-gradient(165deg, #F7F8FA 0%, #EDF0F5 100%);
    border-radius: var(--heloc-radius-lg);
    border: 1px solid var(--heloc-border);
    overflow: hidden;
}

/* .heloc-why-visual::before {
    content: "";
    position: absolute;
    bottom: -40px;
    right: -40px;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(201, 162, 75, .12) 0%, transparent 70%);
    border-radius: 50%;
} */

.heloc-visual-title {
    margin-bottom: 30px;
    color: var(--heloc-navy);
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.heloc-house {
    position: relative;
    height: 280px;
    background: var(--heloc-white);
    border-radius: var(--heloc-radius);
    border: 1px solid var(--heloc-border);
    box-shadow: var(--heloc-shadow);
    overflow: hidden;
}

.heloc-house-roof {
    position: absolute;
    top: 35px;
    left: 50%;
    width: 220px;
    height: 160px;
    background: linear-gradient(135deg, var(--heloc-navy), var(--heloc-dark));
    transform: translateX(-50%) rotate(45deg);
    border-radius: 4px;
}

.heloc-house-body {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 260px;
    height: 180px;
    background: var(--heloc-white);
    border: 8px solid var(--heloc-navy);
    border-bottom: none;
    transform: translateX(-50%);
    z-index: 2;
    border-radius: 4px 4px 0 0;
}

.heloc-house-door {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 50px;
    height: 85px;
    background: linear-gradient(180deg, var(--heloc-gold), #B8923E);
    transform: translateX(-50%);
    border-radius: 4px 4px 0 0;
}

.heloc-house-door::after {
    content: "";
    position: absolute;
    top: 45px;
    right: 8px;
    width: 6px;
    height: 6px;
    background: var(--heloc-white);
    border-radius: 50%;
}

.heloc-house-window {
    position: absolute;
    top: 32px;
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #E8EEF5, #D5DEE8);
    border: 5px solid var(--heloc-navy);
    border-radius: 4px;
}

.heloc-house-window.one {
    left: 30px;
}

.heloc-house-window.two {
    right: 30px;
}

.heloc-equity-tag {
    position: absolute;
    right: 20px;
    bottom: 20px;
    z-index: 4;
    padding: 16px 22px;
    background: linear-gradient(135deg, var(--heloc-gold), #B8923E);
    color: var(--heloc-white);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    border-radius: var(--heloc-radius);
    box-shadow: 0 8px 25px rgba(201, 162, 75, .4);
}

.heloc-why-content h2 {
    margin: 0 0 24px;
    color: var(--heloc-navy);
    font-size: clamp(28px, 4.5vw, 54px);
    line-height: 1.1;
}

.heloc-why-content>p {
    margin: 0 0 32px;
    color: var(--heloc-muted);
    font-size: 17px;
    line-height: 1.85;
}

.heloc-benefits {
    display: grid;
    gap: 18px;
}

.heloc-benefit {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 18px 20px;
    background: var(--heloc-light);
    border-radius: var(--heloc-radius);
    border: 1px solid transparent;
    transition: all .3s ease;
}

.heloc-benefit:hover {
    border-color: var(--heloc-gold);
    background: var(--heloc-white);
    box-shadow: 0 4px 15px rgba(201, 162, 75, .1);
    transform: translateX(4px);
}

.heloc-benefit-icon {
    flex: 0 0 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: linear-gradient(135deg, var(--heloc-gold), #B8923E);
    color: var(--heloc-white);
    border-radius: 50%;
    font-size: 13px;
    font-weight: 800;
}

.heloc-benefit strong {
    display: block;
    margin-bottom: 4px;
    color: var(--heloc-navy);
    font-size: 15px;
    font-weight: 800;
}

.heloc-benefit span {
    color: var(--heloc-muted);
    font-size: 14px;
    line-height: 1.65;
}

/* =========================================================
           PROCESS
        ========================================================= */

.heloc-process {
    padding: 110px 0;
    background: linear-gradient(165deg, #F7F8FA 0%, #EDF0F5 100%);
    position: relative;
}

.heloc-process-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin-top: 60px;
    position: relative;
}

.heloc-process-grid::before {
    content: "";
    position: absolute;
    top: 28px;
    left: 10%;
    right: 10%;
    height: 2px;
    background: linear-gradient(90deg, var(--heloc-border), var(--heloc-gold), var(--heloc-border));
    border-radius: 2px;
}

.heloc-process-step {
    position: relative;
    padding: 0 24px;
    text-align: center;
}

.heloc-process-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin: 0 auto 28px;
    background: linear-gradient(135deg, var(--heloc-navy), var(--heloc-dark));
    color: var(--heloc-white);
    border-radius: 50%;
    font-size: 14px;
    font-weight: 800;
    position: relative;
    z-index: 2;
    box-shadow: 0 4px 15px rgba(27, 42, 74, .2);
    border: 4px solid var(--heloc-light);
    transition: all .3s ease;
}

.heloc-process-step:nth-child(2) .heloc-process-number,
.heloc-process-step:nth-child(4) .heloc-process-number {
    background: linear-gradient(135deg, var(--heloc-gold), #B8923E);
    box-shadow: 0 4px 15px rgba(201, 162, 75, .3);
}

.heloc-process-step:hover .heloc-process-number {
    transform: scale(1.1);
    box-shadow: 0 8px 25px rgba(201, 162, 75, .4);
}

.heloc-process-step h3 {
    margin: 0 0 12px;
    color: var(--heloc-navy);
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -.3px;
}

.heloc-process-step p {
    margin: 0;
    color: var(--heloc-muted);
    font-size: 14px;
    line-height: 1.75;
}

/* =========================================================
           CALLOUT
        ========================================================= */

.heloc-callout {
    padding: 100px 0;
    background: linear-gradient(135deg, var(--heloc-gold) 0%, #B8923E 100%);
    position: relative;
    overflow: hidden;
}

.heloc-callout::before {
    content: "";
    position: absolute;
    top: -50%;
    right: -10%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(255, 255, 255, .1) 0%, transparent 70%);
    border-radius: 50%;
}

.heloc-callout-inner {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 60px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.heloc-callout h2 {
    max-width: 700px;
    margin: 0 0 12px;
    color: var(--heloc-white);
    font-size: clamp(34px, 4.5vw, 54px);
    line-height: 1.1;
    letter-spacing: -1.5px;
    font-weight: 800;
}

.heloc-callout p {
    max-width: 680px;
    margin: 0;
    color: rgba(255, 255, 255, .85);
    font-size: 17px;
    line-height: 1.7;
}

.heloc-callout .heloc-btn {
    background: var(--heloc-navy);
    border: 2px solid var(--heloc-navy);
    color: var(--heloc-white);
    white-space: nowrap;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .2);
}

.heloc-callout .heloc-btn:hover {
    background: var(--heloc-white);
    border-color: var(--heloc-white);
    color: var(--heloc-navy);
    transform: translateY(-3px);
    box-shadow: 0 12px 35px rgba(0, 0, 0, .25);
}

/* =========================================================
           FAQ
        ========================================================= */

.heloc-faq {
    padding: 120px 0;
}

.heloc-faq-grid {
    max-width: 860px;
    margin: 60px auto 0;
}

.heloc-faq-item {
    border-bottom: 1px solid var(--heloc-border);
    transition: all .3s ease;
}

.heloc-faq-item:first-child {
    border-top: 1px solid var(--heloc-border);
}

.heloc-faq-item:hover {
    background: rgba(247, 248, 250, .5);
}

.heloc-faq-item summary {
    position: relative;
    padding: 28px 50px 28px 0;
    color: var(--heloc-navy);
    font-size: 17px;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
    transition: color .3s ease;
}

.heloc-faq-item summary:hover {
    color: var(--heloc-gold);
}

.heloc-faq-item summary::-webkit-details-marker {
    display: none;
}

.heloc-faq-item summary::after {
    content: "+";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: var(--heloc-light);
    border-radius: 50%;
    color: var(--heloc-gold);
    font-size: 20px;
    font-weight: 400;
    transition: all .3s ease;
}

.heloc-faq-item[open] summary::after {
    content: "−";
    background: var(--heloc-gold);
    color: var(--heloc-white);
    transform: translateY(-50%) rotate(180deg);
}

.heloc-faq-answer {
    padding: 0 60px 28px 0;
}

.heloc-faq-answer p {
    margin: 0;
    color: var(--heloc-muted);
    font-size: 15px;
    line-height: 1.85;
}

/* =========================================================
           FINAL CTA
        ========================================================= */

.heloc-final {
    padding: 110px 0;
    background: linear-gradient(135deg, var(--heloc-dark) 0%, var(--heloc-navy) 100%);
    text-align: center;
    position: relative;
    overflow: hidden;
}

.heloc-final::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(ellipse at 50% 0%, rgba(201, 162, 75, .08) 0%, transparent 60%);
    pointer-events: none;
}

.heloc-final .heloc-section-label {
    color: var(--heloc-gold-light);
    justify-content: center;
}

.heloc-final .heloc-section-label::before {
    display: none;
}

.heloc-final h2 {
    max-width: 750px;
    margin: 0 auto 24px;
    color: var(--heloc-white);
    font-size: clamp(36px, 4.5vw, 58px);
    line-height: 1.08;
    letter-spacing: -1.5px;
    font-weight: 800;
}

.heloc-final p {
    max-width: 620px;
    margin: 0 auto 38px;
    color: rgba(255, 255, 255, .7);
    font-size: 17px;
    line-height: 1.75;
}

.jumbo-page {
    color: #233358;
    line-height: 1.4;
}

.jumbo-page a {
    text-decoration: none;
}

.jumbo-page .wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px;
}

/* ----- HERO ----- */
.jumbo-hero {
    background: linear-gradient(135deg, #f8f9fc 0%, #eef1f8 100%);
    padding: 80px 0 70px;
    position: relative;
    overflow: hidden;
}

.jumbo-hero::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -120px;
    width: 420px;
    height: 420px;
    background: radial-gradient(circle, rgba(201, 152, 47, 0.08) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}

.jumbo-hero .wrap {
    display: flex;
    align-items: center;
    gap: 60px;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}

.jumbo-hero-text {
    flex: 1;
    min-width: 300px;
}

.jumbo-hero-text .eyebrow {
    display: inline-block;
    background: rgba(201, 152, 47, 0.12);
    color: #b88e2f;
    font-weight: 700;
    letter-spacing: 1.5px;
    font-size: 12px;
    padding: 8px 18px;
    border-radius: 30px;
    margin-bottom: 22px;
    text-transform: uppercase;
}

.jumbo-hero-text h1 {
    font-size: 48px;
    font-weight: 800;
    color: #233358;
    line-height: 1.12;
    margin: 0 0 22px;
}

.jumbo-hero-text h1 span {
    color: #c9982f;
    position: relative;
}

.jumbo-hero-text p {
    font-size: 16px;
    line-height: 1.75;
    color: #000;
    max-width: 480px;
    margin-bottom: 34px;
}

.jumbo-btn-row {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.jumbo-btn {
    display: inline-block;
    padding: 15px 32px;
    border-radius: 40px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    border: 2px solid #233358;
    transition: all 0.3s ease;
}

.jumbo-btn-primary {
    background: #233358;
    color: #fff;
    box-shadow: 0 8px 20px rgba(28, 45, 84, 0.15);
}

.jumbo-btn-primary:hover {
    background: #c9982f;
    border-color: #c9982f;
    color: #fff;
    box-shadow: 0 8px 24px rgba(201, 152, 47, 0.3);
    transform: translateY(-2px);
}

.jumbo-btn-outline {
    background: transparent;
    color: #233358;
}

.jumbo-btn-outline:hover {
    background: #233358;
    color: #fff;
    transform: translateY(-2px);
}

.jumbo-hero-img {
    flex: 1;
    min-width: 300px;
    position: relative;
}

.jumbo-hero-img img {
    width: 100%;
    border-radius: 24px;
    display: block;
    object-fit: cover;
    height: 420px;
    box-shadow: 0 30px 60px rgba(28, 45, 84, 0.15);
}

.jumbo-hero-img::after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: -20px;
    width: 140px;
    height: 140px;
    background: #c9982f;
    opacity: 0.12;
    border-radius: 24px;
    z-index: -1;
}

/* ----- STAT BAR ----- */
.jumbo-stats {
    background: #233358;
    padding: 45px 0;
    position: relative;
    overflow: hidden;
}

.jumbo-stats::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -10%;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(201, 152, 47, 0.15) 0%, transparent 70%);
    border-radius: 50%;
}

.jumbo-stats .wrap {
    gap: 20px;
    text-align: center;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.jumbo-stats .stat {
    color: #fff;
    flex: 1;
    min-width: 150px;
    padding: 0 15px;
}

.jumbo-stats .stat .num {
    font-size: 32px;
    font-weight: 800;
    color: #c9982f;
    display: block;
    margin-bottom: 8px;
    letter-spacing: -0.5px;
}

.jumbo-stats .stat .label {
    font-size: 13px;
    opacity: 0.85;
    font-weight: 400;
    letter-spacing: 0.3px;
}

/* ----- ABOUT ----- */
.jumbo-about {
    background: #f8f8f5;
    position: relative;
}

.jumbo-about .wrap {
    max-width: 1000px;
    text-align: center;
}

.jumbo-about h2 {
    font-size: 34px;
    font-weight: 800;
    color: #233358;
    margin-bottom: 24px;
    letter-spacing: -0.5px;
}

.jumbo-about h2 span {
    color: #c9982f;
}

.jumbo-about p {
    font-size: 16px;
    line-height: 1.85;
    color: #000;
    max-width: 100%;
    margin-bottom: 18px;
}

/* ----- FEATURE CARDS ----- */
.jumbo-features {
    background: #fff;
}

.jumbo-features h2 {
    font-size: 34px;
    font-weight: 800;
    color: #233358;
    margin-bottom: 50px;
    text-align: center;
    letter-spacing: -0.5px;
}

.jumbo-features h2 span {
    color: #c9982f;
}

.jumbo-card-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
}



.jumbo-card {
    border: 1px solid #eef1f8;
    border-radius: 18px;
    padding: 34px 26px;
    background: #fff;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.jumbo-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: #c9982f;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s ease;
}

.jumbo-card:hover::before {
    transform: scaleX(1);
}

.jumbo-card:hover {
    box-shadow: 0 20px 45px rgba(28, 45, 84, 0.1);
    transform: translateY(-6px);
    border-color: transparent;
}

.jumbo-card .icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: #f7f8fa;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    color: #233358;
    font-size: 24px;
    transition: all 0.3s ease;
}

.jumbo-card:hover .icon {
    background: #233358;
    color: #fff;
    transform: scale(1.05);
}

.jumbo-card h3 {
    font-size: 17px;
    font-weight: 700;
    color: #233358;
    margin-bottom: 12px;
}

.jumbo-card p {
    font-size: 14px;
    line-height: 1.7;
    color: #6b7494;
    margin: 0;
}

/* ----- SPLIT / REQUIREMENTS ----- */
.jumbo-split {
    background: #f7f8fa;
    position: relative;
    overflow: hidden;
}

.jumbo-split::after {
    content: "";
    position: absolute;
    bottom: -80px;
    left: -80px;
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(201, 152, 47, 0.06) 0%, transparent 70%);
    border-radius: 50%;
}

.jumbo-split .wrap {
    display: flex;
    gap: 60px;
    align-items: center;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}

.jumbo-split-img {
    flex: 1;
    min-width: 280px;
    position: relative;
}

.jumbo-split-img img {
    width: 100%;
    border-radius: 24px;
    height: 400px;
    object-fit: cover;
    display: block;
    box-shadow: 0 30px 60px rgba(28, 45, 84, 0.12);
}

/* .jumbo-split-img::before {
    content: "";
    position: absolute;
    top: -20px;
    right: -20px;
    width: 120px;
    height: 120px;
    background: #c9982f;
    opacity: 0.1;
    border-radius: 24px;
    z-index: -1;
} */

.jumbo-split-text {
    flex: 1;
    min-width: 280px;
}

.jumbo-split-text h2 {
    font-size: 34px;
    font-weight: 800;
    color: #233358;
    margin-bottom: 28px;
    letter-spacing: -0.5px;
}

.jumbo-split-text h2 span {
    color: #c9982f;
}

.jumbo-split-text ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.jumbo-split-text ul li {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 20px;
    font-size: 15.5px;
    color: #000;
    line-height: 1.65;
}

.jumbo-split-text ul li:before {
    content: "✓";
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    background: #233358;
    color: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    margin-top: 1px;
}

/* ----- CALCULATOR SECTION ----- */
.jumbo-calc-sec {
    background: #fff;
}

.jumbo-calc-sec .wrap {
    max-width: 1000px;
}

.jumbo-calc-head {
    text-align: center;
    margin-bottom: 50px;
}

.jumbo-calc-head .eyebrow {
    display: inline-block;
    color: #c9982f;
    font-weight: 700;
    letter-spacing: 1.5px;
    font-size: 12px;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.jumbo-calc-head h2 {
    font-size: 34px;
    font-weight: 800;
    color: #233358;
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.jumbo-calc-head p {
    font-size: 15.5px;
    color: #6b7494;
    max-width: 580px;
    margin: 0 auto;
    line-height: 1.7;
}

.jumbo-calc-box {
    background: #f7f8fa;
    border: 1px solid #eef1f8;
    border-radius: 28px;
    padding: 50px 45px;
    box-shadow: 0 20px 50px rgba(28, 45, 84, 0.06);
    display: flex;
    flex-wrap: wrap;
    gap: 45px;
}

.jumbo-calc-inputs {
    flex: 1.2;
    min-width: 260px;
}

.jumbo-calc-result {
    flex: 0.8;
    min-width: 220px;
    background: #233358;
    border-radius: 20px;
    padding: 38px 32px;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.jumbo-calc-result::before {
    content: "";
    position: absolute;
    top: -40px;
    right: -40px;
    width: 140px;
    height: 140px;
    background: radial-gradient(circle, rgba(201, 152, 47, 0.2) 0%, transparent 70%);
    border-radius: 50%;
}

.jumbo-input-group {
    margin-bottom: 26px;
}

.jumbo-input-group label {
    display: block;
    font-size: 13.5px;
    font-weight: 600;
    color: #233358;
    margin-bottom: 10px;
    letter-spacing: 0.2px;
}

.jumbo-input-group input,
.jumbo-input-group select {
    width: 100%;
    padding: 16px 18px;
    border: 1px solid #dfe3ee;
    border-radius: 12px;
    font-size: 15px;
    font-family: 'Poppins', sans-serif;
    background: #fff;
    color: #233358;
    transition: all 0.25s ease;
    font-weight: 500;
}

.jumbo-input-group input:focus,
.jumbo-input-group select:focus {
    border-color: #c9982f;
    outline: none;
    box-shadow: 0 0 0 4px rgba(201, 152, 47, 0.1);
}

.jumbo-calc-result .result-label {
    font-size: 12.5px;
    color: #b8c2d9;
    margin-bottom: 6px;
    letter-spacing: 1px;
    font-weight: 600;
    text-transform: uppercase;
}

.jumbo-calc-result .result-value {
    font-size: 44px;
    font-weight: 800;
    color: #c9982f;
    line-height: 1.15;
    margin-bottom: 22px;
    letter-spacing: -1px;
}

.jumbo-calc-result .result-note {
    font-size: 12.5px;
    color: #b8c2d9;
    line-height: 1.6;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    padding-top: 20px;
}

.jumbo-calc-btn {
    background: #c9982f;
    color: #fff;
    border: none;
    padding: 16px 34px;
    border-radius: 40px;
    font-weight: 700;
    font-size: 14.5px;
    cursor: pointer;
    width: 100%;
    font-family: 'Poppins', sans-serif;
    transition: all 0.3s ease;
    margin-top: 6px;
    letter-spacing: 0.3px;
    box-shadow: 0 8px 20px rgba(201, 152, 47, 0.3);
}

.jumbo-calc-btn:hover {
    background: #b08725;
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(201, 152, 47, 0.4);
}

/* ----- RATE COMPARISON SECTION ----- */
.jumbo-rate-sec {
    background: #f7f8fa;
    position: relative;
    overflow: hidden;
}

.jumbo-rate-sec::before {
    content: "";
    position: absolute;
    top: -100px;
    right: -100px;
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(201, 152, 47, 0.05) 0%, transparent 70%);
    border-radius: 50%;
}

.jumbo-rate-sec .wrap {
    max-width: 1100px;
    position: relative;
    z-index: 1;
}

.jumbo-rate-head {
    text-align: center;
    margin-bottom: 50px;
}

.jumbo-rate-head .eyebrow {
    display: inline-block;
    color: #c9982f;
    font-weight: 700;
    letter-spacing: 1.5px;
    font-size: 12px;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.jumbo-rate-head h2 {
    font-size: 34px;
    font-weight: 800;
    color: #233358;
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.jumbo-rate-head p {
    font-size: 15.5px;
    color: #6b7494;
    max-width: 580px;
    margin: 0 auto;
    line-height: 1.7;
}

.jumbo-rate-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}


.jumbo-rate-card {
    background: #fff;
    border: 1px solid #eef1f8;
    border-radius: 20px;
    padding: 36px 30px;
    transition: all 0.3s ease;
    position: relative;
    display: flex;
    flex-direction: column;
}

.jumbo-rate-card.featured {
    border-color: #c9982f;
    box-shadow: 0 20px 45px rgba(201, 152, 47, 0.12);
    transform: scale(1.03);
}

.jumbo-rate-card.featured::before {
    content: "MOST POPULAR";
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: #c9982f;
    color: #fff;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 6px 18px;
    border-radius: 20px;
    white-space: nowrap;
}

.jumbo-rate-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 45px rgba(28, 45, 84, 0.1);
}

.jumbo-rate-card.featured:hover {
    transform: scale(1.03) translateY(-6px);
}

.jumbo-rate-card .rate-type {
    font-size: 13px;
    font-weight: 700;
    color: #c9982f;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.jumbo-rate-card .rate-value {
    font-size: 42px;
    font-weight: 800;
    color: #233358;
    line-height: 1;
    margin-bottom: 6px;
    letter-spacing: -1px;
}

.jumbo-rate-card .rate-value span {
    font-size: 16px;
    font-weight: 600;
    color: #6b7494;
    letter-spacing: 0;
}

.jumbo-rate-card .rate-desc {
    font-size: 14px;
    color: #6b7494;
    line-height: 1.6;
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #eef1f8;
}

.jumbo-rate-card ul {
    list-style: none;
    margin: 0 0 28px;
    padding: 0;
    flex: 1;
}

.jumbo-rate-card ul li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 14px;
    color: #000;
    line-height: 1.6;
    margin-bottom: 12px;
}

.jumbo-rate-card ul li:before {
    content: "✓";
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    background: #eef4ff;
    color: #233358;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    margin-top: 1px;
}

.jumbo-rate-card.featured ul li:before {
    background: rgba(201, 152, 47, 0.12);
    color: #b88e2f;
}

.jumbo-rate-btn {
    display: block;
    text-align: center;
    padding: 14px 0;
    border-radius: 40px;
    font-weight: 700;
    font-size: 14px;
    transition: all 0.3s ease;
    border: 2px solid #233358;
    color: #233358;
    background: transparent;
}

.jumbo-rate-btn:hover {
    background: #233358;
    color: #fff;
}

.jumbo-rate-card.featured .jumbo-rate-btn {
    background: #233358;
    color: #fff;
    border-color: #233358;
}

.jumbo-rate-card.featured .jumbo-rate-btn:hover {
    background: #c9982f;
    border-color: #c9982f;
}

/* ----- CTA STRIP ----- */
.jumbo-cta {
    background: linear-gradient(135deg, #233358 0%, #24365f 100%);
    padding: 80px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.jumbo-cta::before {
    content: "";
    position: absolute;
    top: -80px;
    left: 50%;
    transform: translateX(-50%);
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(201, 152, 47, 0.12) 0%, transparent 70%);
    border-radius: 50%;
}

.jumbo-cta .wrap {
    position: relative;
    z-index: 1;
}

.jumbo-cta h2 {
    color: #fff;
    font-size: 36px;
    font-weight: 800;
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.jumbo-cta p {
    color: #c8d0e3;
    font-size: 16px;
    margin-bottom: 34px;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.7;
}

.jumbo-cta .jumbo-btn-primary {
    background: #c9982f;
    border-color: #c9982f;
    padding: 16px 40px;
    font-size: 15px;
    box-shadow: 0 10px 30px rgba(201, 152, 47, 0.35);
}

.jumbo-cta .jumbo-btn-primary:hover {
    background: #fff;
    color: #233358;
    border-color: #fff;
    box-shadow: 0 10px 30px rgba(255, 255, 255, 0.2);
}

.usda-loans-page {
    --usda-navy: #233358;
    --usda-dark: #233358;
    --usda-gold: #b88e2f;
    --usda-gold-light: #b88e2f;
    --usda-light: #F6F7F8;
    --usda-border: #D9DEE5;
    --usda-text: #263247;
    --usda-muted: #000;
    --usda-white: #FFFFFF;
}

.usda-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 53px;
    padding: 0 28px;
    border-radius: 3px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: .25s ease;
}

.usda-btn-primary {
    background: var(--usda-gold);
    color: var(--usda-white);
    border: 1px solid var(--usda-gold);
}

.usda-btn-primary:hover {
    background: var(--usda-dark);
    border-color: var(--usda-dark);
    color: var(--usda-white);
}

.usda-btn-outline {
    background: transparent;
    color: var(--usda-navy);
    border: 1px solid var(--usda-navy);
}

.usda-btn-outline:hover {
    background: var(--usda-navy);
    color: var(--usda-white);
}

/* =========================================================
           HERO
        ========================================================= */

.usda-hero {
    position: relative;
    padding: 90px 0 100px;
    background: var(--usda-light);
}

.usda-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.usda-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 22px;
    color: var(--usda-gold);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.usda-eyebrow::before {
    content: "";
    width: 34px;
    height: 2px;
    background: var(--usda-gold);
}

.usda-hero h1 {
    max-width: 650px;
    margin: 0 0 24px;
    color: var(--usda-navy);
    font-size: clamp(43px, 5vw, 70px);
    line-height: 1.04;
    letter-spacing: -2px;
}

.usda-hero h1 span {
    color: var(--usda-gold);
}

.usda-hero-text {
    max-width: 610px;
    margin: 0 0 32px;
    color: var(--usda-muted);
    font-size: 18px;
    line-height: 1.75;
}

.usda-hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
}

/* =========================================================
           HERO HOUSE VISUAL
        ========================================================= */

.usda-hero-visual {
    position: relative;
    min-height: 490px;
    background: var(--usda-navy);
    overflow: hidden;
}

.usda-hero-visual::before {
    content: "";
    position: absolute;
    top: -100px;
    right: -100px;
    width: 300px;
    height: 300px;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 50%;
}

.usda-hero-visual::after {
    content: "";
    position: absolute;
    bottom: -140px;
    left: -100px;
    width: 320px;
    height: 320px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 50%;
}

.usda-sun {
    position: absolute;
    top: 65px;
    right: 65px;
    width: 74px;
    height: 74px;
    border: 2px solid var(--usda-gold-light);
    border-radius: 50%;
}

.usda-horizon {
    position: absolute;
    right: -10%;
    bottom: 100px;
    width: 120%;
    height: 150px;
    background: var(--usda-gold);
    border-radius: 50% 50% 0 0;
    transform: rotate(-4deg);
}

.usda-house {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: 90px;
    width: 265px;
    height: 170px;
    background: var(--usda-white);
    border: 8px solid var(--usda-white);
    transform: translateX(-50%);
}

.usda-roof {
    position: absolute;
    z-index: 3;
    top: -105px;
    left: 50%;
    width: 210px;
    height: 210px;
    background: var(--usda-white);
    transform: translateX(-50%) rotate(45deg);
}

.usda-house-body {
    position: absolute;
    z-index: 5;
    inset: 0;
    background: var(--usda-white);
}

.usda-door {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 52px;
    height: 95px;
    background: var(--usda-gold);
    transform: translateX(-50%);
}

.usda-window {
    position: absolute;
    top: 42px;
    width: 52px;
    height: 52px;
    background: var(--usda-light);
    border: 5px solid var(--usda-navy);
}

.usda-window.left {
    left: 30px;
}

.usda-window.right {
    right: 30px;
}

.usda-window::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--usda-navy);
    transform: translateY(-50%);
}

.usda-window::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 4px;
    height: 100%;
    background: var(--usda-navy);
    transform: translateX(-50%);
}

.usda-visual-badge {
    position: absolute;
    z-index: 10;
    left: 28px;
    bottom: 28px;
    padding: 14px 18px;
    background: var(--usda-white);
    color: var(--usda-navy);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* =========================================================
           INTRO
        ========================================================= */

.usda-intro-grid {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 90px;
}

.usda-label {
    margin-bottom: 15px;
    color: var(--usda-gold);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.usda-intro h2 {
    margin: 0;
    color: var(--usda-navy);
    font-size: clamp(28px, 4vw, 46px);
    line-height: 1.12;
}

.usda-intro-content p {
    margin: 0 0 20px;
    color: var(--usda-muted);
    font-size: 17px;
    line-height: 1.8;
}

.usda-intro-content p:last-child {
    margin-bottom: 0;
}

/* =========================================================
           FEATURE STRIP
        ========================================================= */

.usda-feature-strip {
    background: var(--usda-navy);
    padding: 27px 0;
}

.usda-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.usda-feature {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 30px;
    border-right: 1px solid rgba(255, 255, 255, .16);
}

.usda-feature:first-child {
    padding-left: 0;
}

.usda-feature:last-child {
    border-right: 0;
}

.usda-feature-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--usda-gold);
    color: var(--usda-white);
    font-size: 17px;
    font-weight: 800;
}

.usda-feature strong {
    display: block;
    margin-bottom: 3px;
    color: var(--usda-white);
    font-size: 14px;
    font-family: 'visby-bold';
}

.usda-feature span {
    color: #C9D0DC;
    font-size: 15px;
}

/* =========================================================
           WHO IS IT FOR
        ========================================================= */


.usda-heading-center {
    max-width: 730px;
    margin: 0 auto 55px;
    text-align: center;
}

.usda-heading-center h2 {
    margin: 0;
    color: var(--usda-navy);
    font-size: clamp(28px, 4vw, 46px);
    line-height: 1.12;
}

.usda-fit-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.usda-fit-card {
    position: relative;
    padding: 32px;
    min-height: 280px;
    background: var(--usda-light);
    border: 1px solid var(--usda-border);
    transition: .25s ease;
}

.usda-fit-card:hover {
    transform: translateY(-6px);
    background: var(--usda-white);
    border-color: var(--usda-gold-light);
    box-shadow: 0 18px 45px rgba(35, 51, 88, .08);
}

.usda-fit-number {
    display: block;
    margin-bottom: 45px;
    color: var(--usda-gold);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
}

.usda-fit-card h3 {
    margin: 0 0 12px;
    color: var(--usda-navy);
    font-size: 24px;
}

.usda-fit-card p {
    margin: 0;
    color: var(--usda-muted);
    font-size: 14px;
    line-height: 1.75;
}

/* =========================================================
           ZERO DOWN STYLE SECTION
        ========================================================= */

.usda-highlight {
    background: var(--usda-light);
}

.usda-highlight-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.usda-highlight h2 {
    margin: 0 0 22px;
    color: var(--usda-navy);
    font-size: clamp(28px, 4vw, 46px);
    line-height: 1.1;
}

.usda-highlight-text {
    margin: 0 0 30px;
    color: var(--usda-muted);
    font-size: 17px;
    line-height: 1.8;
}

.usda-points {
    display: grid;
    gap: 15px;
}

.usda-point {
    display: flex;
    gap: 13px;
    align-items: flex-start;
}

.usda-check {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    background: var(--usda-gold);
    color: var(--usda-white);
    font-size: 12px;
    font-weight: 800;
    border-radius: 50%;
}

.usda-point span {
    color: var(--usda-muted);
    font-size: 14px;
    line-height: 1.6;
}

/* =========================================================
           INFO CARD
        ========================================================= */

.usda-info-card {
    position: relative;
    padding: 42px;
    background: var(--usda-navy);
    box-shadow: 20px 20px 0 var(--usda-gold);
}

.usda-info-card-label {
    margin-bottom: 30px;
    color: var(--usda-gold-light);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.usda-info-card h3 {
    margin: 0 0 17px;
    color: var(--usda-white);
    font-size: 30px;
    line-height: 1.2;
}

.usda-info-card p {
    margin: 0 0 28px;
    color: #D0D7E2;
    font-size: 15px;
    line-height: 1.75;
}

.usda-info-list {
    display: grid;
    gap: 13px;
}

.usda-info-list div {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, .15);
    color: #D8DEE7;
    font-size: 13px;
}

.usda-info-list div strong {
    color: var(--usda-white);
}

/* =========================================================
           PROCESS
        ========================================================= */

.usda-process {
    padding: 105px 0;
}

.usda-process-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-top: 55px;
}

.usda-process-step {
    position: relative;
    padding-top: 65px;
}

.usda-process-step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 22px;
    right: -15px;
    width: 30px;
    height: 1px;
    background: var(--usda-border);
}

.usda-step-number {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    background: var(--usda-navy);
    color: var(--usda-white);
    border-radius: 50%;
    font-size: 12px;
    font-weight: 800;
}

.usda-process-step:nth-child(even) .usda-step-number {
    background: var(--usda-gold);
}

.usda-process-step h3 {
    margin: 0 0 10px;
    color: var(--usda-navy);
    font-size: 19px;
}

.usda-process-step p {
    margin: 0;
    color: var(--usda-muted);
    font-size: 14px;
    line-height: 1.7;
}

/* =========================================================
           CTA
        ========================================================= */

.usda-cta {
    position: relative;
    padding: 90px 0;
    background: var(--usda-gold);
    overflow: hidden;
}

.usda-cta::after {
    content: "";
    position: absolute;
    right: -100px;
    top: -180px;
    width: 450px;
    height: 450px;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 50%;
}

.usda-cta-inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 50px;
}

.usda-cta h2 {
    max-width: 700px;
    margin: 0 0 10px;
    color: var(--usda-white);
    font-size: clamp(34px, 4vw, 51px);
    line-height: 1.1;
}

.usda-cta p {
    max-width: 650px;
    margin: 0;
    color: var(--usda-white);
    font-size: 16px;
    line-height: 1.7;
}

.usda-cta .usda-btn {
    background: var(--usda-navy);
    border-color: var(--usda-navy);
    color: var(--usda-white);
    white-space: nowrap;
}

.usda-cta .usda-btn:hover {
    background: var(--usda-white);
    border-color: var(--usda-white);
    color: var(--usda-navy);
}

/* =========================================================
           FAQ
        ========================================================= */

.usda-faq {
    padding: 105px 0;
}

.usda-faq-list {
    max-width: 900px;
    margin: 50px auto 0;
}

.usda-faq-item {
    border-top: 1px solid var(--usda-border);
}

.usda-faq-item:last-child {
    border-bottom: 1px solid var(--usda-border);
}

.usda-faq-item summary {
    position: relative;
    padding: 24px 50px 24px 0;
    color: var(--usda-navy);
    font-size: 17px;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
}

.usda-faq-item summary::-webkit-details-marker {
    display: none;
}

.usda-faq-item summary::after {
    content: "+";
    position: absolute;
    right: 0;
    top: 19px;
    color: var(--usda-gold);
    font-size: 26px;
    font-weight: 400;
}

.usda-faq-item[open] summary::after {
    content: "−";
}

.usda-faq-answer {
    padding: 0 50px 25px 0;
}

.usda-faq-answer p {
    margin: 0;
    color: var(--usda-muted);
    font-size: 15px;
    line-height: 1.8;
}

/* =========================================================
           FINAL
        ========================================================= */

.usda-final {
    padding: 95px 0;
    background: var(--usda-dark);
    text-align: center;
}

.usda-final .usda-label {
    color: var(--usda-gold-light);
}

.usda-final h2 {
    max-width: 760px;
    margin: 0 auto 20px;
    color: var(--usda-white);
    font-size: clamp(36px, 4vw, 55px);
    line-height: 1.1;
}

.usda-final p {
    max-width: 650px;
    margin: 0 auto 32px;
    color: #D3DAE4;
    font-size: 16px;
    line-height: 1.7;
}

.section-padding {
    padding: 80px 0;
}

.text-center {
    text-align: center;
}

.va-loan-page em {
    font-style: normal;
    color: var(--cc-gold);
}

.va-loan-hero {
    padding: 90px 0 80px;
    background: linear-gradient(135deg, #f8f9fc 0%, #eef1f8 100%);
    position: relative;
    overflow: hidden;
}

.va-loan-hero::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -120px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(184, 142, 47, 0.08) 0%, transparent 65%);
    border-radius: 50%;
    pointer-events: none;
}

.va-loan-hero-content {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    align-items: center;
    gap: 70px;
    position: relative;
    z-index: 1;
}

.section-tag {
    display: inline-block;
    color: var(--cc-gold);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.va-loan-hero-text h1 {
    color: var(--cc-navy);
    font-size: 56px;
    line-height: 1.08;
    margin: 0 0 24px;
    font-weight: 800;
    letter-spacing: -1px;
}

.va-loan-hero-text p {
    color: var(--cc-text-soft);
    font-size: 17px;
    line-height: 1.75;
    max-width: 540px;
    margin-bottom: 36px;
}

.va-loan-hero-buttons,
.va-cta-buttons {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}


/* ========================================
   HERO STATS
======================================== */

.va-hero-stats {
    display: flex;
    gap: 0;
    margin-top: 50px;
    border-top: 1px solid var(--cc-line);
    padding-top: 30px;
}

.va-hero-stat {
    flex: 1;
    padding-right: 24px;
    border-right: 1px solid var(--cc-line);
}

.va-hero-stat:last-child {
    border-right: none;
    padding-right: 0;
}

.va-hero-stat .stat-num {
    display: block;
    font-size: 26px;
    font-weight: 800;
    color: var(--cc-navy);
    line-height: 1;
    margin-bottom: 6px;
    letter-spacing: -0.5px;
}

.va-hero-stat .stat-lbl {
    display: block;
    font-size: 12px;
    color: var(--cc-text-soft);
    font-weight: 500;
    letter-spacing: 0.3px;
}


/* ========================================
   HERO IMAGE
======================================== */

.va-loan-hero-image {
    position: relative;
}

.va-loan-hero-image img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    border-radius: 20px;
    display: block;
    box-shadow: 0 30px 60px rgba(35, 51, 88, 0.15);
}

.va-hero-image-badge {
    position: absolute;
    bottom: -18px;
    left: -18px;
    background: var(--cc-gold);
    color: #fff;
    padding: 18px 24px;
    border-radius: 12px;
    box-shadow: 0 20px 40px rgba(184, 142, 47, 0.3);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.va-hero-image-badge .badge-num {
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1px;
}

.va-hero-image-badge .badge-text {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    opacity: 0.9;
    margin-top: 4px;
}


/* ========================================
   BUTTONS
======================================== */

/* .btn {
        display: inline-block;
        padding: 15px 32px;
        text-decoration: none;
        font-weight: 600;
        font-size: 14.5px;
        border-radius: 40px;
        transition: all 0.3s ease;
        letter-spacing: 0.2px;
        cursor: pointer;
    } */


/* Navy Button */

.btn-primary {
    background: var(--cc-navy);
    color: var(--cc-white);
    border-color: var(--cc-navy);
    box-shadow: 0 8px 20px rgba(35, 51, 88, 0.15);
}

.btn-primary:hover {
    background: var(--cc-gold);
    border-color: var(--cc-gold);
    color: var(--cc-white);
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(184, 142, 47, 0.3);
}


/* Outline Button */

.btn-secondary {
    background: transparent;
    color: var(--cc-navy);
    border-color: var(--cc-navy);
}

.btn-secondary:hover {
    background: var(--cc-navy);
    color: var(--cc-white);
    transform: translateY(-2px);
}

/* ========================================
   INTRO
======================================== */

.va-loan-intro {
    background: var(--cc-white);
}


/* ========================================
   BENEFITS
======================================== */

.va-loan-benefits {
    background: var(--cc-light-gray);
}

.va-benefits-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.va-benefit-card {
    background: var(--cc-white);
    border: 1px solid var(--cc-line);
    border-radius: 16px;
    padding: 36px 28px;
    transition: all 0.35s ease;
    position: relative;
    overflow: hidden;
}

.va-benefit-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--cc-gold);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s ease;
}

.va-benefit-card:hover::before {
    transform: scaleX(1);
}

.va-benefit-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 45px rgba(35, 51, 88, 0.1);
    border-color: transparent;
}

.va-benefit-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--cc-gold-light);
    color: var(--cc-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 800;
    margin-bottom: 22px;
    transition: all 0.35s ease;
}

.va-benefit-card:hover .va-benefit-icon {
    background: var(--cc-navy);
    color: #fff;
}

.va-benefit-card h3 {
    color: var(--cc-navy);
    font-size: 19px;
    margin: 0 0 12px;
    font-weight: 700;
    line-height: 1.3;
}

.va-benefit-card p {
    color: var(--cc-text-soft);
    font-size: 14.5px;
    line-height: 1.7;
    margin: 0;
}


/* ========================================
   ELIGIBILITY
======================================== */

.va-loan-eligibility {
    background: var(--cc-white);
}

.va-eligibility-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    align-items: center;
}

.va-eligibility-image {
    position: relative;
}

.va-eligibility-image img {
    width: 100%;
    height: 520px;
    object-fit: cover;
    border-radius: 20px;
    display: block;
    box-shadow: 0 30px 60px rgba(35, 51, 88, 0.12);
}

.va-eligibility-image::before {
    content: "";
    position: absolute;
    top: -18px;
    right: -18px;
    width: 140px;
    height: 140px;
    background: var(--cc-gold);
    opacity: 0.12;
    border-radius: 20px;
    z-index: -1;
}

.va-eligibility-content h2 {
    color: var(--cc-navy);
    font-size: 40px;
    line-height: 1.15;
    margin: 0 0 20px;
    font-weight: 800;
    letter-spacing: -1px;
}

.va-eligibility-content>p {
    color: var(--cc-text-soft);
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 28px;
}

.va-check-list {
    list-style: none;
    padding: 0;
    margin: 0 0 34px;
}

.va-check-list li {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 16px;
    color: var(--cc-text);
    font-weight: 500;
    font-size: 15.5px;
    line-height: 1.6;
}

.va-check-list li span {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    background: var(--cc-navy);
    color: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    margin-top: 1px;
}


/* ========================================
   PROCESS
======================================== */

.va-loan-process {
    background: var(--cc-light-gray);
}

.va-process-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.va-process-card {
    background: var(--cc-white);
    border: 1px solid var(--cc-line);
    border-radius: 16px;
    padding: 36px 28px;
    transition: all 0.35s ease;
    position: relative;
    overflow: hidden;
}

.va-process-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--cc-gold);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s ease;
}

.va-process-card:hover::before {
    transform: scaleX(1);
}

.va-process-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 45px rgba(35, 51, 88, 0.1);
    border-color: transparent;
}

.process-number {
    display: inline-block;
    font-size: 14px;
    font-weight: 800;
    color: var(--cc-gold);
    background: var(--cc-gold-light);
    padding: 6px 14px;
    border-radius: 20px;
    margin-bottom: 20px;
    letter-spacing: 0.5px;
}

.va-process-card h3 {
    color: var(--cc-navy);
    font-size: 19px;
    margin: 0 0 12px;
    font-weight: 700;
    line-height: 1.3;
}

.va-process-card p {
    color: var(--cc-text-soft);
    font-size: 14.5px;
    line-height: 1.7;
    margin: 0;
}


/* ========================================
   FAQ
======================================== */

.va-loan-faq {
    background: var(--cc-white);
}

.va-faq-list {
    max-width: 900px;
    margin: 0 auto;
}

.va-faq-item {
    border-bottom: 1px solid var(--cc-line);
    padding: 28px 0;
    transition: padding 0.3s ease;
}

.va-faq-item:first-child {
    border-top: 1px solid var(--cc-line);
}

.va-faq-item:hover {
    padding-left: 12px;
}

.va-faq-item h3 {
    color: var(--cc-navy);
    font-size: 20px;
    margin: 0 0 12px;
    font-weight: 700;
    line-height: 1.4;
    position: relative;
    padding-left: 20px;
}

.va-faq-item h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    width: 8px;
    height: 8px;
    background: var(--cc-gold);
    border-radius: 50%;
}

.va-faq-item p {
    color: var(--cc-text-soft);
    margin: 0;
    line-height: 1.75;
    font-size: 15.5px;
    padding-left: 20px;
}


/* ========================================
   CTA
======================================== */

.va-loan-cta {
    background: var(--cc-navy);
    color: var(--cc-white);
    padding: 100px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.va-loan-cta::before {
    content: "";
    position: absolute;
    top: -100px;
    left: 50%;
    transform: translateX(-50%);
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, rgba(184, 142, 47, 0.12) 0%, transparent 65%);
    border-radius: 50%;
    pointer-events: none;
}

.va-cta-content {
    max-width: 800px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.va-cta-content .section-tag {
    color: var(--cc-gold);
}

.va-cta-content h2 {
    color: var(--cc-white);
    font-size: 44px;
    line-height: 1.15;
    margin: 0 0 20px;
    font-weight: 800;
    letter-spacing: -1px;
}

.va-cta-content h2 em {
    color: var(--cc-gold);
}

.va-cta-content p {
    color: rgba(255, 255, 255, 0.75);
    font-size: 16.5px;
    line-height: 1.75;
    margin-bottom: 38px;
}

.va-cta-buttons {
    justify-content: center;
}


/* CTA primary */

.va-loan-cta .btn-primary {
    background: var(--cc-gold);
    border-color: var(--cc-gold);
    color: #fff;
}

.va-loan-cta .btn-primary:hover {
    background: #fff;
    border-color: #fff;
    color: var(--cc-navy);
}


/* CTA secondary */

.va-loan-cta .btn-secondary {
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
}

.va-loan-cta .btn-secondary:hover {
    background: #fff;
    color: var(--cc-navy);
    border-color: #fff;
}


.bridge-loan-page {
    --bridge-navy: #233358;
    --bridge-dark: #233358;
    --bridge-gold: #b88e2f;
    --bridge-gold-light: #b88e2f;
    --bridge-light: #F6F7F8;
    --bridge-border: #D9DEE5;
    --bridge-text: #233358;
    --bridge-muted: #000;
    --bridge-white: #FFFFFF;
    background: var(--bridge-white);
    color: var(--bridge-text);
}

/* =========================================================
           INTRO
        ========================================================= */



.bridge-intro-grid {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 90px;
}

.bridge-label {
    margin-bottom: 15px;
    color: var(--bridge-gold);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.bridge-intro h2 {
    margin: 0;
    color: var(--bridge-navy);
    font-size: clamp(28px, 4vw, 46px);
    line-height: 1.12;
    letter-spacing: -1px;
}

.bridge-intro-content p {
    margin: 0 0 20px;
    color: var(--bridge-muted);
    font-size: 17px;
    line-height: 1.8;
}

.bridge-intro-content p:last-child {
    margin-bottom: 0;
}

/* =========================================================
           TWO HOME SCENARIO
        ========================================================= */

.bridge-scenario {
    background: var(--bridge-navy);
}

.bridge-heading-center {
    max-width: 760px;
    margin: 0 auto 55px;
    text-align: center;
}

.bridge-heading-center .bridge-label {
    color: var(--bridge-gold-light);
}

.bridge-heading-center h2 {
    margin: 0;
    font-size: clamp(28px, 4vw, 46px);
    line-height: 1.12;
}

.bridge-scenario .bridge-heading-center h2 {
    color: #fff;
}


.bridge-scenario-grid {
    align-items: center;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 60px;
}

.bridge-scenario-card {
    padding: 32px;
    background: var(--bridge-white);
}

.bridge-scenario-number {
    display: block;
    margin-bottom: 45px;
    color: var(--bridge-gold);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
}

.bridge-scenario-card h3 {
    margin: 0 0 13px;
    color: var(--bridge-navy);
    font-size: 20px;
}

.bridge-scenario-card p {
    margin: 0;
    color: var(--bridge-muted);
    font-size: 14px;
    line-height: 1.75;
}

.bridge-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    color: var(--bridge-gold-light);
    text-align: center;
}

.bridge-arrow-line {
    display: flex;
    align-items: center;
    gap: 5px;
}

.bridge-arrow-line span {
    width: 9px;
    height: 9px;
    border-top: 2px solid var(--bridge-gold);
    border-right: 2px solid var(--bridge-gold);
    transform: rotate(45deg);
}

.bridge-arrow-line::before {
    content: "";
    width: 55px;
    height: 2px;
    background: var(--bridge-gold);
}

.bridge-arrow small {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* =========================================================
           BENEFITS
        ========================================================= */

.bridge-benefits-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.bridge-benefits h2 {
    margin: 0 0 22px;
    color: var(--bridge-navy);
    font-size: clamp(35px, 4vw, 53px);
    line-height: 1.1;
}

.bridge-benefits-intro {
    margin: 0 0 30px;
    color: var(--bridge-muted);
    font-size: 17px;
    line-height: 1.8;
}

.bridge-benefit-list {
    display: grid;
    gap: 16px;
}

.bridge-benefit {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.bridge-check {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--bridge-gold);
    color: var(--bridge-white);
    font-size: 12px;
    font-weight: 800;
}

.bridge-benefit strong {
    display: block;
    margin-bottom: 3px;
    color: var(--bridge-navy);
    font-size: 16px;
    font-family: 'visby-bold';
}

.bridge-benefit span {
    color: var(--bridge-muted);
    font-size: 14px;
    line-height: 1.6;
}

/* RIGHT INFO CARD */

.bridge-info-card {
    padding: 40px;
    background: var(--bridge-light);
    border: 1px solid var(--bridge-border);
    box-shadow: 18px 18px 0 var(--bridge-gold);
}

.bridge-info-label {
    margin-bottom: 28px;
    color: var(--bridge-gold);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.bridge-info-card h3 {
    margin: 0 0 17px;
    color: var(--bridge-navy);
    font-size: 29px;
    line-height: 1.2;
}

.bridge-info-card>p {
    margin: 0 0 28px;
    color: var(--bridge-muted);
    font-size: 15px;
    line-height: 1.75;
}

.bridge-info-row {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 15px 0;
    border-top: 1px solid var(--bridge-border);
    color: var(--bridge-muted);
    font-size: 13px;
}

.bridge-info-row strong {
    color: var(--bridge-navy);
    text-align: right;
    font-family: 'visby-bold';
    font-size: 14px;
}

/* =========================================================
           WHEN TO CONSIDER
        ========================================================= */

.bridge-use {
    background: var(--bridge-light);
}

.bridge-use-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 55px;
}

.bridge-use-card {
    padding: 32px;
    min-height: 270px;
    background: var(--bridge-white);
    border: 1px solid var(--bridge-border);
    transition: .25s ease;
}

.bridge-use-card:hover {
    transform: translateY(-6px);
    border-color: var(--bridge-gold-light);
    box-shadow: 0 18px 45px rgba(35, 51, 88, .08);
}

.bridge-use-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin-bottom: 35px;
    background: var(--bridge-navy);
    color: var(--bridge-white);
    font-size: 17px;
    font-weight: 800;
}

.bridge-use-card:nth-child(2) .bridge-use-icon,
.bridge-use-card:nth-child(5) .bridge-use-icon {
    background: var(--bridge-gold);
}

.bridge-use-card h3 {
    margin: 0 0 12px;
    color: var(--bridge-navy);
    font-size: 20px;
}

.bridge-use-card p {
    margin: 0;
    color: var(--bridge-muted);
    font-size: 14px;
    line-height: 1.75;
}

/* =========================================================
           PROCESS
        ========================================================= */

.bridge-process {
    padding: 105px 0;
}

.bridge-process-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-top: 55px;
}

.bridge-step {
    position: relative;
    padding-top: 66px;
}

.bridge-step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 22px;
    right: -15px;
    width: 30px;
    height: 1px;
    background: var(--bridge-border);
}

.bridge-step-number {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: var(--bridge-navy);
    color: var(--bridge-white);
    font-size: 12px;
    font-weight: 800;
}

.bridge-step:nth-child(even) .bridge-step-number {
    background: var(--bridge-gold);
}

.bridge-step h3 {
    margin: 0 0 10px;
    color: var(--bridge-navy);
    font-size: 19px;
}

.bridge-step p {
    margin: 0;
    color: var(--bridge-muted);
    font-size: 14px;
    line-height: 1.7;
}

/* =========================================================
           CTA
        ========================================================= */

.bridge-cta {
    background: #233358;
}

.bridge-cta-inner {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 50px;
    align-items: center;
}

.bridge-cta h2 {
    max-width: 730px;
    margin: 0 0 10px;
    color: var(--bridge-white);
    font-size: clamp(34px, 4vw, 46px);
    line-height: 1.1;
}

.bridge-cta p {
    max-width: 650px;
    margin: 0;
    color: var(--bridge-white);
    font-size: 18px;
}

.renovation-loans-page {

    --rl-navy: #233358;
    --rl-dark: #233358;
    --rl-gold: #b88e2f;
    --rl-gold-light: #b88e2f;
    --rl-light: #E6E8E9;
    --rl-border: #C9D0D7;
    --rl-text: #233358;
    --rl-muted: #000;
    --rl-white: #FFFFFF;

    color: var(--rl-text);

    background: var(--rl-white);
}




/* =========================================================
   BUTTONS
========================================================= */

.rl-btn {

    min-height: 51px;

    padding: 13px 25px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 18px;

    border-radius: 30px;

    text-decoration: none;

    font-size: 12px;

    font-weight: 700;

    transition: .3s ease;

    box-sizing: border-box;
}


.rl-btn span {

    font-size: 18px;

    line-height: 1;
}


.rl-btn-gold {

    color: var(--rl-white);

    background: var(--rl-gold);

    border: 1px solid var(--rl-gold);
}


.rl-btn-gold:hover {

    color: var(--rl-white);

    background: var(--rl-navy);

    border-color: var(--rl-navy);

    transform: translateY(-2px);
}


.rl-btn-light {

    color: var(--rl-navy);

    background: var(--rl-white);

    border: 1px solid var(--rl-white);
}


.rl-btn-light:hover {

    color: var(--rl-white);

    background: transparent;
}


.rl-btn-navy {

    color: var(--rl-white);

    background: var(--rl-navy);

    border: 1px solid var(--rl-navy);
}


.rl-btn-navy:hover {

    color: var(--rl-white);

    background: var(--rl-gold);

    border-color: var(--rl-gold);
}


.rl-btn-white {

    color: var(--rl-navy);

    background: var(--rl-white);

    border: 1px solid var(--rl-white);
}


.rl-btn-white:hover {

    color: var(--rl-white);

    background: transparent;
}


.rl-outline-link {

    color: var(--rl-navy);

    text-decoration: none;

    border-bottom: 1px solid var(--rl-navy);

    padding-bottom: 5px;

    font-size: 12px;

    font-weight: 700;
}


.rl-outline-link span {

    margin-left: 7px;
}




/* =========================================================
   INTRO
========================================================= */

.rl-intro {

    background: var(--rl-light);
}


.rl-intro-grid {

    display: grid;

    grid-template-columns: 70px 1.2fr 1fr;

    gap: 35px;
}


.rl-intro-label {

    color: var(--rl-gold);

    font-size: 13px;

    font-weight: 700;

    padding-top: 5px;
}


.rl-intro-grid h2 {

    color: var(--rl-navy);

    font-size: 46px;

    line-height: 1.1;

    letter-spacing: -1px;

    margin: 0;
}


.rl-intro-copy {

    padding-top: 30px;
}


.rl-intro-copy p {

    color: var(--rl-muted);

    font-size: 15px;

    line-height: 1.8;

    margin: 0 0 18px;
}


/* =========================================================
   PROJECTS
========================================================= */

.rl-projects {

    background: var(--rl-white);
}


.rl-project-header {

    display: grid;

    grid-template-columns: 1fr .7fr;

    gap: 80px;

    align-items: end;

    margin-bottom: 60px;
}


.rl-project-header h2 {

    color: var(--rl-navy);

    font-size: 46px;

    line-height: 1.08;

    margin: 0;
}


.rl-project-header>p {

    color: var(--rl-muted);

    font-size: 15px;

    line-height: 1.8;

    margin: 0;
}


.rl-project-grid {

    display: grid;

    grid-template-columns: 1.35fr 1fr 1fr;

    grid-template-rows: auto auto;

    gap: 20px;
}


.rl-project-card {

    min-height: 310px;

    padding: 35px;

    background: var(--rl-light);

    position: relative;

    overflow: hidden;

    transition: .3s ease;
}


.rl-project-card:hover {

    transform: translateY(-5px);

    box-shadow: 0 18px 40px rgba(35, 51, 88, .1);
}


.rl-project-large {

    grid-row: span 2;

    min-height: 640px;

    background: var(--rl-navy);

    color: var(--rl-white);

    display: flex;

    flex-direction: column;

    justify-content: flex-end;
}


.rl-project-large:after {

    content: "+";

    position: absolute;

    font-size: 450px;

    color: rgba(255, 255, 255, .035);

    right: -80px;

    top: -100px;

    line-height: 1;
}


.rl-project-number {

    position: absolute;

    left: 30px;

    top: 30px;

    color: var(--rl-gold);

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1px;
}


.rl-project-icon {

    width: 52px;

    height: 52px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    background: var(--rl-gold);

    color: var(--rl-white);

    font-size: 24px;

    margin-bottom: 25px;
}


.rl-project-card h3 {

    color: var(--rl-navy);

    font-size: 27px;

    line-height: 1.15;

    margin: 0 0 15px;
}


.rl-project-card p {

    color: var(--rl-muted);

    font-size: 14px;

    line-height: 1.7;

    margin: 0;
}


.rl-project-large h3 {

    position: relative;

    z-index: 2;

    color: var(--rl-white);

    font-size: 38px;
}


.rl-project-large p {

    position: relative;

    z-index: 2;

    color: rgba(255, 255, 255, .7);

    max-width: 480px;
}


.rl-project-large .rl-project-icon {

    position: relative;

    z-index: 2;
}


.rl-project-line {

    position: relative;

    z-index: 2;

    height: 1px;

    background: rgba(255, 255, 255, .2);

    margin: 30px 0 14px;
}


.rl-project-large>span {

    position: relative;

    z-index: 2;

    color: var(--rl-gold-light);

    font-size: 9px;

    letter-spacing: 1.5px;

    font-weight: 700;
}


/* =========================================================
   FEATURE BAND
========================================================= */

.rl-feature-band {

    background: var(--rl-navy);

    color: var(--rl-white);
}


.rl-feature-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 35px;

    align-items: center;
}


.rl-feature-number {

    color: var(--rl-gold);

    font-size: 13px;

    font-weight: 700;
}


.rl-feature-content h2 {

    max-width: 650px;

    color: var(--rl-white);

    font-size: 48px;

    line-height: 1.08;

    margin: 0;
}


.rl-feature-content p {

    max-width: 620px;

    color: rgba(255, 255, 255, .68);

    font-size: 15px;

    line-height: 1.8;

    margin: 25px 0 30px;
}


.rl-feature-side {

    padding-left: 50px;

    border-left: 1px solid rgba(255, 255, 255, .15);

    display: flex;

    align-items: center;

    gap: 15px;

    flex-wrap: wrap;
}


.rl-mini-stat {

    display: flex;

    align-items: center;

    gap: 10px;
}


.rl-mini-stat strong {

    color: var(--rl-gold);

    font-size: 25px;
}


.rl-mini-stat span {
    color: rgba(255, 255, 255, .65);
    font-size: 12px;
    line-height: 1.4;
    letter-spacing: 1px;
    font-family: 'visby-bold';
}

.rl-mini-arrow {

    color: rgba(255, 255, 255, .3);

    font-size: 20px;
}


/* =========================================================
   BENEFITS
========================================================= */

.rl-benefits {

    background: var(--rl-white);
}


.rl-benefits-heading {

    max-width: 650px;

    margin-bottom: 60px;
}


.rl-benefits-heading h2 {

    color: var(--rl-navy);

    font-size: 50px;

    line-height: 1.08;

    margin: 0;
}


.rl-benefits-list {

    border-top: 1px solid var(--rl-border);
}


.rl-benefit {

    display: grid;

    grid-template-columns: 70px 1fr 30px;

    gap: 30px;

    align-items: start;

    padding: 30px 0;

    border-bottom: 1px solid var(--rl-border);

    transition: .3s ease;
}


.rl-benefit:hover {

    padding-left: 20px;

    padding-right: 20px;

    background: var(--rl-light);
}


.rl-benefit-number {

    color: var(--rl-gold);

    font-size: 11px;

    font-weight: 700;

    padding-top: 5px;
}


.rl-benefit h3 {

    color: var(--rl-navy);

    font-size: 22px;

    margin: 0 0 8px;
}


.rl-benefit p {

    max-width: 700px;

    color: var(--rl-muted);

    font-size: 14px;

    line-height: 1.7;

    margin: 0;
}


.rl-benefit-symbol {

    color: var(--rl-gold);

    font-size: 25px;
}


/* =========================================================
   PROCESS
========================================================= */

.rl-process {
    background: var(--rl-light);
}


.rl-process-heading {

    display: grid;

    grid-template-columns: 1fr .65fr;

    gap: 70px;

    align-items: end;

    margin-bottom: 60px;
}


.rl-process-heading h2 {

    color: var(--rl-navy);

    font-size: 46px;

    line-height: 1.05;

    margin: 0;
}


.rl-process-heading>p {

    color: var(--rl-muted);

    font-size: 15px;

    line-height: 1.8;

    margin: 0;
}


.rl-process-steps {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    border-top: 1px solid var(--rl-border);

    border-bottom: 1px solid var(--rl-border);
}


.rl-step {

    padding: 35px 28px;

    border-right: 1px solid var(--rl-border);
}


.rl-step:first-child {

    padding-left: 0;
}


.rl-step:last-child {

    border-right: 0;
}


.rl-step>span {

    color: var(--rl-gold);

    font-size: 11px;

    font-weight: 700;
}


.rl-step-icon {

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: var(--rl-navy);

    color: var(--rl-white);

    font-size: 18px;

    margin: 30px 0 22px;
}


.rl-step h3 {

    color: var(--rl-navy);

    font-size: 20px;

    line-height: 1.2;

    margin: 0 0 12px;
}


.rl-step p {

    color: var(--rl-muted);

    font-size: 15px;

    line-height: 1.7;

    margin: 0;
}


/* =========================================================
   STORY
========================================================= */

.rl-story {

    background: var(--rl-white);
}


.rl-story-grid {

    display: grid;

    grid-template-columns: 1.2fr .8fr;

    gap: 100px;

    align-items: center;
}


.rl-story-quote h2 {

    color: var(--rl-navy);

    font-size: 58px;

    line-height: 1.05;

    letter-spacing: -1px;

    margin: 0;
}


.rl-story-quote h2 em {

    display: block;

    color: var(--rl-gold);

    font-style: italic;
}


.rl-story-copy {

    padding: 45px;

    background: var(--rl-light);

    border-left: 4px solid var(--rl-gold);
}


.rl-big-mark {

    color: var(--rl-gold);

    font-family: Georgia, serif;

    font-size: 75px;

    line-height: .6;

    margin-bottom: 25px;
}


.rl-story-copy p {

    color: var(--rl-navy);

    font-size: 19px;

    line-height: 1.7;

    margin: 0 0 25px;
}


.rl-story-copy>span {

    color: var(--rl-gold);

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.5px;
}

.reviews-page {
    --rv-navy: #233358;
    --rv-navy-light: #233358;
    --rv-gold: #b88e2f;
    --rv-gold-soft: #b88e2f;
    --rv-cream: #f9f7f4;
    --rv-soft-gray: #eef1f5;
    --rv-white: #ffffff;
    --rv-text: #233358;
    --rv-text-muted: #000;
    --rv-border: #dce2e9;
    --rv-shadow-sm: 0 8px 20px rgba(0, 0, 0, 0.02), 0 4px 12px rgba(0, 0, 0, 0.03);
    --rv-shadow-md: 0 20px 35px -8px rgba(0, 0, 0, 0.08), 0 10px 15px -6px rgba(0, 0, 0, 0.02);
    color: var(--rv-text);
    background: var(--rv-white);
}

.reviews-eyebrow {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--rv-gold);
    margin-bottom: 1rem;
}



/* =========================================
   SUMMARY BAR
========================================= */
.reviews-summary {
    background: #b88e2f;
    /* padding: 2.5rem 0; */
}

.reviews-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    border-radius: 16px;
    overflow: hidden;
}

.reviews-summary-item {
    padding: 2rem 1.5rem;
    text-align: center;
    transition: background 0.25s ease;
}

.reviews-summary-number {
    display: block;
    font-size: 2.2rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.3rem;
}

.reviews-summary-stars {
    color: var(--rv-gold);
    font-size: 1rem;
    letter-spacing: 2px;
    margin-bottom: 0.5rem;
}

.reviews-summary-item p {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.85rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}


/* =========================================
   SECTION HEADING
========================================= */
.reviews-section-heading {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
}

.reviews-section-heading.reviews-center {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.reviews-section-heading h2 {
    font-size: 2.8rem;
    font-weight: 600;
    color: var(--rv-navy);
    margin-bottom: 1rem;
}

.reviews-section-heading p {
    font-size: 1.15rem;
    line-height: 1.7;
    color: var(--rv-text-muted);
}


/* =========================================
   INTRO
========================================= */
.reviews-intro {
    background: var(--rv-white);
}


/* =========================================
   FEATURED REVIEWS
========================================= */
.reviews-featured {
    padding: 2rem 0 6rem;
    background: var(--rv-white);
}

.reviews-featured-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

.reviews-featured-card {
    background: var(--rv-cream);
    border-radius: 24px;
    padding: 2.8rem;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    border: 1px solid rgba(0, 0, 0, 0.02);
    box-shadow: var(--rv-shadow-sm);
    display: flex;
    flex-direction: column;
}

.reviews-featured-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--rv-shadow-md);
}

.reviews-featured-dark {
    background: var(--rv-navy);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.05);
}

.reviews-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.8rem;
}

.reviews-tag {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--rv-navy);
    background: rgba(198, 161, 91, 0.15);
    padding: 0.4rem 1rem;
    border-radius: 40px;
}

.reviews-featured-dark .reviews-tag {
    background: rgba(255, 255, 255, 0.1);
    color: var(--rv-gold-soft);
}

.reviews-big-quote {
    font-family: Georgia, serif;
    font-size: 3.5rem;
    line-height: 1;
    color: var(--rv-gold);
    margin-bottom: 0.5rem;
}

.reviews-featured-card blockquote {
    font-size: 1.35rem;
    line-height: 1.6;
    font-weight: 400;
    margin-bottom: 2rem;
    color: var(--rv-text);
    flex: 1;
}

.reviews-featured-dark blockquote {
    color: rgba(255, 255, 255, 0.95);
}


/* =========================================
   ALL REVIEWS GRID
========================================= */
.reviews-all {
    background: var(--rv-soft-gray);
}

.reviews-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.8rem;
}

.reviews-card {
    background: #fff;
    border-radius: 16px;
    padding: 2rem;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    box-shadow: var(--rv-shadow-sm);
    border: 1px solid rgba(0, 0, 0, 0.02);
    display: flex;
    flex-direction: column;
}

.reviews-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--rv-shadow-md);
}

.reviews-card .reviews-stars {
    font-size: 1.1rem;
    margin-bottom: 1rem;
    color: #b88e2f;
}

.reviews-card>p {
    font-size: 1rem;
    line-height: 1.7;
    color: var(--rv-text-muted);
    margin-bottom: 1.8rem;
    flex: 1;
}

.reviews-card .reviews-avatar {
    width: 2.5rem;
    height: 2.5rem;
    min-width: 2.5rem;
    font-size: 0.9rem;
}

.reviews-card .reviews-author-info strong {
    color: var(--rv-navy);
}


/* =========================================
   EXPERIENCE
========================================= */
.reviews-experience {
    background: var(--rv-white);
}

.reviews-experience-grid {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 4rem;
    align-items: center;
}

.reviews-experience-content h2 {
    font-size: 2.8rem;
    color: var(--rv-navy);
    margin-bottom: 1.5rem;
}

.reviews-experience-content h2 span {
    color: var(--rv-gold);
    display: block;
}

.reviews-experience-content p {
    color: var(--rv-text-muted);
    font-size: 1.05rem;
    line-height: 1.8;
    margin-bottom: 1.2rem;
}

.reviews-experience-stat {
    background: var(--rv-cream);
    border-radius: 24px;
    padding: 3rem;
    border-left: 6px solid var(--rv-gold);
    box-shadow: var(--rv-shadow-sm);
}

.reviews-quote-small {
    font-family: Georgia, serif;
    font-size: 3.5rem;
    line-height: 0.8;
    color: var(--rv-gold);
    opacity: 0.85;
}

.reviews-experience-stat h3 {
    font-size: 1.8rem;
    line-height: 1.3;
    color: var(--rv-navy);
    margin: 1rem 0 1.2rem;
}


/* =========================================
   BUTTONS
========================================= */
.reviews-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.9rem 2.2rem;
    border-radius: 40px;
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
    border: 1px solid transparent;
    cursor: pointer;
    margin-top: 1.5rem;
}

.reviews-btn-gold {
    background: var(--rv-gold);
    color: #fff;
}

.reviews-btn-gold:hover {
    background: var(--rv-navy);
    color: #fff;
}

.reviews-btn-white {
    background: #fff;
    color: var(--rv-navy);
    margin-top: 0;
}

.reviews-btn-white:hover {
    background: var(--rv-gold);
    color: #fff;
}

.reviews-btn-outline-white {
    background: transparent;
    border: 1px solid #fff;
    color: #fff;
    margin-top: 0;
}

.reviews-btn-outline-white:hover {
    background: #fff;
    color: var(--rv-navy);
}

.reviews-avatar {
    width: 3rem;
    height: 3rem;
    min-width: 3rem;
    border-radius: 50%;
    background: var(--rv-gold);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.05rem;
}

.reviews-author {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.reviews-card .reviews-author-info h4 {
    color: var(--rv-navy);
}

.reviews-author-info p {
    display: block;
    font-size: 0.8rem;
    color: inherit;
    /* opacity: 0.65; */
    margin-top: 2px;
    color: #000;
}

.intro-form-wrapper .step-content {
    text-align: left;
}

.read-more-checkbox {
    display: none;
}

/* .testimonial-text-wrapper .testimonial-text {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        transition: all 0.3s ease;
        line-height: 1.6;
        margin-bottom: 0;
    } */

.read-more-checkbox:checked+.testimonial-text {
    -webkit-line-clamp: unset;
    display: block;
    height: 100px !important;
    overflow-y: auto !important;
}

.testimonial-text {
    max-height: 4.8em;
    overflow-y: auto;
    line-height: 1.6;
    padding-right: 8px;
}

/* Chrome, Edge, Safari */
.testimonial-text::-webkit-scrollbar {
    width: 3px;
}

.testimonial-text::-webkit-scrollbar-thumb {
    background-color: #999;
    border-radius: 10px;
}

.testimonial-text::-webkit-scrollbar-track {
    background-color: transparent;
}

.read-more-label {
    color: var(--accent-gold);
    cursor: pointer;
    font-weight: bo;
    font-size: 15px;
    display: inline-block;
    margin-top: 8px;
    margin-bottom: 15px;
    transition: color 0.2s ease;
    text-decoration: none;
    font-family: 'visby-medium';
}

.read-more-label:hover {
    color: var(--accent-gold);
    text-decoration: underline;
}

.read-more-checkbox:checked~.read-more-label::after {
    content: "Read Less";
}

.read-more-checkbox:not(:checked)~.read-more-label::after {
    content: "Read More";
}

.form-section .wpcf7-spinner {
    display: block !important;
    margin: 12px auto 0 !important;
}

.form-section .wpcf7-response-output {
    text-align: center;
    max-width: 590px;
    margin: 0 auto !important;
}

/* Contact Page New */
.cct-contact-page .cct-contact-hero {
    background: #eef1f4;
    border-bottom: 1px solid #e2e6ec
}

.cct-contact-page .cct-contact-hero-inner {
    padding: 65px 30px;
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 65px;
    align-items: center
}

.cct-contact-page .cct-contact-hero h1 {
    font-size: 50px;
    line-height: 1.08;
    text-align: left;
    margin: 18px 0 0
}

.cct-contact-page .cct-contact-hero-inner>p {
    font-size: 22px;
    max-width: 400px;
    color: #233358;
}

.cct-contact-page .cct-contact-layout {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 50px;
    align-items: start;
    max-width: 1180px;
    margin: 0 auto;
}

.cct-contact-page .cct-consent input {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    margin-top: 2px;
}

.cct-contact-page input {
    width: 100%;
    padding: 13px;
    border: 1px solid #acb4bf;
    border-radius: 7px;
    margin-top: 5px;
}

.cct-contact-page form small {
    display: block;
    color: #555;
    margin-top: 15px;
}

.cct-contact-page .cct-note {
    font-size: 12px;
    color: #555;
    margin-top: 14px;
}

.cct-contact-page .cct-btn {
    border: 0;
    border-radius: 40px;
    background: #233358;
    color: white;
    padding: 15px 27px;
    text-decoration: none;
    font-size: 16px;
    margin-top: 15px;
    width: fit-content;
    cursor: pointer !important;
}

.cct-contact-page .cct-contact-sidebar {
    background: #233358;
    color: #fff;
    padding: 35px;
    border-radius: 14px
}

.cct-contact-page .cct-contact-sidebar .cct-eyebrow {
    color: #e8d5a3
}

.cct-contact-page .cct-contact-sidebar h2 {
    font-size: 32px;
    margin-top: 14px;
    color: #fff;
}

.cct-contact-page .cct-contact-sidebar>p {
    font-size: 17px;
    color: #e2e6ec
}

.cct-contact-page .cct-contact-officer {
    border-top: 1px solid #ffffff30;
    padding-top: 24px;
    margin-top: 28px
}

.cct-contact-page .cct-contact-officer>span {
    color: #e8d5a3;
    font-size: 11px;
    letter-spacing: 1px
}

.cct-contact-page .cct-contact-officer h3 {
    font-size: 25px;
    margin-top: 10px;
    color: #fff;
}

.cct-contact-page .cct-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.cct-contact-page input {
    width: 100%;
    padding: 13px;
    border: 1px solid #acb4bf;
    border-radius: 7px;
    margin-top: 5px;
}

.cct-contact-page textarea,
.cct-contact-page select {
    width: 100%;
    font: inherit;
    border: 1px solid #acb4bf;
    border-radius: 7px;
    padding: 13px;
    margin-top: 6px;
    color: #233358;
    background: white;
}

.cct-contact-page label {
    font-size: 14px;
    display: block;
    color: #233358;
}

.cct-contact-page .cct-consent {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 18px;
    font-size: 13px;
}

.cct-contact-page .cct-contact-officer p {
    font-size: 14px;
    color: #e2e6ec;
    margin: 8px 0 15px
}

.cct-contact-page .cct-contact-apply {
    background: none;
    border: 0;
    padding: 0;
    font-size: 16px;
    color: white
}

.cct-contact-page .cct-contact-footnote {
    font-size: 13px;
    color: #e2e6ec;
    border-top: 1px solid #ffffff30;
    margin-top: 26px;
    padding-top: 22px
}

.cct-contact-page .cct-contact-form-panel {
    padding: 10px 0
}

.cct-contact-page .cct-contact-form-panel h2 {
    font-size: 34px;
    margin: 12px 0 15px
}

.cct-contact-page .cct-contact-form-panel>p {
    color: #000;
    font-size: 17px;
    margin-bottom: 25px
}

.cct-contact-page .cct-wide-label {
    margin-top: 18px
}

.cct-contact-page textarea,
.cct-contact-page select {
    width: 100%;
    font: inherit;
    border: 1px solid #acb4bf;
    border-radius: 7px;
    padding: 13px;
    margin-top: 6px;
    color: #233358;
    background: white
}

.cct-contact-page textarea {
    resize: vertical
}

.cct-contact-page .cct-optional {
    color: #777;
    font-size: 12px
}

.cct-contact-page .cct-contact-paths .cct-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 35px;
    padding-top: 45px;
    padding-bottom: 45px
}

.cct-contact-page .cct-contact-paths h2 {
    font-size: 32px;
    margin: 12px 0 0
}

.cct-contact-page .cct-path-links {
    display: flex;
    flex-wrap: wrap;
    gap: 20px
}

.cct-contact-page .cct-path-links a {
    color: #233358;
    text-decoration: none;
    border-bottom: 1px solid #b88e2f;
    padding-bottom: 7px;
    font-family: 'visby-bold';
}

.cct-contact-page .cct-contact-paths>.cct-content {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 45px 30px;
    box-sizing: border-box
}

.cct-contact-page .cct-contact-paths>.cct-content>div {
    min-width: 0
}

.cct-contact-page .cct-contact-paths .cct-path-links {
    justify-content: flex-end
}

.cct-contact-paths {
    background-color: #f4f5f7;
}

/* About Page New */
.cct-about-page * {
    box-sizing: border-box
}

.cct-about-page.cct-about-page {
    margin: 0;
    color: #233358;
    background: white;
    font-family: Visby, sans-serif;
    line-height: 1.5
}


.cct-about-page button,
.cct-about-page a {
    cursor: pointer
}

.cct-about-page h1,
.cct-about-page h2,
.cct-about-page h3,
.cct-about-page p {
    margin: 0
}

.cct-about-page h1 {
    font-size: 58px;
    line-height: 1.05;
    letter-spacing: -1.5px;
    max-width: 850px;
    margin: 16px auto
}

.cct-about-page h2 {
    font-size: 46px;
    line-height: 1.15;
    margin-bottom: 18px
}

.cct-about-page h3 {
    font-size: 23px
}

.cct-about-page p {
    font-size: 18px
}

.cct-about-page header {
    max-width: 1280px;
    margin: auto;
    padding: 25px 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px
}

.cct-about-page header img {
    width: 280px
}

.cct-about-page nav {
    display: flex;
    align-items: center;
    gap: 26px;
    font-size: 14px
}

.cct-about-page nav a {
    color: inherit;
    text-decoration: none
}

.cct-about-page .btn {
    border: 0;
    border-radius: 40px;
    background: #233358;
    color: white;
    padding: 15px 27px;
    text-decoration: none
}

.cct-about-page .outline {
    background: white;
    color: #233358;
    border: 1px solid #233358
}

.cct-about-page .gold {
    background: #b88e2f
}

.cct-about-page .hero {
    text-align: center;
    padding: 44px 30px 0;
    background: linear-gradient(120deg, #eef1f4, white 50%, #eef1f4);
    overflow: hidden
}

.cct-about-page .intro {
    max-width: 680px;
    margin: auto;
    color: #000
}

.cct-about-page .people {
    max-width: 920px;
    margin: 30px auto 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px
}

.cct-about-page .person {
    position: relative;
    padding: 0 28px 24px;
    background: #fff;
    border: 1px solid #e2e6ec;
    border-radius: 18px 18px 0 0;
    overflow: hidden
}

.cct-about-page .portrait {
    height: 290px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    background: linear-gradient(145deg, #fff, #eef1f4);
    margin: 0 -28px 18px;
    overflow: hidden
}

.cct-about-page .portrait img {
    height: 380px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    object-position: top
}

.cct-about-page .person small {
    display: block;
    font-size: 13px;
    margin: 4px 0 16px;
    color: #000
}

.cct-about-page .person .btn {
    width: 100%
}

.cct-about-page .softcta {
    background: #233358;
    color: white;
    text-align: center;
    padding: 23px 20px;
    font-size: 18px
}

.cct-about-page .qualify-btn {
    margin-left: 18px;
    border: 1px solid #fff;
    border-radius: 30px;
    background: transparent;
    color: white;
    padding: 10px 22px;
    font-size: 16px;
}

.cct-about-page .content {
    max-width: 1180px;
    padding: 75px 30px;
    margin: auto
}

.cct-about-page .story {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 80px;
    align-items: center
}

.cct-about-page .story p {
    color: #000
}

.cct-about-page .story aside {
    border-left: 3px solid #b88e2f;
    padding: 12px 30px;
    font-size: 25px;
    font-family: Bold
}

.cct-about-page .center {
    text-align: center
}

.cct-about-page .sub {
    color: #000;
    max-width: 700px;
    margin: 0 auto 30px
}

.cct-about-page .grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px
}

.cct-about-page .loan {
    border: 1px solid #c6ccd5;
    padding: 26px;
    border-radius: 9px
}

.cct-about-page .loan .icon {
    background: #233358;
    color: #fff;
    border-radius: 8px;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    font-size: 22px;
    margin-bottom: 20px
}

.cct-about-page .loan h3 {
    font-size: 18px;
    margin-bottom: 12px
}

.cct-about-page .loan p {
    font-size: 16px;
    color: #000;
    min-height: 112px
}

.cct-about-page .loan a {
    color: #b88e2f;
    font-family: Bold
}

.cct-about-page .tint {
    background: #f4f5f7
}

.cct-about-page .quote {
    max-width: 850px;
    margin: auto;
    background: white;
    padding: 35px;
    border-radius: 16px;
    text-align: left;
    border: 1px solid #e2e6ec
}

.cct-about-page .quote p {
    font-size: 23px
}

.cct-about-page .stars {
    color: #b88e2f;
    letter-spacing: 4px;
    margin-bottom: 12px
}

.cct-about-page .quote small {
    display: block;
    margin-top: 20px
}

.cct-about-page .resources {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 30px
}

.cct-about-page .resources a {
    padding: 22px 15px;
    border-top: 2px solid #b88e2f;
    color: inherit;
    text-decoration: none
}

.cct-about-page .finalcta {
    background: #233358;
    color: white;
    padding: 50px 30px;
    text-align: center
}

.cct-about-page .finalcta p {
    margin-bottom: 24px
}

.cct-about-page .finalcta .btn {
    margin: 0 7px;
    background: white;
    color: #233358;
    font-size: 16px;
}

.cct-about-page .contact {
    max-width: 780px;
    margin: auto
}

.cct-about-page .fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px
}

.cct-about-page label {
    font-size: 14px;
    display: block;
    color: #233358
}

.cct-about-page input {
    width: 100%;
    padding: 13px;
    border: 1px solid #acb4bf;
    border-radius: 7px;
    margin-top: 5px
}

.cct-about-page form .btn {
    margin-top: 20px;
    font-size: 16px;
    width: fit-content;
}

.cct-about-page form small {
    display: block;
    color: #555;
    margin-top: 15px
}

.cct-about-page footer {
    padding: 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #e2e6ec;
    font-size: 12px;
    gap: 35px
}

.cct-about-page footer img {
    width: 250px
}

.cct-about-page footer p {
    font-size: 12px;
    max-width: 650px
}

.cct-about-page dialog {
    border: 0;
    border-radius: 18px;
    padding: 32px;
    max-width: 520px;
    width: calc(100% - 32px);
    color: #233358
}

.cct-about-page dialog::backdrop {
    background: #233358b3
}

.cct-about-page dialog h2 {
    font-size: 28px
}

.cct-about-page .close {
    float: right;
    border: 0;
    background: transparent;
    font-size: 25px
}

.cct-about-page dialog .btn {
    margin-top: 16px
}

.cct-about-page .note {
    font-size: 12px;
    color: #555;
    margin-top: 14px
}

.cct-about-page .success {
    padding: 20px;
    background: #eef1f4;
    border-radius: 8px
}

.cct-about-page .consent {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 18px;
    font-size: 13px
}

.cct-about-page .consent input {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    margin-top: 2px
}

.cct-about-page dialog {
    max-height: 90dvh;
    overflow-y: auto
}

.cct-about-page button:focus-visible,
.cct-about-page a:focus-visible,
.cct-about-page input:focus-visible {
    outline: unset;
}

.cct-about-page.cct-about-page {
    scroll-behavior: smooth
}

.cct-about-page .split-heading {
    text-align: center;
    padding: 34px 24px 32px;
    background: #fff
}

.cct-about-page .split-heading h1 {
    font-size: 56px;
    line-height: 1.02;
    margin: 12px auto 16px
}

.cct-about-page .split-heading p {
    font-size: 19px;
    color: #233358
}

.cct-about-page .split-stage {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 1600px;
    margin: auto
}

.cct-about-page .split-person {
    position: relative;
    isolation: isolate;
    min-height: 445px;
    overflow: hidden
}

.cct-about-page .phil {
    background: #233358;
    color: #fff
}

.cct-about-page .pj {
    background: #d8dfe7;
    color: #233358
}

.cct-about-page .split-person:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 8px;
    background: #b88e2f;
    bottom: 0;
    left: 0;
    z-index: 4
}

.cct-about-page .pj:after {
    background: #233358
}

.cct-about-page .background-name {
    position: absolute;
    top: -30px;
    left: 20px;
    font-family: Heavy;
    font-size: 210px;
    line-height: 1.1;
    letter-spacing: -12px;
    opacity: .075;
    z-index: 0
}

.cct-about-page .pj .background-name {
    left: auto;
    right: 35px;
    font-size: 235px;
    opacity: .065
}

.cct-about-page .graphic-ring {
    position: absolute;
    border: 1px solid #ffffff35;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    right: -95px;
    top: 45px
}

.cct-about-page .graphic-ring:before {
    content: "";
    position: absolute;
    inset: 26px;
    border: 1px solid #ffffff25;
    border-radius: 50%
}

.cct-about-page .pj .graphic-ring {
    border-color: #23335825
}

.cct-about-page .pj .graphic-ring:before {
    border-color: #23335818
}

.cct-about-page .split-photo {
    position: absolute;
    right: -32px;
    bottom: -35px;
    height: 450px;
    width: auto;
    max-width: 64%;
    object-fit: contain;
    object-position: bottom;
    z-index: 1
}

.cct-about-page .pj .split-photo {
    height: 455px;
    right: -32px;
    bottom: -38px
}

.cct-about-page .split-info {
    position: relative;
    z-index: 3;
    padding: 143px 24px 38px 8%;
    max-width: 68%
}

.cct-about-page .split-info .eyebrow {
    font-size: 10px;
    letter-spacing: 1.5px;
    margin-bottom: 13px
}

.cct-about-page .phil .eyebrow {
    color: #e8d5a3
}

.cct-about-page .pj .eyebrow {
    color: #233358
}

.cct-about-page .split-info h2 {
    font-size: 38px;
    line-height: 1.03;
    margin-bottom: 16px
}

.cct-about-page .split-info p {
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 22px
}

.cct-about-page .phil .btn {
    background: #fff;
    color: #233358
}

.cct-about-page .split-info .btn {
    font-size: 15px;
    padding: 13px 22px
}

.cct-about-page .split-info:before {
    content: "";
    position: absolute;
    inset: 100px -25px 0 -20px;
    z-index: -1;
    background: linear-gradient(90deg, #233358 5%, #233358e8 48%, #23335800)
}

.cct-about-page .pj .split-info:before {
    background: linear-gradient(90deg, #d8dfe7 5%, #d8dfe7e8 48%, #d8dfe700)
}

.cct-about-page .bio-jump {
    display: block;
    color: inherit;
    font-size: 13px;
    margin-top: 12px;
    text-decoration: none
}

.cct-about-page .split-person {
    min-height: 475px
}

.cct-about-page .about-story {
    display: grid;
    grid-template-columns: .8fr 1.2fr;
    gap: 85px;
    align-items: start
}

.cct-about-page .about-story h2 {
    font-size: 42px;
    margin-top: 15px
}

.cct-about-page .story-rule {
    width: 70px;
    height: 3px;
    background: #b88e2f;
    margin: 25px 0
}

.cct-about-page .story-pull {
    font-size: 24px;
    max-width: 300px
}

.cct-about-page .story-copy p {
    color: #000;
    margin-bottom: 20px;
    font-size: 18px
}

.cct-about-page .bio-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 25px;
    margin-top: 38px
}

.cct-about-page .bio {
    background: #fff;
    border: 1px solid #e2e6ec;
    border-radius: 14px;
    padding: 35px;
    scroll-margin-top: 25px
}

.cct-about-page .bio-number {
    font-size: 12px;
    letter-spacing: 1.5px;
    color: #b88e2f;
    margin-bottom: 20px
}

.cct-about-page .bio h3 {
    font-size: 30px
}

.cct-about-page .bio-role {
    font-size: 14px;
    margin-top: 9px
}

.cct-about-page .bio-divider {
    height: 1px;
    background: #e2e6ec;
    margin: 24px 0
}

.cct-about-page .bio>p:not(.bio-role) {
    color: #000;
    font-size: 17px;
    line-height: 1.7
}

.cct-about-page .bio-actions {
    margin-top: 25px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px
}

.cct-about-page .text-button {
    border: 0;
    background: none;
    color: #233358;
    font-size: 14px;
    padding: 8px 0
}

.cct-about-page .values {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 35px
}

.cct-about-page .value {
    text-align: left;
    padding: 28px 20px;
    border: 1px solid #e2e6ec;
    border-radius: 10px
}

.cct-about-page .value-icon {
    width: 47px;
    height: 47px;
    background: #233358;
    color: white;
    display: grid;
    place-items: center;
    border-radius: 50%;
    margin-bottom: 22px;
    margin-left: 0;
}

.cct-about-page .value-icon svg {
    width: 22px;
    height: 22px
}

.cct-about-page .value h3 {
    font-size: 18px;
    margin-bottom: 12px
}

.cct-about-page .value p {
    font-size: 16px;
    color: #000
}

.cct-about-page .relationship {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 90px
}

.cct-about-page .relationship-wrap {
    background: #eef1f4;
}

.cct-about-page .relationship h2 {
    margin-top: 14px
}

.cct-about-page .relationship p {
    color: #000
}

.cct-about-page .relationship aside {
    border-left: 2px solid #b88e2f;
    padding-left: 35px;
    align-self: center
}

.cct-about-page .relationship aside h4 {
    font-size: 25px
}

.cct-about-page .relationship aside p {
    font-size: 16px;
    margin: 4px 0 22px
}

.cct-about-page .finalcta h2 {
    color: #fff;
}

.cct-about-page nav [aria-current] {
    color: #b88e2f
}

.cct-about-page .pj .split-info:before {
    display: none !important
}

.cct-about-page .pj .split-photo {
    filter: none !important;
    opacity: 1 !important
}

.cct-about-page .menu-toggle {
    display: none;
    border: 1px solid #e2e6ec;
    background: white;
    color: #233358;
    border-radius: 7px;
    padding: 8px 12px;
    font-family: Bold
}

.cct-about-page .loan-menu {
    position: relative
}

.cct-about-page .loan-menu summary {
    list-style: none;
    cursor: pointer;
    white-space: nowrap
}

.cct-about-page .loan-menu summary::-webkit-details-marker {
    display: none
}

.cct-about-page .nav-dropdown {
    position: absolute;
    top: 32px;
    left: -20px;
    min-width: 205px;
    padding: 10px;
    border: 1px solid #e2e6ec;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 35px #23335820;
    z-index: 50
}

.cct-about-page .nav-dropdown a {
    display: block;
    padding: 12px 15px;
    border-radius: 6px;
    white-space: nowrap
}

.cct-about-page .nav-dropdown a:hover {
    background: #eef1f4
}

.cct-about-page nav a[aria-current="page"] {
    color: #b88e2f
}

.cct-about-page .about-editorial-hero {
    background: #233358;
    color: white;
    overflow: hidden;
    position: relative
}

.cct-about-page .about-editorial-hero:after {
    content: "";
    position: absolute;
    width: 580px;
    height: 580px;
    border: 1px solid #ffffff12;
    border-radius: 50%;
    right: -210px;
    top: -160px;
    pointer-events: none
}

.cct-about-page .about-editorial-inner {
    position: relative;
    z-index: 1;
    max-width: 1208px;
    margin: auto;
    padding: 75px 30px;
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 80px;
    align-items: center
}

.cct-about-page .about-editorial-hero .eyebrow {
    color: #e8d5a3
}

.cct-about-page .about-editorial-hero h1 {
    font-size: 58px;
    line-height: 1.07;
    letter-spacing: -1.5px;
    text-align: left;
    margin: 20px 0 24px
}

.cct-about-page .about-hero-sub {
    font-size: 21px;
    line-height: 1.5
}

.cct-about-page .about-editorial-hero .btn {
    background: white;
    color: #233358;
    margin-top: 28px
}

.cct-about-page .about-hero-story {
    border-left: 1px solid #ffffff30;
    padding: 15px 0 15px 40px
}

.cct-about-page .about-hero-story p {
    font-size: 26px;
    line-height: 1.5;
    margin: 20px 0
}

.cct-about-page .about-hero-rule {
    height: 2px;
    width: 65px;
    background: #b88e2f;
    margin: 25px 0
}

.cct-about-page .about-hero-story>span {
    font-size: 11px;
    letter-spacing: 1.5px
}

.cct-about-page .about-hero-story small {
    display: block;
    font-size: 15px;
    color: #d8dfe7;
    margin-top: 8px
}

.cct-about-page .about-team-portraits {
    scroll-margin-top: 20px
}

.cct-about-page .about-team-portraits .split-stage {
    max-width: 1180px;
    margin: 0 auto
}

.cct-about-page .about-team-portraits .split-person {
    min-height: 475px
}

.cct-about-page .unified-profiles {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 26px;
    margin-top: 36px
}

.cct-about-page .unified-profile {
    background: white;
    border: 1px solid #e2e6ec;
    border-radius: 14px;
    overflow: hidden;
    scroll-margin-top: 25px;
    display: flex;
    flex-direction: column
}

.cct-about-page .unified-profile .split-person {
    min-height: 350px
}

.cct-about-page .unified-profile .split-info {
    padding: 115px 18px 30px 6%;
    max-width: 76%
}

.cct-about-page .unified-profile .split-info h2 {
    font-size: 30px
}

.cct-about-page .unified-profile .split-info:before {
    display: none
}

.cct-about-page .unified-profile .split-info .eyebrow {
    font-size: 9px;
    max-width: 160px
}

.cct-about-page .unified-profile .split-info p {
    font-size: 11px;
    margin-bottom: 0
}

.cct-about-page .unified-profile .split-photo {
    height: 345px;
    right: -30px;
    bottom: -28px;
    max-width: 64%
}

.cct-about-page .unified-profile .pj .split-photo {
    height: 350px;
    right: -25px;
    bottom: -30px
}

.cct-about-page .unified-profile .background-name {
    font-size: 160px;
    top: -18px
}

.cct-about-page .unified-profile .pj .background-name {
    font-size: 180px
}

.cct-about-page .profile-copy {
    padding: 30px;
    flex: 1;
    display: flex;
    flex-direction: column
}

.cct-about-page .profile-copy>p {
    font-size: 17px;
    color: #000;
    line-height: 1.7;
}

.cct-about-page .profile-copy .bio-actions {
    margin-top: auto;
    padding-top: 24px
}

.cct-about-page .unified-profile .graphic-ring {
    width: 330px;
    height: 330px;
    right: -90px;
    top: 30px
}

.cct-about-page .about-simple-heading {
    max-width: 1180px;
    margin: auto;
    padding: 48px 30px 26px;
    text-align: center;
    background: white
}

.cct-about-page .about-simple-heading h1 {
    font-size: 48px;
    line-height: 1.08;
    margin: 17px auto 20px;
    letter-spacing: -1px
}

.cct-about-page .about-simple-heading>p {
    font-size: 20px;
    line-height: 1.55;
    color: #233358
}

.cct-about-page .about-gold-rule {
    width: 65px;
    height: 3px;
    background: #b88e2f;
    margin: 25px auto 0
}

.cct-about-page #meet-team.content {
    padding-top: 18px;
    padding-bottom: 65px
}

.cct-about-page #meet-team .unified-profiles {
    margin-top: 0
}

.cct-about-page>.about-simple-heading+div.tint {
    background: white
}

.cct-about-page.cct-about-page {
    width: 100%;
    max-width: 100%;
    overflow-x: clip
}

.cct-about-page.cct-about-page {
    width: 100%;
    min-width: 0
}

.cct-about-page,
.cct-about-page section,
.cct-about-page article,
.cct-about-page header,
.cct-about-page footer {
    min-width: 0
}

.cct-about-page img {
    max-width: 100%
}

.cct-about-page header nav {
    min-width: 0
}

.cct-about-page .team-integrated.content {
    max-width: 1320px;
    padding: 34px 30px 60px !important
}

.cct-about-page .team-layout {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 32px;
    align-items: start
}

.cct-about-page .about-inline-intro {
    padding: 25px 0 0;
    text-align: left
}

.cct-about-page .about-inline-intro h1 {
    font-size: 42px;
    line-height: 1.12;
    letter-spacing: -.5px;
    margin: 16px 0 20px;
    text-align: left;
    overflow-wrap: normal
}

.cct-about-page .about-inline-intro>p {
    font-size: 18px;
    line-height: 1.6
}

.cct-about-page .about-inline-intro .about-gold-rule {
    margin: 25px 0
}

.cct-about-page .team-layout .unified-profiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    margin: 0
}

.cct-about-page .team-layout .unified-profile {
    min-width: 0
}

.cct-about-page .team-layout .unified-profile .split-person {
    min-height: 0;
    height: 285px
}

.cct-about-page .team-layout .unified-profile .split-photo,
.cct-about-page .team-layout .unified-profile .pj .split-photo {
    height: 340px;
    max-width: 100%;
    width: auto;
    right: 50%;
    transform: translateX(50%);
    bottom: -52px
}

.cct-about-page .team-layout .unified-profile .background-name {
    font-size: 135px;
    letter-spacing: -7px;
    top: 0;
    left: 10px
}

.cct-about-page .team-layout .unified-profile .pj .background-name {
    font-size: 155px;
    right: 10px;
    left: auto
}

.cct-about-page .team-layout .profile-copy {
    padding: 25px
}

.cct-about-page .team-layout .unified-profile .split-info {
    padding: 0;
    max-width: 100%;
    color: #233358;
    position: static;
    margin-bottom: 22px
}

.cct-about-page .team-layout .split-info .eyebrow {
    color: #b88e2f !important;
    max-width: none !important;
    font-size: 9px !important
}

.cct-about-page .team-layout .unified-profile .split-info h2 {
    font-size: 28px;
    margin: 10px 0 12px;
    line-height: 1.1
}

.cct-about-page .team-layout .unified-profile .split-info h2 br {
    display: none
}

.cct-about-page .team-layout .unified-profile .split-info h2 br:after {
    content: " "
}

.cct-about-page .team-layout .split-info h2 {
    white-space: normal
}

.cct-about-page .team-layout .unified-profile .split-info p {
    font-size: 14px;
    margin: 0
}

.cct-about-page .team-layout .profile-copy>p {
    font-size: 16px
}

.cct-about-page .team-layout .bio-actions {
    gap: 12px
}

.cct-about-page .team-layout .bio-actions .btn {
    padding: 12px 18px;
    font-size: 16px
}

.cct-about-page.cct-about-page,
.cct-about-page.cct-about-page {
    max-width: 100%;
    width: 100%;
    overflow-x: clip
}

.cct-about-page .team-layout>* {
    min-width: 0
}

.cct-about-page .unified-profiles>* {
    min-width: 0
}

.cct-about-page .values {
    grid-template-columns: repeat(4, minmax(0, 1fr))
}

.cct-about-page footer p {
    min-width: 0;
    overflow-wrap: anywhere
}

@media (prefers-reduced-motion: reduce) {
    [data-aos] {
        transition: none !important;
        animation: none !important;
    }
}


.legacy-sections.legacy-mobile {
    display: none;
}

.reviews-hero {
    background: #233358;
    color: #fff;
    position: relative;
    overflow: hidden;
}

.review-graphic {
    position: absolute;
    right: 5%;
    top: -80px;
    font-family: Georgia, serif;
    font-size: 650px;
    line-height: 1;
    color: #ffffff09;
    pointer-events: none;
}

.reviews-hero h1 {
    max-width: 1000px;
    margin: 20px 0 24px;
    text-align: left;
    font-size: 60px;
    line-height: 1.08;
    color: #fff;
}

.reviews-hero p {
    max-width: 600px;
    font-size: 20px;
}

.review-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 30px;
}

.reviews-hero .btn {
    background: white;
    color: #233358;
    padding: 12px 30px;
    border-radius: 100px;
    border: 1px solid #233358;
    font-weight: 600;
    font-size: 16px;
}

.reviews-hero .outline {
    background: transparent;
    color: white;
    border-color: #ffffff70;
}

.finalcta {
    background: #233358;
    color: white;
    padding: 50px 30px;
    text-align: center;
}

.finalcta p {
    margin-bottom: 24px;
    font-size: 20px;
}

.finalcta h2 {
    color: #fff;
    font-size: 46px !important;
    margin-bottom: 15px;
}

.finalcta-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

.reviews-bottom h2 {
    margin-top: 13px;
    font-size: 40px;
    margin-bottom: 15px;
}

.reviews-bottom p {
    max-width: 660px;
    color: #000;
    font-size: 18px;
}

.reviews-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
}

/* Refinance page */
.refinance-page h1 {
    font-size: 58px;
    line-height: 1.05;
    letter-spacing: -1.5px;
    max-width: 850px;
    margin: 16px auto
}

.refinance-page h2 {
    font-size: 38px;
    line-height: 1.15;
    margin-bottom: 18px
}

.refinance-page h3 {
    font-size: 23px
}

.refinance-page p {
    font-size: 18px
}

.refinance-page header {
    max-width: 1280px;
    margin: auto;
    padding: 25px 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px
}

.refinance-page header img {
    width: 280px
}

.refinance-page nav {
    display: flex;
    align-items: center;
    gap: 26px;
    font-size: 14px
}

.refinance-page nav a {
    color: inherit;
    text-decoration: none
}



.refinance-page .outline {
    background: white;
    color: #233358;
    border: 1px solid #233358
}

.refinance-page .gold {
    background: #b88e2f
}

.refinance-page .eyebrow {
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #b88e2f
}

.refinance-page .hero {
    text-align: center;
    padding: 44px 30px 0;
    background: linear-gradient(120deg, #eef1f4, white 50%, #eef1f4);
    overflow: hidden
}

.refinance-page .intro {
    max-width: 680px;
    margin: auto;
    color: #000
}

.refinance-page .people {
    max-width: 920px;
    margin: 30px auto 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px
}

.refinance-page .person {
    position: relative;
    padding: 0 28px 24px;
    background: #fff;
    border: 1px solid #e2e6ec;
    border-radius: 18px 18px 0 0;
    overflow: hidden
}

.refinance-page .portrait {
    height: 290px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    background: linear-gradient(145deg, #fff, #eef1f4);
    margin: 0 -28px 18px;
    overflow: hidden
}

.refinance-page .portrait img {
    height: 380px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    object-position: top
}

.refinance-page .person small {
    display: block;
    font-size: 13px;
    margin: 4px 0 16px;
    color: #000
}

.refinance-page .person .btn {
    width: 100%
}

.refinance-page .softcta {
    background: #233358;
    color: white;
    text-align: center;
    padding: 23px 20px;
    font-size: 17px
}

.refinance-page .qualify-btn {
    margin-left: 18px;
    border: 1px solid #fff;
    border-radius: 30px;
    background: transparent;
    color: white;
    padding: 10px 22px;
    font-family: Bold
}

.refinance-page .content {
    max-width: 1180px;
    padding: 75px 30px;
    margin: auto
}

.refinance-page .story {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 80px;
    align-items: center
}

.refinance-page .story p {
    color: #000
}

.refinance-page .story aside {
    border-left: 3px solid #b88e2f;
    padding: 12px 30px;
    font-size: 25px;
    font-family: Bold
}

.refinance-page .center {
    text-align: center
}

.refinance-page .sub {
    color: #000;
    max-width: 700px;
    margin: 0 auto 30px
}

.refinance-page .grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px
}

.refinance-page .loan {
    border: 1px solid #c6ccd5;
    padding: 26px;
    border-radius: 9px
}

.refinance-page .loan .icon {
    background: #233358;
    color: #fff;
    border-radius: 8px;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    font-size: 22px;
    margin-bottom: 20px
}

.refinance-page .loan h3 {
    font-size: 18px;
    margin-bottom: 12px
}

.refinance-page .loan p {
    font-size: 16px;
    color: #000;
    min-height: 112px
}

.refinance-page .loan a {
    color: #b88e2f;
    font-family: Bold
}

.refinance-page .tint {
    background: #f4f5f7
}

.refinance-page .quote {
    max-width: 850px;
    margin: auto;
    background: white;
    padding: 35px;
    border-radius: 16px;
    text-align: left;
    border: 1px solid #e2e6ec
}

.refinance-page .quote p {
    font-size: 23px
}

.refinance-page .stars {
    color: #b88e2f;
    letter-spacing: 4px;
    margin-bottom: 12px
}

.refinance-page .quote small {
    display: block;
    margin-top: 20px
}

.refinance-page .resources {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 30px
}

.refinance-page .resources a {
    padding: 22px 15px;
    border-top: 2px solid #b88e2f;

    color: inherit;
    text-decoration: none
}

.refinance-page .finalcta {
    background: #233358;
    color: white;
    padding: 50px 30px;
    text-align: center
}

.refinance-page .finalcta p {
    margin-bottom: 24px
}

.refinance-page .finalcta .btn {
    margin: 0 7px;
    background: white;
    color: #233358
}

.refinance-page .contact {
    max-width: 780px;
    margin: auto
}

.refinance-page .fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px
}

.refinance-page label {
    font-size: 14px;
    display: block;
    color: #233358
}

.refinance-page input {
    width: 100%;
    padding: 13px;
    border: 1px solid #acb4bf;
    border-radius: 7px;
    margin-top: 5px
}

.refinance-page form .btn {
    margin-top: 20px
}

.refinance-page form small {
    display: block;
    color: #555;
    margin-top: 15px
}

.refinance-page footer {
    padding: 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #e2e6ec;
    font-size: 12px;
    gap: 35px
}

.refinance-page footer img {
    width: 250px
}

.refinance-page footer p {
    font-size: 12px;
    max-width: 650px
}

.refinance-page dialog {
    border: 0;
    border-radius: 18px;
    padding: 32px;
    max-width: 520px;
    width: calc(100% - 32px);
    color: #233358
}

.refinance-page dialog::backdrop {
    background: #233358b3
}

.refinance-page dialog h2 {
    font-size: 28px
}

.refinance-page .close {
    float: right;
    border: 0;
    background: transparent;
    font-size: 25px
}

.refinance-page dialog .btn {
    margin-top: 16px
}

.refinance-page .note {
    font-size: 12px;
    color: #555;
    margin-top: 14px
}

.refinance-page .success {
    padding: 20px;
    background: #eef1f4;
    border-radius: 8px
}

.refinance-page .consent {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 18px;
    font-size: 13px
}

.refinance-page .consent input {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    margin-top: 2px
}

.refinance-page dialog {
    max-height: 90dvh;
    overflow-y: auto
}

.refinance-page button:focus-visible,
.refinance-page a:focus-visible,
.refinance-page input:focus-visible {
    outline: 3px solid #b88e2f;
    outline-offset: 4px
}

.refinance-page {
    scroll-behavior: smooth
}

.refinance-page .split-heading {
    text-align: center;
    padding: 34px 24px 32px;
    background: #fff
}

.refinance-page .split-heading h1 {
    font-size: 56px;
    line-height: 1.02;
    margin: 12px auto 16px
}

.refinance-page .split-heading p {
    font-size: 19px;
    color: #233358
}

.refinance-page .split-stage {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 1600px;
    margin: auto
}

.refinance-page .split-person {
    position: relative;
    isolation: isolate;
    min-height: 445px;
    overflow: hidden
}

.refinance-page .phil {
    background: #233358;
    color: #fff
}

.refinance-page .pj {
    background: #d8dfe7;
    color: #233358
}

.refinance-page .split-person:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 8px;
    background: #b88e2f;
    bottom: 0;
    left: 0;
    z-index: 4
}

.refinance-page .pj:after {
    background: #233358
}

.refinance-page .background-name {
    position: absolute;
    top: -30px;
    left: 20px;
    font-family: Heavy;
    font-size: 210px;
    line-height: 1.1;
    letter-spacing: -12px;
    opacity: .075;
    z-index: 0
}

.refinance-page .pj .background-name {
    left: auto;
    right: 35px;
    font-size: 235px;
    opacity: .065
}

.refinance-page .graphic-ring {
    position: absolute;
    border: 1px solid #ffffff35;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    right: -95px;
    top: 45px
}

.refinance-page .graphic-ring:before {
    content: '';
    position: absolute;
    inset: 26px;
    border: 1px solid #ffffff25;
    border-radius: 50%
}

.refinance-page .pj .graphic-ring {
    border-color: #23335825
}

.refinance-page .pj .graphic-ring:before {
    border-color: #23335818
}

.refinance-page .split-photo {
    position: absolute;
    right: -32px;
    bottom: -35px;
    height: 450px;
    width: auto;
    max-width: 64%;
    object-fit: contain;
    object-position: bottom;
    z-index: 1
}

.refinance-page .pj .split-photo {
    height: 455px;
    right: -32px;
    bottom: -38px
}

.refinance-page .split-info {
    position: relative;
    z-index: 3;
    padding: 143px 24px 38px 8%;
    max-width: 68%
}

.refinance-page .split-info .eyebrow {
    font-size: 10px;
    letter-spacing: 1.5px;
    margin-bottom: 13px
}

.refinance-page .phil .eyebrow {
    color: #e8d5a3
}

.refinance-page .pj .eyebrow {
    color: #233358
}

.refinance-page .split-info h2 {
    font-size: 38px;
    line-height: 1.03;
    margin-bottom: 16px
}

.refinance-page .split-info p {
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 22px
}

.refinance-page .phil .btn {
    background: #fff;
    color: #233358
}

.refinance-page .split-info .btn {
    font-size: 15px;
    padding: 13px 22px
}

.refinance-page .split-info:before {
    content: '';
    position: absolute;
    inset: 100px -25px 0 -20px;
    z-index: -1;
    background: linear-gradient(90deg, #233358 5%, #233358e8 48%, #23335800)
}

.refinance-page .pj .split-info:before {
    background: linear-gradient(90deg, #d8dfe7 5%, #d8dfe7e8 48%, #d8dfe700)
}

.refinance-page .split-heading p {
    max-width: 760px;
    margin: auto
}

.refinance-page .buying-process {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 85px;
    align-items: start
}

.refinance-page .process-intro h2 {
    font-size: 40px;
    margin: 15px 0 24px
}

.refinance-page .process-intro>p {
    color: #000;
    margin-bottom: 25px
}

.refinance-page .process-note {
    font-size: 13px;
    margin-top: 18px;
    color: #555
}

.refinance-page .step {
    display: flex;
    gap: 22px;
    padding: 0 0 30px;
    position: relative
}

.refinance-page .step:before {
    content: '';
    width: 1px;
    position: absolute;
    top: 40px;
    bottom: 0;
    background: #d8dfe7;
    left: 20px
}

.refinance-page .step:last-child:before {
    display: none
}

.refinance-page .step>span {
    display: grid;
    place-items: center;
    width: 41px;
    height: 41px;
    flex-shrink: 0;
    border: 1px solid #b88e2f;
    border-radius: 50%;
    background: #fff;

    font-size: 14px
}

.refinance-page .step h3 {
    font-size: 21px;
    margin: 4px 0 10px
}

.refinance-page .step p {
    color: #000;
    font-size: 17px
}

.refinance-page .purchase-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px
}

.refinance-page .purchase-loan {
    background: #fff;
    border: 1px solid #e2e6ec;
    border-radius: 12px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.refinance-page .purchase-icon {
    background: #233358;
    color: #fff;
    width: 48px;
    height: 48px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    margin-bottom: 21px
}

.refinance-page .purchase-icon svg {
    width: 23px;
    height: 23px
}

.refinance-page .purchase-loan h3 {
    font-size: 22px;
    margin-bottom: 12px
}

.refinance-page .purchase-loan p {
    font-size: 17px;
    color: #000;
    margin-bottom: 22px
}

.refinance-page .learn {
    border: 0;
    background: transparent;
    padding: 0;
    color: #b88e2f;

    font-size: 16px;
    margin-top: auto;
    text-align: left
}

.refinance-page .program-note {
    font-size: 13px;
    color: #555;
    max-width: 850px;
    margin: 28px auto 0;
    text-align: center
}

.refinance-page .eligibility-note {
    font-size: 13px;
    color: #555;
    margin-top: 17px
}

.refinance-page .purchase-hero {
    background: #eef1f4;
    overflow: hidden
}

.refinance-page .purchase-hero-inner {
    max-width: 1280px;
    margin: auto;
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    min-height: 560px
}

.refinance-page .purchase-headline {
    padding: 70px 30px 55px 36px;
    position: relative;
    z-index: 2
}

.refinance-page .purchase-headline .eyebrow {
    font-size: 11px
}

.refinance-page .purchase-headline h1 {
    font-size: 58px;
    text-align: left;
    margin: 22px 0;
    line-height: 1.04
}

.refinance-page .purchase-headline>p {
    max-width: 490px;
    font-size: 20px;
    color: #233358
}

.refinance-page .purchase-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    margin-top: 30px
}

.refinance-page .purchase-hero-actions .btn {
    font-size: 15px
}

.refinance-page .purchase-location {
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-top: 34px
}

.refinance-page .chapter-art {
    position: relative;
    background: #233358;
    overflow: hidden;
    min-height: 560px;
    color: white
}

.refinance-page .art-orbit {
    position: absolute;
    width: 600px;
    height: 600px;
    border: 1px solid #ffffff20;
    border-radius: 50%;
    left: -35px;
    top: -130px
}

.refinance-page .art-orbit.second {
    width: 470px;
    height: 470px;
    left: 30px;
    top: -65px
}

.refinance-page .door-frame {
    position: absolute;
    top: 90px;
    left: 25%;
    width: 210px;
    height: 320px;
    border: 2px solid #b88e2f;
    border-bottom: 0;
    transform: skewY(-10deg);
    background: linear-gradient(120deg, #ffffff04, #ffffff10)
}

.refinance-page .door-line {
    position: absolute;
    top: 16px;
    right: 16px;
    bottom: 0;
    left: 16px;
    border: 1px solid #ffffff35;
    border-bottom: 0
}

.refinance-page .door-knob {
    position: absolute;
    right: 33px;
    top: 170px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #b88e2f
}

.refinance-page .art-floor {
    position: absolute;
    left: 0;
    right: -100px;
    top: 390px;
    border-top: 1px solid #ffffff25;
    transform: rotate(-10deg)
}

.refinance-page .chapter-label {
    position: absolute;
    bottom: 54px;
    left: 40px;
    right: 30px;
    background: #233358;
    padding-top: 20px
}

.refinance-page .chapter-label span {
    display: block;
    letter-spacing: 2px;
    font-size: 10px;
    color: #e8d5a3
}

.refinance-page .chapter-label strong {
    display: block;

    font-size: 29px;
    margin-top: 8px
}

.refinance-page .chapter-label small {
    font-size: 16px
}

.refinance-page .art-index {
    position: absolute;
    right: 25px;
    top: 26px;
    font-size: 11px;
    letter-spacing: 2px;
    color: #e8d5a3
}

.refinance-page .refi-hero {
    background: #eef1f4;
    overflow: hidden
}

.refinance-page .refi-inner {
    display: grid;
    grid-template-columns: 1.2fr 1fr
}

.refinance-page .refi-heading {
    padding: 70px 0px;
}

.your-goals h2 {
    color: #233358 !important;
    font-size: 38px;
    line-height: 1.15;
    max-width: 500px;
}

.refinance-page .refi-heading h1 {
    font-size: 55px;
    line-height: 1.06;
    margin: 22px 0;
    text-align: left;
    letter-spacing: -1.5px
}

.refinance-page .refi-heading>p {
    font-size: 23px;
    max-width: 510px
}

.refinance-page .refi-heading .refi-support {
    font-size: 17px;
    max-width: 470px;
    margin-top: 17px;
    color: #000
}

.refinance-page .refi-art {
    position: relative;
    isolation: isolate;
    background: #233358;
    color: white;
    overflow: hidden;
    min-height: 565px;
    padding: 55px 40px
}

.refinance-page .refi-orbit {
    position: absolute;
    border: 1px solid #ffffff22;
    border-radius: 50%;
    width: 580px;
    height: 580px;
    right: -240px;
    top: -140px;
    z-index: -1
}

.refinance-page .refi-orbit.two {
    width: 450px;
    height: 450px;
    right: -175px;
    top: -75px
}

.refinance-page .refi-orbit.three {
    width: 320px;
    height: 320px;
    right: -110px;
    top: -10px;
    border-color: #b88e2f80
}

.refinance-page .refi-art-title {
    font-size: 11px;
    letter-spacing: 2px;
    color: #e8d5a3
}

.refinance-page .refi-big {
    font-family: Heavy;
    font-size: 59px;
    line-height: 1.12;
    letter-spacing: -1px;
    margin-top: 30px
}

.refinance-page .refi-art-bottom {
    position: absolute;
    bottom: 40px;
    left: 40px;
    right: 30px;
    border-top: 1px solid #b88e2f;
    padding-top: 20px
}

.refinance-page .refi-art-bottom span,
.refinance-page .refi-art-bottom strong {
    display: block
}

.refinance-page .refi-art-bottom span {
    font-size: 14px;
    color: #e8d5a3
}

.refinance-page .refi-art-bottom strong {

    font-size: 20px;
    margin-top: 5px
}

.refi-section-heading {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 65px;
    margin-bottom: 35px;
    align-items: center
}

.refi-section-heading h2 {
    margin: 14px 0 0;
    color: #fff;
}

.refi-section-heading>p {
    color: #000
}

.refinance-page .reason {
    display: grid;
    grid-template-columns: 65px 1fr 1.4fr;
    gap: 25px;
    align-items: start;
    border-top: 1px solid #e2e6ec;
    padding: 28px 0
}

.refinance-page .reason>span {
    font-size: 27px;
    color: #b88e2f;
    font-family: 'visby-extra-bold';
}

.refinance-page .reason h3 {
    font-size: 22px
}

.refinance-page .reason p {
    font-size: 17px;
    color: #000
}

.refinance-page .refi-options {
    background: #233358;
    color: white
}

.refinance-page .refi-options .refi-section-heading>p {
    color: white
}

.refinance-page .refi-options .eyebrow {
    color: #e8d5a3
}

.refinance-page .refi-option-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid #ffffff30
}

.refinance-page .refi-option-grid article {
    padding: 32px 30px 30px 0;
    border-bottom: 1px solid #ffffff30
}

.refinance-page .refi-option-grid article:nth-child(even) {
    padding-left: 35px;
    border-left: 1px solid #ffffff30
}

.refinance-page .refi-option-grid h3 {
    margin: 12px 0;
    font-size: 25px;
    color: #fff;
}

.refinance-page .refi-option-grid p {
    font-size: 17px;
    color: #e2e6ec;
    max-width: 450px;
}

.refinance-page .refi-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    text-align: left;
}

.refinance-page .refi-steps article {
    border-top: 2px solid #b88e2f;
    padding-top: 22px;
}

.refinance-page .refi-steps span {
    font-size: 30px;
    font-family: 'visby-extra-bold';
    color: #233358;
}

.refinance-page .refi-steps h3 {
    font-size: 20px;
    margin: 13px 0;
}

.refinance-page .refi-steps p {
    font-size: 16px;
    color: #000;
}

.refinance-page .refi-check {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
}

.refinance-page .refi-check h2 {
    margin-top: 15px;
}

.refinance-page .refi-check p {
    color: #000;
}

.refinance-page .refi-check aside {
    background: white;
    padding: 32px;
    border: 1px solid #e2e6ec;
    border-radius: 12px;
}

.refinance-page .refi-check aside p {
    margin: 16px 0 24px;
}

.refinance-page .refi-check small {
    display: block;
    font-size: 12px;
    color: #555;
    margin-top: 17px;
}

.refinance-page .refi-art {
    display: flex;
    align-items: center;
    justify-content: center;
}

.refinance-page .refi-symbol {
    width: 82%;
    max-width: 360px;
    height: auto;
    position: relative;
}

.refinance-page .refi-art .refi-orbit {
    opacity: .65;
}

.refinance-page .pj .split-info:before {
    display: none !important;
}

.refinance-page .pj .split-photo {
    filter: none !important;
    opacity: 1 !important;
}

.refinance-page .menu-toggle {
    display: none;
    border: 1px solid #e2e6ec;
    background: white;
    color: #233358;
    border-radius: 7px;
    padding: 8px 12px;

}

.refinance-page .loan-menu {
    position: relative;
}

.refi-check h3 {
    font-size: 26px;
}

.refinance-page .loan-menu summary {
    list-style: none;
    cursor: pointer;
    white-space: nowrap;
}

.refinance-page .loan-menu summary::-webkit-details-marker {
    display: none;
}

.refinance-page .nav-dropdown {
    position: absolute;
    top: 32px;
    left: -20px;
    min-width: 205px;
    padding: 10px;
    border: 1px solid #e2e6ec;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 35px #23335820;
    z-index: 50
}

.refinance-page .nav-dropdown a {
    display: block;
    padding: 12px 15px;
    border-radius: 6px;
    white-space: nowrap
}

.refinance-page .nav-dropdown a:hover {
    background: #eef1f4
}

.refinance-page nav a[aria-current="page"] {
    color: #b88e2f
}

.refinance-page .refi-art.architectural-refi {
    padding: 0;
    position: relative;
    min-height: 565px;
    background: #d8dfe7
}

.refinance-page .architectural-refi img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}

.refinance-page .refi-art.architectural-refi:after {
    content: "";
    position: absolute;
    inset: 0;
    box-shadow: inset 0 -5px 0 #b88e2f;
    pointer-events: none
}

/* Purchase New */


.purchase-page h1 {
    font-size: 58px;
    line-height: 1.05;
    max-width: 850px;
    margin: 16px auto;
}

.purchase-page h2 {
    font-size: 38px;
    line-height: 1.15;
    margin-bottom: 18px;
}

.purchase-page h3 {
    font-size: 23px;
}

.purchase-page p {
    font-size: 18px;
}

.purchase-page header {
    max-width: 1280px;
    margin: auto;
    padding: 25px 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.purchase-page header img {
    width: 280px;
}

.purchase-page nav {
    display: flex;
    align-items: center;
    gap: 26px;
    font-size: 14px;
}

.purchase-page nav a {
    color: inherit;
    text-decoration: none;
}


.purchase-page .gold {
    background: #b88e2f;
}

.purchase-page .hero {
    text-align: center;
    padding: 44px 30px 0;
    background: linear-gradient(120deg, #eef1f4, white 50%, #eef1f4);
    overflow: hidden;
}

.purchase-page .intro {
    max-width: 680px;
    margin: auto;
    color: #000;
}

.purchase-page .people {
    max-width: 920px;
    margin: 30px auto 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}

.purchase-page .person {
    position: relative;
    padding: 0 28px 24px;
    background: #fff;
    border: 1px solid #e2e6ec;
    border-radius: 18px 18px 0 0;
    overflow: hidden;
}

.purchase-page .portrait {
    height: 290px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    background: linear-gradient(145deg, #fff, #eef1f4);
    margin: 0 -28px 18px;
    overflow: hidden;
}

.purchase-page .portrait img {
    height: 380px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    object-position: top;
}

.purchase-page .person small {
    display: block;
    font-size: 13px;
    margin: 4px 0 16px;
    color: #000;
}

.purchase-page .person .btn {
    width: 100%;
}

.purchase-page .softcta {
    background: #233358;
    color: white;
    text-align: center;
    padding: 23px 20px;
    font-size: 18px;
}

.purchase-page .qualify-btn {
    margin-left: 18px;
    border: 1px solid #fff;
    border-radius: 30px;
    background: transparent;
    color: white;
    padding: 10px 22px;
    font-size: 16px;
}

.purchase-page .content {
    max-width: 1180px;
    padding: 75px 30px;
    margin: auto;
}

.purchase-page .story {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 80px;
    align-items: center;
}

.purchase-page .story p {
    color: #000;
}

.purchase-page .story aside {
    border-left: 3px solid #b88e2f;
    padding: 12px 30px;
    font-size: 25px;
}

.purchase-page .center {
    text-align: center;
}

.purchase-page .sub {
    color: #000;
    max-width: 700px;
    margin: 0 auto 30px;
}

.purchase-page .grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.purchase-page .loan {
    border: 1px solid #c6ccd5;
    padding: 26px;
    border-radius: 9px;
}

.purchase-page .loan .icon {
    background: #233358;
    color: #fff;
    border-radius: 8px;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    font-size: 22px;
    margin-bottom: 20px;
}

.purchase-page .loan h3 {
    font-size: 18px;
    margin-bottom: 12px;
}

.purchase-page .loan p {
    font-size: 16px;
    color: #000;
    min-height: 112px;
}

.purchase-page .loan a {
    color: #b88e2f;
}

.purchase-page .tint {
    background: #f4f5f7;
}

.purchase-page .quote {
    max-width: 850px;
    margin: auto;
    background: white;
    padding: 35px;
    border-radius: 16px;
    text-align: left;
    border: 1px solid #e2e6ec;
}

.purchase-page .quote p {
    font-size: 23px;
}

.purchase-page .stars {
    color: #b88e2f;
    letter-spacing: 4px;
    margin-bottom: 12px;
}

.purchase-page .quote small {
    display: block;
    margin-top: 20px;
}

.purchase-page .resources {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 30px;
}

.purchase-page .resources a {
    padding: 22px 15px;
    border-top: 2px solid #b88e2f;
    color: inherit;
    text-decoration: none;
}

.purchase-page .finalcta {
    background: #233358;
    color: white;
    padding: 50px 30px;
    text-align: center;
}

.purchase-page .finalcta p {
    margin-bottom: 24px;
}

.purchase-page .finalcta .btn {
    margin: 0 7px;
    background: white;
    color: #233358;
}

.purchase-page .contact {
    max-width: 780px;
    margin: auto;
}

.purchase-page .fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.purchase-page label {
    font-size: 14px;
    display: block;
    color: #233358;
}

.purchase-page input {
    width: 100%;
    padding: 13px;
    border: 1px solid #acb4bf;
    border-radius: 7px;
    margin-top: 5px;
}

.purchase-page form .btn {
    margin-top: 20px;
}

.purchase-page form small {
    display: block;
    color: #555;
    margin-top: 15px;
}

.purchase-page footer {
    padding: 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #e2e6ec;
    font-size: 12px;
    gap: 35px;
}

.purchase-page footer img {
    width: 250px;
}

.purchase-page footer p {
    font-size: 12px;
    max-width: 650px;
}

.purchase-page dialog {
    border: 0;
    border-radius: 18px;
    padding: 32px;
    max-width: 520px;
    width: calc(100% - 32px);
    color: #233358;
}

.purchase-page dialog::backdrop {
    background: #233358b3;
}

.purchase-page dialog h2 {
    font-size: 28px;
}

.purchase-page .close {
    float: right;
    border: 0;
    background: transparent;
    font-size: 25px;
}

.purchase-page dialog .btn {
    margin-top: 16px;
}

.purchase-page .note {
    font-size: 12px;
    color: #555;
    margin-top: 14px;
}

.purchase-page .success {
    padding: 20px;
    background: #eef1f4;
    border-radius: 8px;
}

.purchase-page .consent {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 18px;
    font-size: 13px;
}

.purchase-page .consent input {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    margin-top: 2px;
}

.purchase-page dialog {
    max-height: 90dvh;
    overflow-y: auto;
}

.purchase-page button:focus-visible,
.purchase-page a:focus-visible,
.purchase-page input:focus-visible {
    outline: 3px solid #b88e2f;
    outline-offset: 4px;
}

.purchase-page .split-heading {
    text-align: center;
    padding: 34px 24px 32px;
    background: #fff;
}

.purchase-page .split-heading h1 {
    font-size: 56px;
    line-height: 1.02;
    margin: 12px auto 16px;
}

.purchase-page .split-heading p {
    font-size: 19px;
    color: #233358;
}

.purchase-page .split-stage {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 1600px;
    margin: auto;
}

.purchase-page .split-person {
    position: relative;
    isolation: isolate;
    min-height: 445px;
    overflow: hidden;
}

.purchase-page .phil {
    background: #233358;
    color: #fff;
}

.purchase-page .pj {
    background: #d8dfe7;
    color: #233358;
}

.purchase-page .split-person:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 8px;
    background: #b88e2f;
    bottom: 0;
    left: 0;
    z-index: 4;
}

.purchase-page .pj:after {
    background: #233358;
}

.purchase-page .background-name {
    position: absolute;
    top: -30px;
    left: 20px;
    font-family: Heavy;
    font-size: 210px;
    line-height: 1.1;
    letter-spacing: -12px;
    opacity: .075;
    z-index: 0;
}

.purchase-page .pj .background-name {
    left: auto;
    right: 35px;
    font-size: 235px;
    opacity: .065;
}

.purchase-page .graphic-ring {
    position: absolute;
    border: 1px solid #ffffff35;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    right: -95px;
    top: 45px;
}

.purchase-page .graphic-ring:before {
    content: '';
    position: absolute;
    inset: 26px;
    border: 1px solid #ffffff25;
    border-radius: 50%;
}

.purchase-page .pj .graphic-ring {
    border-color: #23335825;
}

.purchase-page .pj .graphic-ring:before {
    border-color: #23335818;
}

.purchase-page .split-photo {
    position: absolute;
    right: -32px;
    bottom: -35px;
    height: 450px;
    width: auto;
    max-width: 64%;
    object-fit: contain;
    object-position: bottom;
    z-index: 1;
}

.purchase-page .pj .split-photo {
    height: 455px;
    right: -32px;
    bottom: -38px;
}

.purchase-page .split-info {
    position: relative;
    z-index: 3;
    padding: 143px 24px 38px 8%;
    max-width: 68%;
}

.purchase-page .split-info .eyebrow {
    font-size: 10px;
    letter-spacing: 1.5px;
    margin-bottom: 13px;
}

.purchase-page .phil .eyebrow {
    color: #e8d5a3;
}

.purchase-page .pj .eyebrow {
    color: #233358;
}

.purchase-page .split-info h2 {
    font-size: 38px;
    line-height: 1.03;
    margin-bottom: 16px;
}

.purchase-page .split-info p {
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 22px;
}

.purchase-page .phil .btn {
    background: #fff;
    color: #233358;
}

.purchase-page .split-info .btn {
    font-size: 15px;
    padding: 13px 22px;
}

.purchase-page .split-info:before {
    content: '';
    position: absolute;
    inset: 100px -25px 0 -20px;
    z-index: -1;
    background: linear-gradient(90deg, #233358 5%, #233358e8 48%, #23335800);
}

.purchase-page .pj .split-info:before {
    background: linear-gradient(90deg, #d8dfe7 5%, #d8dfe7e8 48%, #d8dfe700);
}

.purchase-page .split-heading p {
    max-width: 760px;
    margin: auto;
}

.purchase-page .buying-process {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 85px;
    align-items: start;
}

.purchase-page .process-intro h2 {
    font-size: 40px;
    margin: 15px 0 24px;
}

.purchase-page .process-intro>p {
    color: #000;
    margin-bottom: 25px;
}

.purchase-page .process-note {
    font-size: 13px;
    margin-top: 18px;
    color: #555;
}

.purchase-page .step {
    display: flex;
    gap: 22px;
    padding: 0 0 30px;
    position: relative;
}

.purchase-page .step:before {
    content: '';
    width: 1px;
    position: absolute;
    top: 40px;
    bottom: 0;
    background: #d8dfe7;
    left: 20px;
}

.purchase-page .step:last-child:before {
    display: none;
}

.purchase-page .step>span {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    flex-shrink: 0;
    border: 1px solid #b88e2f;
    border-radius: 50%;
    background: #fff;
    font-size: 16px;
    font-family: 'visby-extra-bold';
}

.purchase-page .step h3 {
    font-size: 21px;
    margin: 4px 0 10px;
}

.purchase-page .step p {
    color: #000;
    font-size: 17px;
}

.purchase-page .purchase-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.purchase-page .purchase-loan {
    background: #fff;
    border: 1px solid #e2e6ec;
    border-radius: 12px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.purchase-page .purchase-icon {
    background: #233358;
    color: #fff;
    width: 48px;
    height: 48px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    margin-bottom: 21px;
    font-size: 20px;
}

.purchase-page .purchase-icon svg {
    width: 23px;
    height: 23px;
}

.purchase-page .purchase-loan h3 {
    font-size: 22px;
    margin-bottom: 12px;
}

.purchase-page .purchase-loan p {
    font-size: 17px;
    color: #000;
    margin-bottom: 22px;
}

.purchase-page .learn {
    border: 0;
    background: transparent;
    padding: 0;
    color: #b88e2f;
    font-size: 16px;
    margin-top: auto;
    text-align: left;
}

.purchase-page .program-note {
    font-size: 13px;
    color: #555;
    max-width: 850px;
    margin: 28px auto 0;
    text-align: center;
}

.purchase-page .eligibility-note {
    font-size: 13px;
    color: #555;
    margin-top: 17px;
}

.purchase-page .purchase-hero {
    background: #eef1f4;
    overflow: hidden;
}

.purchase-page .purchase-hero-inner {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    min-height: 560px;
}

.purchase-page .purchase-headline {
    padding: 70px 0;
    position: relative;
    z-index: 2;
}

.purchase-page .purchase-headline .eyebrow {
    font-size: 11px;
}

.purchase-page .purchase-headline h1 {
    font-size: 58px;
    text-align: left;
    margin: 22px 0;
    line-height: 1.04;
}

.purchase-page .purchase-headline>p {
    max-width: 490px;
    font-size: 20px;
    color: #233358;
}

.purchase-page .purchase-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    margin-top: 30px;
}


.purchase-page .purchase-location {
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-top: 34px;
}

.purchase-page .chapter-art {
    position: relative;
    background: #233358;
    overflow: hidden;
    min-height: 560px;
    color: white;
}

.purchase-page .art-orbit {
    position: absolute;
    width: 600px;
    height: 600px;
    border: 1px solid #ffffff20;
    border-radius: 50%;
    left: -35px;
    top: -130px;
}

.purchase-page .art-orbit.second {
    width: 470px;
    height: 470px;
    left: 30px;
    top: -65px;
}

.purchase-page .door-frame {
    position: absolute;
    top: 90px;
    left: 25%;
    width: 210px;
    height: 320px;
    border: 2px solid #b88e2f;
    border-bottom: 0;
    transform: skewY(-10deg);
    background: linear-gradient(120deg, #ffffff04, #ffffff10);
}

.purchase-page .door-line {
    position: absolute;
    top: 16px;
    right: 16px;
    bottom: 0;
    left: 16px;
    border: 1px solid #ffffff35;
    border-bottom: 0;
}

.purchase-page .door-knob {
    position: absolute;
    right: 33px;
    top: 170px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #b88e2f;
}

.purchase-page .art-floor {
    position: absolute;
    left: 0;
    right: -100px;
    top: 390px;
    border-top: 1px solid #ffffff25;
    transform: rotate(-10deg);
}

.purchase-page .chapter-label {
    position: absolute;
    bottom: 54px;
    left: 40px;
    right: 30px;
    background: #233358;
    padding-top: 20px;
}

.purchase-page .chapter-label span {
    display: block;
    letter-spacing: 2px;
    font-size: 10px;
    color: #e8d5a3;
}

.purchase-page .chapter-label strong {
    display: block;
    font-size: 29px;
    margin-top: 8px;
}

.purchase-page .chapter-label small {
    font-size: 16px;
}

.purchase-page .art-index {
    position: absolute;
    right: 25px;
    top: 26px;
    font-size: 11px;
    letter-spacing: 2px;
    color: #e8d5a3;
}

.purchase-page .chapter-art {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #233358;
    padding: 28px;
}

.purchase-page .purchase-artwork {
    width: 100%;
    max-width: 480px;
    height: auto;
    display: block;
}

.purchase-page .chapter-art.modern-entry {
    padding: 0;
    position: relative;
    min-height: 560px;
    background: #d8dfe7;
}

.purchase-page .modern-entry img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.purchase-page .chapter-art.modern-entry:after {
    content: "";
    position: absolute;
    inset: 0;
    box-shadow: inset 0 -5px 0 #b88e2f;
    pointer-events: none;
}

.purchase-page .pj .split-info:before {
    display: none !important;
}

.purchase-page .pj .split-photo {
    filter: none !important;
    opacity: 1 !important;
}

.purchase-page .menu-toggle {
    display: none;
    border: 1px solid #e2e6ec;
    background: white;
    color: #233358;
    border-radius: 7px;
    padding: 8px 12px;
}

.purchase-page .loan-menu {
    position: relative;
}

.purchase-page .loan-menu summary {
    list-style: none;
    cursor: pointer;
    white-space: nowrap;
}

.purchase-page .loan-menu summary::-webkit-details-marker {
    display: none;
}

.purchase-page .nav-dropdown {
    position: absolute;
    top: 32px;
    left: -20px;
    min-width: 205px;
    padding: 10px;
    border: 1px solid #e2e6ec;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 35px #23335820;
    z-index: 50;
}

.purchase-page .nav-dropdown a {
    display: block;
    padding: 12px 15px;
    border-radius: 6px;
    white-space: nowrap;
}

.purchase-page .nav-dropdown a:hover {
    background: #eef1f4;
}

.purchase-page nav a[aria-current="page"] {
    color: #b88e2f;
}


/* Wrapper */
.ccm-loan-officers-wrapper {
    display: flex;
    flex-direction: column;
    gap: 30px;
    max-width: 1000px;
    margin: 0 auto;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* Card */
.ccm-officer-card {
    display: flex;
    background-color: #1a2341;
    color: #fff;
    border-radius: 15px;
    padding: 30px;
    gap: 30px;
    align-items: center;
}

/* Left Side */
.ccm-officer-left {
    flex: 0 0 250px;
    text-align: center;
}

.ccm-officer-img-box {
    position: relative;
    margin-bottom: 20px;
}

.ccm-officer-img-box img {
    width: 100%;
    height: auto;
    border-radius: 150px 150px 0 0;
    display: block;
    object-fit: cover;
    aspect-ratio: 3/4;
}

/* NMLS Badge - Image ke upar overlay */
.ccm-nmls-badge {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(26, 35, 65, 0.9);
    /* Dark blue with opacity */
    color: #fff;
    padding: 6px 18px;
    border-radius: 25px;
    font-size: 12px;
    font-weight: bold;
    white-space: nowrap;
    border: 1px solid rgba(255, 255, 255, 0.2);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.ccm-nmls-badge i {
    font-size: 11px;
    color: #d4af37;
}

.ccm-officer-contact p {
    margin: 5px 0;
    font-size: 14px;
    color: #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.ccm-officer-contact i {
    color: #fff;
}

/* Right Side */
.ccm-officer-right {
    flex: 1;
}

.ccm-officer-subtitle {
    color: #d4af37;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 5px;
    font-weight: 700;
}

.ccm-officer-name {
    font-size: 32px;
    margin: 0 0 5px 0;
    font-weight: 700;
    color: #fff;
}

.ccm-officer-title {
    font-size: 14px;
    color: #ccc;
    margin-bottom: 15px;
    line-height: 1.4;
}

.ccm-officer-socials {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
}

.ccm-officer-socials a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    background-color: #fff;
    color: #1a2341;
    border-radius: 50%;
    text-decoration: none;
    font-size: 16px;
    transition: 0.3s;
}

.ccm-officer-socials a:hover {
    background-color: #d4af37;
    color: #fff;
}

.ccm-officer-desc {
    font-size: 13px;
    line-height: 1.6;
    color: #ddd;
    margin-bottom: 25px;
}

.ccm-officer-buttons {
    display: flex;
    gap: 15px;
}

.ccm-btn-apply,
.ccm-btn-profile {
    padding: 12px 25px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: bold;
    font-size: 13px;
    text-transform: uppercase;
    transition: 0.3s;
}

.ccm-btn-apply {
    background-color: #b89535;
    color: #fff;
}

.ccm-btn-apply:hover {
    background-color: #a07d2a;
}

.ccm-btn-profile {
    background-color: #fff;
    color: #1a2341;
}

.ccm-btn-profile:hover {
    background-color: #eee;
}


/* ===== Eligibility Popup ===== */
.eligibility-popup-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.65);
    z-index: 99999;
    justify-content: center;
    align-items: center;
    padding: 20px;
    overflow-y: auto;
}

.eligibility-popup-overlay.is-active {
    display: flex;
}

.eligibility-popup-box {
    background: #fff;
    border-radius: 18px;
    max-width: 520px;
    width: 100%;
    padding: 30px 25px;
    position: relative;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: popupFadeIn 0.3s ease;
}

.qualify-lead-form .lead-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.qualify-lead-form .lead-row .cf7-row {
    margin-bottom: 15px;
}

@keyframes popupFadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.eligibility-popup-close {
    position: absolute;
    top: 10px;
    right: 15px;
    background: transparent;
    border: none;
    font-size: 28px;
    line-height: 1;
    color: #666;
    cursor: pointer;
}

.eligibility-popup-close:hover {
    color: #000;
}

.eligibility-popup-header {
    margin-bottom: 20px;
    text-align: left;
}

.eligibility-popup-header h3 {
    margin: 0 0 8px;
    font-size: 26px;
}

.eligibility-popup-header p {
    margin: 0;
    font-size: 14px;
}

/* Form styling */
.eligibility-popup-body .lead-row label {
    font-size: 14px;
    display: block;
    color: #233358;
    margin-bottom: 5px;
}

.eligibility-popup-body .qualify-lead-form input {
    width: 100%;
    padding: 13px;
    border: 1px solid #acb4bf;
    border-radius: 7px;
    margin-top: 5px;
    height: 45px;
}

.eligibility-popup-body .qualify-lead-form .cf7-consent label {
    display: flex;
    gap: 10px;
}

.eligibility-popup-body .qualify-lead-form .cf7-consent label input {
    width: unset;
}

.eligibility-popup-body .qualify-lead-form .cf7-consent .wpcf7-list-item {
    margin: 0;
}

.eligibility-popup-body .qualify-lead-form .cf7-consent {
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 15px;
    color: #233358;
}

.eligibility-popup-body .qualify-lead-form input[type="submit"] {
    width: 100%;
    padding: 13px;
    background: #233358;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
}


/* Body lock when popup open */
body.eligibility-popup-open {
    overflow: hidden;
}





.hero-wrap {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    isolation: isolate;
}

/* ---------- BACKGROUND IMAGE ---------- */
.hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: url('https://stage.cuselleration.com/crescenzoteam/wp-content/uploads/2026/10/cross-bg.jpg');
    background-position: center;
    background-repeat: no-repeat;
}

.team-logo img {
    width: 100%;
}

.team-logo {
    max-width: 400px;
    margin: 0 auto 20px;
}

.hero-wrap #hero-title {
    font-size: 60px;
    line-height: 1;
    color: #06111D;
}

/* Light overlay for better text readability */
.hero__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgb(255 255 255 / 93%);
    pointer-events: none;
}

/* ============================================================
   LOGO WATERMARK (background me watermark)
   ============================================================ */
.hero__watermark {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 40%;
    max-width: 1000px;
    height: auto;
    opacity: 0.08;
    /* Watermark transparency */
    z-index: 0;
    /* Above bg, below content */
    pointer-events: none;
    user-select: none;
    filter: grayscale(100%);
    /* Grayscale watermark */
}

/* ============================================================
   LAYOUT
   ============================================================ */
.hero-wrap .container {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
    padding: 72px 0;
}

/* ============================================================
   HEADLINE BLOCK
   ============================================================ */
.hero__content {
    max-width: 860px;
    margin: 0 auto 52px;
    text-align: center;
}

.hero__eyebrow {
    margin: 0 0 16px;
    color: #C9A227;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

.hero h1 {
    margin: 0 0 20px;
    font-size: clamp(2.6rem, 6vw, 5.2rem);
    line-height: 0.96;
    letter-spacing: -0.055em;
    font-weight: 850;
    color: #06111D;
}

.hero__subhead {
    max-width: 620px;
    margin: 0 auto;
    color: #4A5A68;
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    line-height: 1.6;
}

/* ============================================================
   ADVISOR CARDS
   ============================================================ */
.advisors {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.advisor {
    display: grid;
    grid-template-columns: 0.92fr 1.08fr;
    min-height: 340px;
    overflow: hidden;
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(4px);
    color: #0B1F33;
    box-shadow: 0 24px 60px rgba(4, 15, 28, 0.10);
    transition: transform 0.28s ease, box-shadow 0.28s ease;
}

.advisor:hover {
    transform: translateY(-4px);
    box-shadow: 0 34px 74px rgba(4, 15, 28, 0.18);
}

/* --- Photo --- */
.advisor__photo {
    position: relative;
    background: linear-gradient(180deg, #E9EEF3, #D5DEE7);
    overflow: hidden;
}

.advisor__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    aspect-ratio: 4 / 5;
    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.advisor:hover .advisor__photo img {
    transform: scale(1.035);
}

/* Accent bar per advisor */
.advisor__photo::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 5px;
}

/* --- Info --- */
.advisor__info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 38px 34px;
}

.advisor__role {
    margin: 0 0 10px;
    color: #4A5A68;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.advisor__name {
    margin: 0 0 12px;
    font-size: clamp(1.6rem, 2.4vw, 2rem);
    line-height: 1;
    letter-spacing: -0.04em;
    color: #0B1F33;
}

.advisor__bio {
    margin: 0 0 26px;
    color: #4A5A68;
    font-size: 0.96rem;
    line-height: 1.6;
}

.btn__arrow {
    transition: transform 0.25s ease;
}

.btn:hover .btn__arrow {
    transform: translateX(4px);
}


.btn:focus-visible {
    outline: 3px solid rgba(6, 17, 29, 0.4);
    outline-offset: 3px;
}

/* Phil — gold */
.btn--phil {
    background: #C9A227;
    color: #07131F;
    box-shadow: 0 12px 26px rgba(201, 162, 39, 0.30);
}

.btn--phil:hover {
    background: #D6AF33;
    box-shadow: 0 16px 34px rgba(201, 162, 39, 0.40);
}

/* PJ — blue */
.btn--pj {
    background: #123D5C;
    color: #FFFFFF;
    box-shadow: 0 12px 26px rgba(18, 61, 92, 0.28);
}

.btn--pj:hover {
    background: #0E3350;
    box-shadow: 0 16px 34px rgba(18, 61, 92, 0.36);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.cct-contact-info {
    margin-bottom: 20px;
}

.footer-in p {
    font-size: 13px;
    max-width: 650px;
}

/* Home Page New */

@keyframes letterDrift {
    from {
        transform: translateX(1%) scale(1);
    }

    to {
        transform: translateX(-2%) scale(1.035);
    }
}

@keyframes crescenzoReveal {
    from {
        opacity: 0;
        transform: translate3d(10%, 35px, 0) scale(1.08);
    }

    to {
        opacity: .2;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes crescenzoPan {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
        background-position: 0% 50%;
        opacity: .2;
    }

    50% {
        opacity: .32;
    }

    100% {
        transform: translate3d(-9%, 0, 0) scale(1.035);
        background-position: 100% 50%;
        opacity: .22;
    }
}

@keyframes portraitEnter {
    from {
        opacity: 0;
        translate: 0 14px;
    }

    to {
        opacity: 1;
        translate: 0 0;
    }
}

@keyframes copyEnter {
    from {
        opacity: 0;
        translate: 0 10px;
    }

    to {
        opacity: 1;
        translate: 0 0;
    }
}

@keyframes crescenzoGlideRight {
    from {
        transform: translateX(-30%);
    }

    to {
        transform: translateX(8%);
    }
}

.home-page h1 {
    font-size: 58px;
    line-height: 1.05;
    letter-spacing: -1.5px;
    max-width: 850px;
    margin: 16px auto;
}

.home-page h2 {
    font-size: 38px;
    line-height: 1.15;
    margin-bottom: 18px;
}

.home-page h3 {
    font-size: 23px;
}

.home-page p {
    font-size: 18px;
}

.home-page header {
    max-width: 1280px;
    margin: auto;
    padding: 25px 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.home-page header img {
    width: 280px;
}

.home-page nav {
    display: flex;
    align-items: center;
    gap: 26px;
    font-size: 14px;
}

.home-page nav a {
    color: inherit;
    text-decoration: none;
}

.home-page .outline {
    background: white;
    color: #233358;
    border: 1px solid #233358;
}

.home-page .gold {
    background: #b88e2f;
}

.home-page .eyebrow {
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 2px;
    color: #b88e2f;
}

.home-page .hero {
    text-align: center;
    padding: 44px 30px 0;
    background: linear-gradient(120deg, #eef1f4, white 50%, #eef1f4);
    overflow: hidden;
}

.home-page .intro {
    max-width: 680px;
    margin: auto;
    color: #000;
}

.home-page .people {
    max-width: 920px;
    margin: 30px auto 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}

.home-page .person {
    position: relative;
    padding: 0 28px 24px;
    background: #fff;
    border: 1px solid #e2e6ec;
    border-radius: 18px 18px 0 0;
    overflow: hidden;
}

.home-page .portrait {
    height: 290px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    background: linear-gradient(145deg, #fff, #eef1f4);
    margin: 0 -28px 18px;
    overflow: hidden;
}

.home-page .portrait img {
    height: 380px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    object-position: top;
}

.home-page .person small {
    display: block;
    font-size: 13px;
    margin: 4px 0 16px;
    color: #000;
}

.home-page .person .btn {
    width: 100%;
}

.home-page .softcta {
    background: #233358;
    color: white;
    text-align: center;
    padding: 23px 20px;
    font-size: 17px;
}

.home-page .qualify-btn {
    margin-left: 18px;
    border: 1px solid #fff;
    border-radius: 30px;
    background: transparent;
    color: white;
    padding: 10px 22px;
}

.home-page .content {
    max-width: 1180px;
    padding: 75px 30px;
    margin: auto;
}

.home-page .story {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 80px;
    align-items: center;
}

.home-page .story p {
    color: #000;
}

.home-page .story aside {
    border-left: 3px solid #b88e2f;
    padding: 12px 30px;
    font-size: 25px;
}

.home-page .center {
    text-align: center;
}

.home-page .sub {
    color: #000;
    max-width: 700px;
    margin: 0 auto 30px;
}

.home-page .grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.home-page .loan {
    border: 1px solid #c6ccd5;
    padding: 26px;
    border-radius: 9px;
}

.home-page .loan .icon {
    background: #233358;
    color: #fff;
    border-radius: 8px;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    font-size: 22px;
    margin-bottom: 20px;
}

.home-page .loan h3 {
    font-size: 18px;
    margin-bottom: 12px;
}

.home-page .loan p {
    font-size: 16px;
    color: #000;
    min-height: 112px;
}

.home-page .loan a {
    color: #b88e2f;
    font-family: 'visby-bold';
}

.home-page .tint {
    background: #f4f5f7;
}

.home-page .quote {
    max-width: 850px;
    margin: auto;
    background: white;
    padding: 35px;
    border-radius: 16px;
    text-align: left;
    border: 1px solid #e2e6ec;
}

.home-page .quote p {
    font-size: 22px;
    color: #233358;
}

.home-page .stars {
    color: #b88e2f;
    letter-spacing: 4px;
    margin-bottom: 12px;
}

.home-page .quote small {
    display: block;
    margin-top: 20px;
    color: #233358;
}

.home-page .resources {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 30px;
}

.home-page .resources a {
    padding: 22px 15px;
    border-top: 2px solid #b88e2f;
    color: #233358;
    text-decoration: none;
    font-family: 'visby-bold';
    font-size: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.resources p {
    font-size: 18px;
    line-height: 1.2;
    font-family: 'visby-bold';
    text-align: left;
}

.home-page .finalcta {
    background: #233358;
    color: white;
    padding: 50px 30px;
    text-align: center;
}

.home-page .finalcta p {
    margin-bottom: 24px;
}

.home-page .finalcta .btn {
    margin: 0 7px;
    background: white;
    color: #233358;
}

.home-page .contact {
    max-width: 780px;
    margin: auto;
}

.home-page .fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.home-page label {
    font-size: 14px;
    display: block;
    color: #233358;
}

.home-page input {
    width: 100%;
    padding: 13px;
    border: 1px solid #acb4bf;
    border-radius: 7px;
    margin-top: 5px;
}


.home-page form small {
    display: block;
    color: #555;
    margin-top: 15px;
}

.home-page footer {
    padding: 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #e2e6ec;
    font-size: 12px;
    gap: 35px;
}

.home-page footer img {
    width: 250px;
}

.home-page footer p {
    font-size: 12px;
    max-width: 650px;
}

.home-page dialog {
    border: 0;
    border-radius: 18px;
    padding: 32px;
    max-width: 520px;
    width: calc(100% - 32px);
    color: #233358;
}

.home-page dialog::backdrop {
    background: #233358b3;
}

.home-page dialog h2 {
    font-size: 28px;
}

.home-page .close {
    float: right;
    border: 0;
    background: transparent;
    font-size: 25px;
}

.home-page dialog .btn {
    margin-top: 16px;
}

.home-page .note {
    font-size: 12px;
    color: #555;
    margin-top: 14px;
}

.home-page .success {
    padding: 20px;
    background: #eef1f4;
    border-radius: 8px;
}

.home-page .consent {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 18px;
    font-size: 13px;
}

.home-page .consent input {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    margin-top: 2px;
}

.home-page dialog {
    max-height: 90dvh;
    overflow-y: auto;
}

.home-page button:focus-visible,
.home-page a:focus-visible,
.home-page input:focus-visible {
    outline: 3px solid #b88e2f;
    outline-offset: 4px;
}

.home-page .split-heading {
    text-align: center;
    padding: 34px 24px 32px;
    background: #fff;
}

.home-page .split-heading h1 {
    font-size: 56px;
    line-height: 1.02;
    margin: 12px auto 16px;
}

.home-page .split-heading p {
    font-size: 19px;
    color: #233358;
}

.home-page .split-stage {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 1600px;
    margin: auto;
}

.home-page .split-person {
    position: relative;
    isolation: isolate;
    min-height: 445px;
    overflow: hidden;
}

.home-page .phil {
    background: #233358;
    color: #fff;
}

.home-page .pj {
    background: #d8dfe7;
    color: #233358;
}

.home-page .split-person:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 8px;
    background: #b88e2f;
    bottom: 0;
    left: 0;
    z-index: 4;
}

.home-page .pj:after {
    background: #233358;
}

.home-page .background-name {
    position: absolute;
    top: -30px;
    left: 20px;
    font-size: 210px;
    line-height: 1.1;
    letter-spacing: -12px;
    opacity: .075;
    z-index: 0;
}

.home-page .pj .background-name {
    left: auto;
    right: 35px;
    font-size: 235px;
    opacity: .065;
}

.home-page .graphic-ring {
    position: absolute;
    border: 1px solid #ffffff35;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    right: -95px;
    top: 45px;
}

.home-page .graphic-ring:before {
    content: '';
    position: absolute;
    inset: 26px;
    border: 1px solid #ffffff25;
    border-radius: 50%;
}

.home-page .pj .graphic-ring {
    border-color: #23335825;
}

.home-page .pj .graphic-ring:before {
    border-color: #23335818;
}

.home-page .split-photo {
    position: absolute;
    right: -32px;
    bottom: -35px;
    height: 450px;
    width: auto;
    max-width: 64%;
    object-fit: contain;
    object-position: bottom;
    z-index: 1;
}

.home-page .pj .split-photo {
    height: 455px;
    right: -32px;
    bottom: -38px;
}

.home-page .split-info {
    position: relative;
    z-index: 3;
    padding: 143px 24px 38px 8%;
    max-width: 68%;
}

.home-page .split-info .eyebrow {
    font-size: 10px;
    letter-spacing: 1.5px;
    margin-bottom: 13px;
}

.home-page .phil .eyebrow {
    color: #e8d5a3;
}

.home-page .pj .eyebrow {
    color: #233358;
}

.home-page .split-info h2 {
    font-size: 38px;
    line-height: 1.03;
    margin-bottom: 16px;
}

.home-page .split-info p {
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 22px;
}

.home-page .phil .btn {
    background: #fff;
    color: #233358;
}

.home-page .split-info .btn {
    font-size: 15px;
    padding: 13px 22px;
}

.home-page .split-info:before {
    content: '';
    position: absolute;
    inset: 100px -25px 0 -20px;
    z-index: -1;
    background: linear-gradient(90deg, #233358 5%, #233358e8 48%, #23335800);
}

.home-page .pj .split-info:before {
    background: linear-gradient(90deg, #d8dfe7 5%, #d8dfe7e8 48%, #d8dfe700);
}

.home-page .pj .split-info:before {
    display: none !important;
}

.home-page .pj .split-photo {
    filter: none !important;
    opacity: 1 !important;
}

.home-page .menu-toggle {
    display: none;
    border: 1px solid #e2e6ec;
    background: white;
    color: #233358;
    border-radius: 7px;
    padding: 8px 12px;
}

.home-page .loan-menu {
    position: relative;
}

.home-page .loan-menu summary {
    list-style: none;
    cursor: pointer;
    white-space: nowrap;
}

.home-page .loan-menu summary::-webkit-details-marker {
    display: none;
}

.home-page .nav-dropdown {
    position: absolute;
    top: 32px;
    left: -20px;
    min-width: 205px;
    padding: 10px;
    border: 1px solid #e2e6ec;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 35px #23335820;
    z-index: 50;
}

.home-page .nav-dropdown a {
    display: block;
    padding: 12px 15px;
    border-radius: 6px;
    white-space: nowrap;
}

.home-page .nav-dropdown a:hover {
    background: #eef1f4;
}

.home-page nav a[aria-current="page"] {
    color: #b88e2f;
}

.home-page .layered-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: linear-gradient(125deg, #fff 12%, #f4f5f7 60%, #e9edf2);
    color: #233358;
}

.home-page .layered-inner {
    position: relative;
    z-index: 2;
    max-width: 1320px;
    min-height: 670px;
    margin: auto;
    padding: 55px 36px 0;
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    gap: 0;
}

.home-page .layered-copy {
    position: relative;
    z-index: 4;
    padding: 18px 0 65px;
}

.home-page .layered-copy .eyebrow {
    font-size: 10px;
    letter-spacing: 1.7px;
}

.home-page .layered-copy h1 {
    font-size: clamp(49px, 5.25vw, 73px);
    line-height: 1.01;
    letter-spacing: -2px;
    margin: 24px 0;
    max-width: none;
    text-align: left;
}

.home-page .layered-copy h1 span {
    display: block;
}

.home-page .layered-copy>p {
    font-size: 20px;
    line-height: 1.55;
    max-width: 440px;
}

.home-page .hero-inquiry {
    color: #233358;
    border: 0;
    background: none;
    border-bottom: 1px solid #b88e2f;
    padding: 0 0 7px;
    margin-top: 27px;
    font-size: 15px;
}

.home-page .hero-markets {
    font-size: 10px;
    letter-spacing: 1px;
    margin-top: 28px;
}

.home-page .hero-texture {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
    opacity: .075;
    transform: translateX(1%);
    animation: letterDrift 14s ease-in-out infinite alternate;
}

.home-page .hero-texture span {
    display: block;
    font-size: clamp(150px, 28vw, 390px);
    line-height: .85;
    letter-spacing: -.06em;
    color: transparent;
    background-image: linear-gradient(140deg, #233358, #8394ab 50%, #233358);
    background-size: 180% 180%;
    background-clip: text;
    -webkit-background-clip: text;
}

.home-page .hero-texture span:first-child {
    margin-left: -7%;
    margin-top: 50px;
}

.home-page .hero-texture span:last-child {
    text-align: right;
    margin-right: -3%;
    margin-top: 20px;
}

.home-page .leaders-composition {
    position: relative;
    min-width: 0;
    isolation: isolate;
    min-height: 615px;
}

.home-page .leader-halo {
    position: absolute;
    z-index: 0;
    width: 520px;
    height: 520px;
    border: 1px solid #23335815;
    border-radius: 50%;
    top: 25px;
    left: calc(50% - 260px);
}

.home-page .leader-halo:before,
.home-page .leader-halo:after {
    content: '';
    position: absolute;
    border: 1px solid #23335810;
    border-radius: 50%;
    inset: 25px;
}

.home-page .leader-halo:after {
    inset: 55px;
}

.home-page .leader-cutout {
    position: absolute;
    z-index: 2;
    width: auto;
    height: 490px;
    max-width: none;
    object-fit: contain;
    bottom: 125px;
    filter: none;
    opacity: 1;
}

.home-page .phil-cutout {
    height: 470px;
    left: -15px;
    z-index: 1;
}

.home-page .pj-cutout {
    height: 490px;
    right: -18px;
    bottom: 125px;
    z-index: 2;
}

.home-page .leaders-composition:after {
    content: '';
    position: absolute;
    left: -35px;
    right: -50px;
    bottom: 105px;
    height: 95px;
    background: linear-gradient(0deg, #eef1f4, transparent);
    z-index: 3;
    pointer-events: none;
}

.home-page .leader-callout {
    position: absolute;
    z-index: 5;
    bottom: 23px;
    width: 48%;
    text-align: left;
}

.home-page .phil-callout {
    left: 0;
}

.home-page .pj-callout {
    right: -6px;
}

.home-page .callout-rule {
    width: 45px;
    height: 2px;
    background: #b88e2f;
    margin-bottom: 12px;
}

.home-page .leader-callout h2 {
    font-size: 22px;
    line-height: 1.15;
    margin: 0 0 6px;
}

.home-page .leader-callout p {
    font-size: 12px;
    margin: 0 0 14px;
}

.home-page .leader-callout .btn {
    font-size: 14px;
    padding: 12px 22px;
    border-radius: 30px;
}

.home-page .pj-callout .btn {
    background: transparent;
    border: 1px solid #233358;
    color: #233358;
}

.home-page .hero-baseline {
    height: 4px;
    background: linear-gradient(90deg, #b88e2f 0 32%, #233358 32%);
}

.home-page .crescenzo-motion.hero-texture {
    inset: 0;
    opacity: 1;
    animation: none;
    transform: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-page .crescenzo-motion.hero-texture span {
    flex-shrink: 0;
    white-space: nowrap;
    font-size: clamp(160px, 26vw, 380px);
    line-height: 1;
    letter-spacing: -.065em;
    margin: 0 !important;
    color: transparent;
    background-image: linear-gradient(115deg, #23335870 0%, #23335812 30%, #b88e2f55 48%, #23335865 68%, #23335812 100%);
    background-size: 250% 100%;
    background-clip: text;
    -webkit-background-clip: text;
    text-align: center;
    opacity: 0;
    transform: translate3d(10%, 35px, 0) scale(1.08);
    animation: crescenzoReveal 2s cubic-bezier(.2, .7, .2, 1) .15s forwards, crescenzoPan 18s ease-in-out 2.15s infinite alternate;
    background-position: 0% 50%;
}

.home-page .layered-copy h1 {
    position: relative;
    z-index: 1;
}

.home-page .layered-copy>p {
    position: relative;
    z-index: 1;
}

.home-page .layered-hero {
    background: linear-gradient(120deg, #fff 6%, #f4f5f7 57%, #e9edf2);
}

.home-page .leader-cutout {
    animation: portraitEnter 1.1s ease-out both;
}

.home-page .pj-cutout {
    animation-delay: .12s;
}

.home-page .layered-copy {
    animation: copyEnter .9s ease-out both;
}

.home-page .motion-control {
    position: absolute;
    z-index: 8;
    right: 22px;
    top: 17px;
    border: 1px solid #23335835;
    background: #ffffffb8;
    color: #233358;
    border-radius: 20px;
    padding: 5px 11px;
    font-family: Visby;
    font-size: 11px;
}

.home-page .layered-hero.motion-paused .crescenzo-motion span {
    animation-play-state: paused;
}

.home-page .layered-hero.motion-paused .leader-cutout,
.home-page .layered-hero.motion-paused .layered-copy {
    animation-play-state: paused;
}

.home-page .diagonal-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: #eef1f4;
    color: #233358;
}

.home-page .diagonal-shape {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.home-page .left-shape {
    background: #233358;
    clip-path: polygon(0 0, 39% 0, 22% 100%, 0 100%);
}

.home-page .left-shape:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #b88e2f;
    clip-path: polygon(38.6% 0, 39% 0, 22.4% 100%, 22% 100%);
}

.home-page .right-shape {
    background: linear-gradient(125deg, #fff 25%, #d8dfe7);
    clip-path: polygon(40% 0, 100% 0, 100% 100%, 23% 100%);
}

.home-page .right-shape:after {
    content: '';
    position: absolute;
    inset: 0;
    background: #233358;
    clip-path: polygon(99% 35%, 100% 33%, 100% 100%, 64% 100%);
}

.home-page .diagonal-word {
    position: absolute;
    z-index: 1;
    top: 20px;
    left: 0;
    white-space: nowrap;
    font-size: clamp(180px, 24vw, 380px);
    line-height: 1;
    letter-spacing: -.065em;
    color: #ffffff16;
    -webkit-text-stroke: 1px #23335824;
    pointer-events: none;
    animation: crescenzoGlideRight 16s cubic-bezier(.2, .45, .3, 1) both;
    will-change: transform;
    font-family: 'visby-bold';
}

.home-page .diagonal-stage {
    position: relative;
    max-width: 1520px;
    height: 650px;
    margin: auto;
    isolation: isolate;
}

.home-page .diagonal-portrait {
    position: absolute;
    z-index: 3;
    width: auto;
    max-width: none;
    object-fit: contain;
    bottom: -78px;
    pointer-events: none;
    filter: none;
    opacity: 1;
}

.home-page .diagonal-phil {
    height: 650px;
    left: -40px;
}

.home-page .diagonal-pj {
    height: 650px;
    right: -50px;
    bottom: -65px;
}

.home-page .diagonal-message {
    position: relative;
    z-index: 4;
    width: 43%;
    margin: auto;
    padding-top: 110px;
    padding-left: 12px;
}

.home-page .diagonal-message .eyebrow {
    font-size: 10px;
    letter-spacing: 1.8px;
    margin-left: 8px;
}

.home-page .diagonal-message h1 {
    font-size: clamp(58px, 6.2vw, 88px);
    line-height: .98;
    letter-spacing: -2.5px;
    text-align: left;
    margin: 16px 0 23px;
    max-width: none;
}

.home-page .diagonal-message h1 span {
    color: #b88e2f;
    white-space: nowrap;
}

.home-page .diagonal-message>p {
    font-size: 20px;
    line-height: 1.45;
    margin-left: 9px;
}

.home-page .diagonal-gold-rule {
    width: 70px;
    height: 3px;
    background: #b88e2f;
    margin: 23px 0 14px 9px;
}

.home-page .diagonal-inquiry {
    font-size: 13px;
    color: #233358;
    border: 0;
    background: none;
    padding: 0;
    margin-left: 9px;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 2px;
}

.home-page .diagonal-person-label {
    position: absolute;
    z-index: 5;
    bottom: 65px;
    min-width: 230px;
}

.home-page .label-phil {
    left: 40px;
    color: #fff;
}

.home-page .label-pj {
    right: 38px;
    color: #233358;
}

.home-page .diagonal-person-label h2 {
    font-size: 23px;
    line-height: 1.2;
    margin: 0 0 10px;
    color: #fff;
}

.home-page .diagonal-label-rule {
    width: 38px;
    height: 3px;
    background: #b88e2f;
    margin-bottom: 13px;
}

.home-page .diagonal-person-label .btn {
    background: #b88e2f;
    color: #fff;
    padding: 15px 22px;
    border-radius: 4px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    text-transform: uppercase;
    letter-spacing: .4px;
    min-width: 225px;
}

.home-page .diagonal-person-label .btn span {
    font-size: 20px;
    line-height: 1;
}

.home-page .diagonal-person-label>p {
    font-size: 10px;
    margin-top: 10px;
}

.home-page .label-pj>p {
    background: #ffffffc9;
    display: inline-block;
    padding: 2px 5px;
    border-radius: 3px;
}

.home-page .diagonal-motion-control {
    position: absolute;
    right: 20px;
    top: 13px;
    z-index: 8;
    font-family: Visby;
    font-size: 10px;
    padding: 4px 10px;
    border: 1px solid #23335825;
    border-radius: 20px;
    background: #ffffffb8;
    color: #233358;
}

.home-page .diagonal-hero.motion-paused .diagonal-word {
    animation-play-state: paused;
}

.home-page .diagonal-message h1 {
    position: relative;
    z-index: 6;
    -webkit-text-stroke: 1.25px #eef1f4;
    paint-order: stroke fill;
    text-shadow: 0 1px 0 #eef1f4;
}

.home-page .label-pj h2 {
    display: table;
    color: #233358;
    background: rgba(255, 255, 255, .96);
    padding: 7px 12px;
    border-radius: 4px;
    box-shadow: 0 2px 12px #23335812;
}

.home-page .label-pj h2,
.home-page .label-pj>p {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    color: #233358;
    -webkit-text-stroke: .85px #fff;
    paint-order: stroke fill;
    text-shadow: 0 0 1px #fff;
}

.home-page .label-pj>p {
    -webkit-text-stroke: .65px #fff;
}

.home-page .diagonal-message {
    padding-top: 105px;
}

.home-page .diagonal-message h1 {
    font-size: clamp(68px, 7.15vw, 104px);
    line-height: 1.02;
    margin-bottom: 26px;
}

.home-page .story h4 {
    line-height: 1.4;
    margin-bottom: 20px;
}

@media (prefers-reduced-motion:reduce) {
    .home-page .hero-texture {
        animation: none;
    }

    .home-page .crescenzo-motion.hero-texture span {
        animation: none;
        opacity: .22;
        transform: none;
        background-position: 45% 50%;
    }

    .home-page .leader-cutout,
    .home-page .layered-copy {
        animation: none !important;
    }

    .home-page .motion-control {
        display: none;
    }

    .home-page .diagonal-word {
        animation: none;
        transform: translateX(-5%);
    }

    .home-page .diagonal-motion-control {
        display: none;
    }
}

input:focus-visible,
textarea:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}


.apply-demo-header .btn-header {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 28px;
    background: #25365e;
    color: #ffffff;
    border: none;
    border-radius: 40px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.3s ease;
}

.apply-demo-header .btn-header:hover {
    background: #3b507c;
}

/* Popup Overlay */
.apply-popup-overlay {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(35, 49, 79, 0.70);
    z-index: 999999;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    box-sizing: border-box;
}

.apply-popup-overlay.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* Popup Box */
.apply-popup-overlay .apply-popup-box {
    position: relative;
    width: 100%;
    max-width: 520px;
    padding: 29px 32px 32px;
    background: #ffffff;
    border-radius: 19px;
    box-sizing: border-box;
    transform: translateY(15px);
    transition: transform 0.3s ease;
}

.apply-popup-overlay.is-open .apply-popup-box {
    transform: translateY(0);
}

/* Popup Heading */
.apply-popup-overlay .apply-popup-box h2 {
    margin: 0 25px 19px 0;
    color: #26375e;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.15;
}

/* Popup Description */
.apply-popup-overlay .apply-popup-box p {
    margin: 0 0 22px;
    color: #34466d;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
}

/* Close Button */
.apply-popup-overlay .apply-popup-close {
    position: absolute;
    top: 10px;
    right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    padding: 0;
    border: none;
    background: transparent;
    color: #25365e;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    border: 1px solid #25365e;
    border-radius: 100px;
}

/* Action Buttons */
.apply-popup-overlay .apply-popup-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 25px;
}

.apply-popup-overlay .apply-popup-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 27px;
    border: none;
    border-radius: 40px;
    background: #25365e;
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    text-align: center;
    box-sizing: border-box;
    transition: background 0.25s ease;
}

.apply-popup-overlay .apply-popup-btn:hover {
    background: #b88e2f;
    color: #ffffff;
}



.read-more-checkbox {
    display: none;
}

.testimonial-text-wrapper .testimonial-text,
.reviews-text-wrapper p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: all 0.3s ease;
    line-height: 1.6;
}

.read-more-checkbox:checked+p {
    -webkit-line-clamp: unset;
    display: block;
}


.read-more-checkbox:checked+p+.read-more-label::after {
    content: "Read Less";
}

.read-more-checkbox:not(:checked)+p+.read-more-label::after {
    content: "Read More";
}


/* Hide on desktop and tablet */
.mb-cres-hero {
    display: none;
}


.pc-baddges-section .pc-container-calender {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 15px;
}

.pc-baddges-section .calc-head h2 {
    font-size: 32px;
}

.pc-baddges-section .calc-head {
    text-align: center;
    margin-bottom: 40px;
}

.pc-baddges-section .calc-title {
    margin: 0;
    font-size: clamp(28px, 4.2vw, 46px);
    line-height: 1.08;
    letter-spacing: -.035em;
    font-weight: 700;
    color: #0a1f36;
}

/* ---------- Card grid ---------- */
.pc-baddges-section .calc-card {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: clamp(16px, 2vw, 22px);
    align-items: stretch;
}

.pc-baddges-section .panel {
    border-radius: 26px;
    position: relative;
}

.pc-baddges-section .panel--inputs {
    background: #fff;
    border: 1px solid #e4eef5;
    padding: clamp(22px, 3vw, 34px);
    box-shadow:
        0 1px 2px rgba(10, 31, 54, .04),
        0 30px 70px -46px rgba(10, 31, 54, .45);
}

/* ---------- Fields ---------- */
.pc-baddges-section .field+.field {
    margin-top: 24px;
}

.pc-baddges-section .field-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 12px;
}

.pc-baddges-section .field-label {
    font-size: 14px;
    color: #233358;
    letter-spacing: .01em;
    font-family: 'visby-bold';
}

.pc-baddges-section .field-value {
    font-size: 15px;
    font-weight: 700;
    color: #0a1f36;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.pc-baddges-section .field-value .sub {
    font-size: 12px;
    font-weight: 500;
    color: #94a4b0;
    margin-left: 2px;
}

/* ---------- Custom range slider ---------- */
.pc-baddges-section .range {
    --fill: 50%;
    -webkit-appearance: none;
    appearance: none;
    display: block;
    width: 100%;
    height: 8px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    background-image: linear-gradient(to right, #233358 0%, #233358 var(--fill), #e7eff5 var(--fill), #e7eff5 100%);
    /* background-size: 100% 8px; */
    background-position: center;
    background-repeat: no-repeat;
    outline: none;
    border-radius: 100px;
}

.pc-baddges-section .range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid #2aa8d8;
    box-shadow: 0 2px 8px rgba(10, 31, 54, .22);
    transition: transform .15s ease, box-shadow .15s ease;
    cursor: grab;
}

.pc-baddges-section .range:hover::-webkit-slider-thumb {
    transform: scale(1.08);
}

.pc-baddges-section .range:active::-webkit-slider-thumb {
    transform: scale(1.14);
    cursor: grabbing;
    box-shadow: 0 0 0 8px rgba(91, 194, 231, .18), 0 2px 10px rgba(10, 31, 54, .3);
}

.pc-baddges-section .range:focus-visible::-webkit-slider-thumb {
    box-shadow: 0 0 0 6px rgba(91, 194, 231, .35);
}

.pc-baddges-section .range::-moz-range-thumb {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid #2aa8d8;
    box-shadow: 0 2px 8px rgba(10, 31, 54, .22);
    cursor: grab;
}

.pc-baddges-section .range::-moz-range-track {
    height: 8px;
    border-radius: 999px;
    background: transparent;
}

.pc-baddges-section .range::-moz-focus-outer {
    border: 0;
}

/* ---------- Segmented term control ---------- */
.pc-baddges-section .segmented {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
    padding: 5px;
    margin: 28px 0 4px;
    background: #eff5f9;
    border-radius: 15px;
}

.pc-baddges-section .segmented button {
    padding: 12px 4px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #5b6b78;
    font: 600 13px/1 inherit;
    letter-spacing: .01em;
    cursor: pointer;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}

.pc-baddges-section .segmented button:hover {
    background: rgba(255, 255, 255, .75);
    color: #0a1f36;
}

.pc-baddges-section .segmented button[aria-pressed="true"] {
    background: #233358;
    color: #fff;
    box-shadow: 0 8px 18px -10px rgba(10, 31, 54, .9);
}

.pc-baddges-section .segmented button:focus-visible {
    outline: 2px solid #2aa8d8;
    outline-offset: 2px;
}

/* ---------- Result panel ---------- */
.pc-baddges-section .panel--result {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
    padding: clamp(24px, 3vw, 36px);
    color: #fff;
    background-color: #233358;
    box-shadow: 0 1px 2px rgba(7, 22, 36, .3),
        0 40px 80px -46px rgba(7, 22, 36, .95);
}

.pc-baddges-section .result-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.pc-baddges-section .result-label {
    font-size: 13px;
    letter-spacing: .01em;
}

.pc-baddges-section .chip {
    font-size: 11px;
    font-weight: 600;
    padding: 5px 11px;
    border-radius: 999px;
    color: #b88e2f;
    background: rgb(255 255 255);
    border: 1px solid rgb(255 255 255);
    white-space: nowrap;
}

.pc-baddges-section .estimate-amt {
    margin: 14px 0 0;
    font-size: clamp(46px, 7.5vw, 70px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.045em;
    color: #fff;
}

.pc-baddges-section .breakdown {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 28px 0 0;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, .12);
}

.pc-baddges-section .stat {
    padding: 14px 16px;
    border-radius: 15px;
    background: rgba(255, 255, 255, .055);
    border: 1px solid rgba(255, 255, 255, .10);
}

.pc-baddges-section .stat dt {
    margin: 0 0 6px;
    font-size: 11px;
    letter-spacing: .03em;
}

.pc-baddges-section .stat dd {
    margin: 0;
    font-size: 20px;
    color: #fff;
    font-family: 'visby-bold';
}

.pc-baddges-section .disclaimer {
    margin: 24px 0 0;
    font-size: 11px;
    line-height: 1.62;
}

.form-wrapper form .btn {
    margin-top: 20px;
    font-size: 16px;
    border: 0;
    border-radius: 40px;
    background: #233358;
    color: white;
    padding: 15px 27px;
    text-decoration: none;
    width: fit-content;
    cursor: pointer !important;
}

/* New hero Banner start */
.refi-hero {
    background: #eef1f4;
    overflow: hidden;
}

.refi-hero .refi-inner {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
}

.refi-hero .refi-heading {
    padding: 70px 20px;
}

.refi-hero .refi-art.architectural-refi {
    padding: 0;
    position: relative;
    min-height: 565px;
    background: #d8dfe7;
}

.refi-hero .refi-art {
    display: flex;
    align-items: center;
    justify-content: center;
}

.refi-hero .refi-heading h1 {
    font-size: 55px;
    line-height: 1.06;
    margin: 22px 0;
    text-align: left;
    letter-spacing: -1.5px;
}

.refi-hero .refi-heading .refi-support {
    font-size: 17px;
    max-width: 470px;
    margin-top: 17px;
    color: #000;
}

.refi-hero .purchase-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    margin-top: 30px;
}

.refi-hero .purchase-location {
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-top: 34px;
}

.refi-hero .architectural-refi img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.refi-hero .refi-art.architectural-refi:after {
    content: "";
    position: absolute;
    inset: 0;
    box-shadow: inset 0 -5px 0 #b88e2f;
    pointer-events: none;
}

/* New hero Banner end */

.loan-options-wrap {
    background: #f4f5f7;
}

.loan-options-wrap h2 {
    font-size: 38px;
    line-height: 1.15;
    margin-bottom: 18px;
}

.loan-options-wrap .sub {
    color: #000;
    max-width: 700px;
    margin: 0 auto 30px;
}

.loan-options-wrap .purchase-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.loan-options-wrap .program-note {
    font-size: 13px;
    color: #555;
    max-width: 850px;
    margin: 28px auto 0;
    text-align: center;
}

.loan-options-wrap .purchase-loan {
    background: #fff;
    border: 1px solid #e2e6ec;
    border-radius: 12px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.loan-options-wrap .purchase-icon {
    background: #233358;
    color: #fff;
    width: 48px;
    height: 48px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    margin-bottom: 21px;
    font-size: 20px;
}

.loan-options-wrap .purchase-loan h3 {
    font-size: 22px;
    margin-bottom: 12px;
}

.loan-options-wrap .purchase-loan p {
    font-size: 17px;
    color: #000;
    margin-bottom: 22px;
}

.loan-options-wrap .learn {
    border: 0;
    background: transparent;
    padding: 0;
    color: #b88e2f;
    font-size: 16px;
    margin-top: auto;
    text-align: left;
}

.loan-options-wrap .center {
    text-align: center;
}

.your-goals .reason {
    display: grid;
    grid-template-columns: 65px 1fr 1.4fr;
    gap: 25px;
    align-items: start;
    border-top: 1px solid #e2e6ec;
    padding: 28px 0;
}

.your-goals .reason>span {
    font-size: 27px;
    color: #b88e2f;
    font-family: 'visby-extra-bold';
}

.your-goals .reason h3 {
    font-size: 22px;
}

.your-goals .reason p {
    font-size: 17px;
    color: #000;
}

.refi-options {
    background: #233358;
    color: #fff;
}

.refi-options .content {
    max-width: 1180px;
    padding: 75px 30px;
    margin: auto;
}

.refi-options .refi-section-heading {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 65px;
    margin-bottom: 35px;
    align-items: center;
}

.refi-options .refi-option-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid #ffffff30;
}

.refi-options .refi-option-grid article {
    padding: 32px 30px 30px 0;
    border-bottom: 1px solid #ffffff30;
}

.refi-options .refi-option-grid article:nth-child(even) {
    padding-left: 35px;
    border-left: 1px solid #ffffff30;
}

.refi-options .eyebrow {
    color: #e8d5a3;
}

.refi-options .refi-option-grid h3 {
    margin: 12px 0;
    font-size: 25px;
    color: #fff;
}

.refi-options .refi-option-grid p {
    font-size: 17px;
    color: #e2e6ec;
    max-width: 450px;
}

.refi-options .refi-options .eyebrow {
    color: #e8d5a3;
}

.refi-section-heading h2 {
    margin: 14px 0 0;
    color: #fff;
    font-size: 38px;
    line-height: 1.15;
}

.refi-options .refi-section-heading>p {
    color: #e2e6ec;
}

.fha-loan-page .fha-loan-difference {
    background: #f4f5f7;
}

.buying-wrapper .buying-process {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 85px;
    align-items: start;
}

.buying-wrapper .process-intro h2 {
    font-size: 40px;
    margin: 15px 0 24px;
}

.buying-wrapper .process-intro>p {
    color: #000;
    margin-bottom: 25px;
}

.buying-wrapper .step {
    display: flex;
    gap: 22px;
    padding: 0 0 30px;
    position: relative;
}

.buying-wrapper .step:before {
    content: '';
    width: 1px;
    position: absolute;
    top: 40px;
    bottom: 0;
    background: #d8dfe7;
    left: 20px;
}

.buying-wrapper .step>span {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    flex-shrink: 0;
    border: 1px solid #b88e2f;
    border-radius: 50%;
    background: #fff;
    font-size: 16px;
    font-family: 'visby-extra-bold';
}

.buying-wrapper .step h3 {
    font-size: 20px;
    margin: 4px 0 10px;
}

.buying-wrapper .step p {
    color: #000;
    font-size: 17px;
}

/* Eligibility Popup */
#eligibility-popup .eligibility-popup-box {
    position: relative;
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    overflow-y: auto;
    background: #fff;
    border-radius: 16px;
    padding: 28px;
    box-sizing: border-box;
}

#eligibility-popup .eligibility-popup-header h3 {
    margin: 0 30px 16px 0;
    color: #26345f;
    font-size: 28px;
    line-height: 1.25;
    font-weight: 700;
}

#eligibility-popup .eligibility-popup-header p {
    margin: 0 0 24px;
    color: #26345f;
    font-size: 16px;
    line-height: 1.6;
}

/* Two-column fields */
#eligibility-popup .fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 18px;
}

#eligibility-popup .fields label {
    display: block;
    min-width: 0;
    margin: 0;
    color: #26345f;
    font-size: 14px;
    line-height: 1.5;
}

#eligibility-popup .fields .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
    margin-top: 7px;
}

#eligibility-popup .fields input.wpcf7-form-control {
    display: block;
    width: 100%;
    height: 49px;
    padding: 10px 12px;
    border: 1px solid #b8bfd0;
    border-radius: 7px;
    background: #fff;
    color: #26345f;
    font-size: 16px;
    box-sizing: border-box;
    box-shadow: none;
}

#eligibility-popup .fields input.wpcf7-form-control:focus {
    border-color: #26345f;
    outline: 2px solid rgba(38, 52, 95, 0.12);
    outline-offset: 1px;
}

/* Consent checkbox */
#eligibility-popup .consent {
    margin: 0 0 16px;
    color: #26345f;
    font-size: 13px;
    line-height: 1.6;
    display: flex;
    gap: 10px;
}

#eligibility-popup .consent .wpcf7-acceptance,
#eligibility-popup .consent .wpcf7-list-item,
#eligibility-popup .consent .wpcf7-list-item label {
    display: block;
    margin: 0;
    width: 100%;
}

#eligibility-popup .consent .wpcf7-list-item label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

#eligibility-popup .consent input[type="checkbox"] {
    flex: 0 0 17px;
    width: 17px;
    height: 17px;
    margin: 3px 0 0;
    accent-color: #26345f;
}

#eligibility-popup .consent .wpcf7-list-item-label {
    flex: 1;
    min-width: 0;
}

#eligibility-popup small {
    display: block;
    margin: 0 0 18px;
    color: #76502f;
    font-size: 13px;
    line-height: 1.6;
}

/* Submit button */
#eligibility-popup .wpcf7-form .wpcf7-submit.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 153px;
    min-height: 54px;
    margin: 0;
    padding: 14px 25px;
    border: 0;
    border-radius: 40px;
    background: #29355f;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
    opacity: 1;
    box-shadow: none;
}

#eligibility-popup .wpcf7-form .wpcf7-submit.btn:hover {
    background: #1d284b;
    color: #fff;
}

#eligibility-popup .wpcf7-form .wpcf7-submit.btn:disabled {
    cursor: not-allowed;
}

#eligibility-popup .wpcf7-spinner {
    display: inline-block;
    vertical-align: middle;
}

#eligibility-popup .note {
    margin-top: 14px;
    color: #526080;
    font-size: 11px;
    line-height: 1.5;
}

#eligibility-popup .wpcf7-response-output {
    font-size: 13px;
    line-height: 1.5;
    text-align: center;
}

/* Close button */
#eligibility-popup .eligibility-popup-close {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 2;
    padding: 0;
    border: 0;
    background: transparent;
    color: #111;
    font-size: 23px;
    line-height: 1;
    cursor: pointer;
}

/* Mobile */
@media (max-width: 600px) {
    #eligibility-popup .eligibility-popup-box {
        width: calc(100% - 24px);
        max-width: 100%;
        max-height: 90vh;
        padding: 22px 20px;
        border-radius: 14px;
    }

    #eligibility-popup .eligibility-popup-header h3 {
        font-size: 24px;
    }

    #eligibility-popup .eligibility-popup-header p {
        font-size: 15px;
    }

    #eligibility-popup .fields {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }
}

.buying-wrapper .step:last-child:before {
    display: none;
}

.renovation-loans-page .heloc-intro {
    background: var(--rl-light);
}

.cct-contact-layout .fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-top: 18px;
}
.cct-contact-page label.wide-label {
    margin-top: 18px;
}
.cct-contact-layout label.consent {
    margin-top: 18px;
    display: flex;
    gap: 8px;
    align-items: center;
}

.cct-contact-layout .consent .wpcf7-list-item {
    display: inline-block;
    margin: 0;
}
.cct-contact-layout .primary-btn {
    background-color: #233358;
    color: var(--white);
    padding: 15px 30px !important;
    border-radius: 100px !important;
    font-weight: 600;
    font-size: 16px;
    margin-top: 22px !important;
    width: fit-content !important;
    cursor: pointer !important;
}
.reviews-swiper {
    position: relative;
}
 
.reviews-slider {
    position: relative;
    padding-bottom: 0;
}
 
.reviews-slider .swiper-slide {
    height: auto;
}
 
.reviews-slider .quote {
    height: 100%;
    display: flex;
    flex-direction: column;
}
 
.reviews-wrapper .reviews-slider .quote .review-text {
    font-size: 15px;
    line-height: 1.6;
    max-height: calc(1.6em * 4);  
    overflow-y: auto;
    padding-right: 8px;
    margin: 10px 0 15px;
    text-align: left;
}
 
.reviews-wrapper .reviews-slider .quote .review-text p {
    font-size: 22px !important;
    line-height: 1.6 !important;
    margin: 0;
}
 
.reviews-slider .review-text::-webkit-scrollbar {
    width: 4px;
}
 
.reviews-slider .review-text::-webkit-scrollbar-track {
    background: #eee;
    border-radius: 10px;
}
 
.reviews-slider .review-text::-webkit-scrollbar-thumb {
    background: #b98e2e;
    border-radius: 10px;
}
 
.reviews-slider .review-text {
    scrollbar-width: thin;
    scrollbar-color: #b98e2e #eee;
}
 
.reviews-swiper .swiper-button-prev,
.reviews-swiper .swiper-button-next,
.reviews-slider .swiper-button-prev,
.reviews-slider .swiper-button-next {
    display: none !important;
}
 
 
.reviews-swiper .swiper-pagination {
    position: static !important;
    display: block !important;
    margin-top: 25px;
    width: 100%;
    text-align: center;
    transform: none !important;
}
 
.reviews-swiper .swiper-pagination-bullet {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 5px !important;
    background: #ccc;
    opacity: 1;
    border-radius: 50%;
    cursor: pointer;
}
 
.reviews-swiper .swiper-pagination-bullet-active {
    background: #b98e2e;
}
@media (max-width: 1199px) {
    .why-section .why-grid {
        gap: 50px;
    }

    .home-page .resources br {
        display: unset;
    }

    .home-page .layered-inner {
        grid-template-columns: .95fr 1.05fr;
        padding-left: 28px;
        padding-right: 28px;
        min-height: 610px;
    }

    .home-page .layered-copy h1 {
        font-size: 57px;
    }

    .home-page .leader-cutout,
    .home-page .pj-cutout {
        height: 415px;
    }

    .home-page .phil-cutout {
        height: 400px;
        left: -10px;
    }

    .home-page .pj-cutout {
        right: -30px;
    }

    .home-page .leaders-composition {
        min-height: 555px;
    }

    .home-page .leader-callout h2 {
        font-size: 19px;
    }

    .home-page .leader-callout p {
        font-size: 11px;
    }

    .home-page .leader-halo {
        width: 430px;
        height: 430px;
        left: calc(50% - 215px);
    }

    .home-page .diagonal-stage {
        height: 590px;
    }

    .home-page .diagonal-phil {
        height: 560px;
        left: -75px;
        bottom: -45px;
    }

    .home-page .diagonal-pj {
        height: 570px;
        right: -85px;
        bottom: -35px;
    }

    .home-page .diagonal-message {
        width: 44%;
        padding-left: 0;
    }

    .home-page .diagonal-message>p {
        font-size: 17px;
    }

    .home-page .diagonal-message .eyebrow {
        font-size: 9px;
    }

    .home-page .diagonal-person-label {
        bottom: 55px;
        min-width: 190px;
    }

    .home-page .label-phil {
        left: 25px;
    }

    .home-page .label-pj {
        right: 25px;
    }

    .home-page .diagonal-person-label h2 {
        font-size: 20px;
    }

    .home-page .diagonal-person-label .btn {
        min-width: 190px;
        padding: 13px 17px;
        font-size: 12px;
        gap: 15px;
    }

    .home-page .diagonal-message>p,
    .home-page .diagonal-message .eyebrow,
    .home-page .diagonal-inquiry {
        position: relative;
        z-index: 6;
        color: #233358;
        -webkit-text-stroke: .65px #fff;
        paint-order: stroke fill;
        text-shadow: 0 0 2px #fff, 0 0 5px #fff;
    }

    .home-page .diagonal-message>p {}

    .home-page .diagonal-inquiry {
        -webkit-text-stroke: .5px #fff;
    }

    .story-section .section-heading p {
        max-width: 100%;
        margin: 0 auto 15px;
    }

    .heloc-why-grid {
        gap: 30px;
    }

    .heloc-why-visual {
        padding: 25px;
    }

    .heloc-intro-grid {
        gap: 25px;
    }

    .fha-loan-difference .feature-wrapper {
        gap: 30px;
    }

    .heloc-intro h2,
    .heloc-section-heading h2 {
        font-size: clamp(36px, 46px, 56px);
    }

    nav ul {

        display: flex;

        gap: 20px;

    }



    .legacy-lines-right img {

        height: 220px;

    }



    .feature-image-area img {

        left: 40%;

        transform: translateX(-60%);

    }



    br {

        display: none;

    }



    .cta-section {

        padding: 60px 0 90px;

        text-align: center;

        position: relative;

    }



    nav a {

        font-size: 13px;

    }



    .testimonial-container {

        width: 90%;

    }



    .testimonial-card {

        width: 95%;

        margin: 0 auto;

    }

}

@media (max-width: 1100px) {

    .purchase-page header {
        flex-wrap: wrap;
        padding: 20px 23px;
    }

    .purchase-page header img {
        width: 230px;
    }

    .purchase-page .menu-toggle {
        display: block;
    }

    .purchase-page header nav {
        display: none;
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    .purchase-page header nav.open {
        display: flex;
    }

    .purchase-page header nav a {
        display: block;
        padding: 13px 0;
    }

    .purchase-page header nav details {
        padding: 13px 0;
    }

    .purchase-page .nav-dropdown {
        position: static;
        box-shadow: none;
        margin-top: 10px;
    }

    .purchase-page .nav-dropdown a {
        padding: 12px 15px;
    }

    .purchase-page header nav .btn {
        align-self: flex-start;
        margin-top: 12px;
    }

    .legacy-container {

        max-width: 100%;

    }





    .legacy-phil {

        left: 190px;

        transform: scale(0.9);

        transform-origin: top left;

    }



    .legacy-pj {

        left: 120px;

        transform: scale(0.9);

        transform-origin: bottom left;

    }



    .legacy-content {

        right: 25px;

        width: 48%;

    }



    .legacy-title-small,

    .legacy-driven {

        font-size: 24px;

    }



    .legacy-word {

        font-size: 48px;

    }



    .legacy-description {

        font-size: 14px;

    }



}

@media (min-width:851px) and (max-width:1150px) {
    .home-page .diagonal-message h1 {
        letter-spacing: -1.8px;
    }

    .home-page .diagonal-message {
        width: 45%;
        padding-left: 10px;
    }

    .home-page .left-shape {
        clip-path: polygon(0 0, 32% 0, 19% 100%, 0 100%);
    }

    .home-page .diagonal-message h1 {
        font-size: clamp(55px, 6.35vw, 73px);
        letter-spacing: -2px;
    }

    .home-page .diagonal-message {
        padding-top: 110px;
    }
}

@media (max-width: 1024px) {
    .navbar-nav .header-menu li {
        width: 100%;
    }

    .home-page .split-info {
        padding-left: 6%;
        max-width: 78%;
    }

    .home-page .split-info h2 {
        font-size: 31px;
    }

    .home-page .split-photo,
    .home-page .pj .split-photo {
        right: -60px;
        max-width: 70%;
        height: 405px;
    }

    .home-page .split-person {
        min-height: 420px;
    }

    .home-page .split-info .eyebrow {
        max-width: 170px;
    }

    .home-page .split-info p {
        font-size: 12px;
    }

    .navbar-nav .header-menu li a {
        width: 100%;
        padding: 14px 0;
        border-bottom: 2px solid transparent !important;
    }

    .navbar-nav .header-menu li.menu-item-has-children>a {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .navbar-nav .header-menu li.menu-item-has-children>a::after {
        transition: transform .25s ease;
    }

    .navbar-nav .header-menu li.submenu-open>a::after {
        transform: rotate(180deg);
    }

    .navbar-nav .header-menu .sub-menu,
    .navbar-nav .header-menu .sub-menu .sub-menu {
        position: static;
        top: auto;
        left: auto;
        display: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border-radius: 0;
        min-width: 100%;
        margin: 8px 0 0;
        padding: 0;
        gap: 0;
        background: #f8f9fa;
    }

    .navbar-nav .header-menu li.submenu-open>.sub-menu {
        display: flex;
        flex-direction: column;
    }

    .navbar-nav .header-menu .sub-menu li {
        padding: 0;
        border-bottom: 1px solid #eee;
    }

    .navbar-nav .header-menu .sub-menu li:last-child {
        border-bottom: none;
    }

    .navbar-nav .header-menu .sub-menu li a {
        padding: 14px 20px 14px 25px;
        font-size: 14px;
        white-space: normal;
    }

    .navbar-nav .header-menu .sub-menu .sub-menu li a {
        padding-left: 45px;
    }

    .navbar-nav .header-menu .sub-menu li.menu-item-has-children>a::after {
        content: '\f107';
        float: none;
    }

    .refi-page .refi-hero::before,
    .refi-page .refi-hero::after {
        display: none;
    }

    .heloc-hero-grid {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .heloc-hero::before {
        display: none;
    }

    .heloc-hero {
        background: linear-gradient(165deg, #F7F8FA 0%, #EDF0F5 100%);
    }

    .heloc-equity-card {
        max-width: 560px;
    }

    .heloc-use-grid {
        grid-template-columns: repeat(2, 1fr);
    }


    .heloc-process-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 50px 30px;
    }

    .heloc-process-grid::before {
        display: none;
    }

    .heloc-callout-inner {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .refi-page .refi-hero {
        padding: 70px 0 80px;
    }

    .refi-page .hero-inner {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .refi-page .hero-number-block {
        text-align: left;
        padding-left: 0;
        background: #233358;
        padding: 40px 32px;
        border-radius: 0;
    }

    .refi-page .hero-number-block .caption {
        margin-left: 0;
    }

    .refi-page .why-header,
    .refi-page .options-header,
    .refi-page .how-header {
        grid-template-columns: 1fr;
        gap: 24px;
        align-items: start;
    }

    .refi-page .why-row {
        grid-template-columns: 60px 1fr;
    }

    .refi-page .why-desc {
        grid-column: 2 / 3;
    }

    .options-dark .options-header {
        text-align: center;
    }

    .refi-page .options-grid-text {
        gap: 15px;
    }

    .refi-page .options-grid-text::before {
        display: none;
    }

    .refi-page .opt-block {
        padding: 34px 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, .12);
    }

    .refi-page .opt-block:last-child {
        border-bottom: none;
    }

    .refi-page .how-timeline {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }

    .refi-page .how-timeline::before {
        display: none;
    }

    .refi-page .gold-inner {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .refi-page .gold-stat {
        border-left: none;
        border-top: 2px solid rgba(15, 41, 66, .25);
        padding-left: 0;
        padding-top: 20px;
    }

    .refi-page .form-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .refi-page .form-fields {
        grid-template-columns: 1fr;
    }

    .pc-hero-inner {
        grid-template-columns: 1fr;
        gap: 50px;
        text-align: center;
    }

    .pc-hero-left {
        padding: 0;
    }

    .pc-hero-eyebrow {
        margin-left: auto;
        margin-right: auto;
    }

    .pc-hero-role {
        margin-left: auto;
        margin-right: auto;
    }

    .pc-hero-social {
        justify-content: center;
    }

    .pc-hero-cta {
        justify-content: center;
    }

    .pc-nmls-chip {
        left: 16px;
        bottom: 16px;
    }

    .pc-main-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .pc-sidebar {
        position: static;
    }

    .pc-stats-inner {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }

    .pc-stat-item:nth-child(2) {
        border-right: none;
    }

    /* Show hamburger */



    .navbar-toggle {

        display: flex;

        position: relative;

        z-index: 10001;

    }





    /* =========================

               Left Side Menu

            ========================= */



    .navbar-nav {

        position: fixed;



        top: 0;

        left: 0;



        width: 350px;

        max-width: 85%;



        height: 100vh;



        padding: 50px 30px 30px;



        background: #ffffff;



        display: flex;

        flex-direction: column;

        align-items: stretch;



        gap: 25px;



        overflow-y: auto;



        /* Initially hidden outside left */

        transform: translateX(-100%);



        /* Smooth slide */

        transition: transform 0.4s ease;



        box-shadow: 8px 0 30px rgba(0, 0, 0, 0.12);



        z-index: 10000;

    }





    /* =========================

               Open Menu

            ========================= */



    .navbar-nav.active {

        transform: translateX(0);

    }





    /* =========================

               Mobile Navigation

            ========================= */



    .navbar-nav nav {

        width: 100%;

    }



    .navbar-nav nav ul {

        width: 100%;



        display: flex;

        flex-direction: column;

        align-items: stretch;



        gap: 0;

    }



    .navbar-nav nav ul li {

        width: 100%;

        border-bottom: 1px solid #eeeeee;

        padding: 10px 0;

    }



    /* .navbar-nav nav ul li:first-child {

        border-top: 1px solid #eeeeee;

    } */



    .navbar-nav nav ul li a {

        width: 100%;



        padding: 17px 0;



        font-size: 16px;

    }



    .navbar-nav nav a.active {

        border-bottom: unset;

    }



    /* =========================

               Overlay

            ========================= */



    .menu-overlay {

        display: block;



        position: fixed;



        top: 0;

        left: 0;



        width: 100%;

        height: 100vh;



        background: rgba(0, 0, 0, 0.45);



        opacity: 0;

        visibility: hidden;



        transition: 0.4s ease;



        z-index: 1;

    }



    .menu-overlay.active {

        opacity: 1;

        visibility: visible;

    }





    /* =========================

               Hamburger Animation

            ========================= */



    .navbar-toggle.active span:nth-child(1) {

        transform: translateY(7px) rotate(45deg);

    }



    .navbar-toggle.active span:nth-child(2) {

        opacity: 0;

    }



    .navbar-toggle.active span:nth-child(3) {

        transform: translateY(-7px) rotate(-45deg);

    }





    /* Prevent body scroll */

    body.menu-open {

        overflow: hidden;

    }



}

@media(max-width:1000px) {
    .cct-contact-page .reviews-grid {
        grid-template-columns: 1fr 1fr
    }

    .cct-contact-page .cct-contact-hero-inner {
        gap: 35px
    }

    .cct-contact-page .cct-contact-hero h1 {
        font-size: 40px
    }

    .cct-contact-page .cct-contact-layout {
        gap: 28px
    }

    .cct-contact-page .cct-contact-sidebar {
        padding: 26px
    }




}

@media (max-width: 991px) {
    .home-page .grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .va-eligibility-wrapper {
        gap: 30px;
    }

    .buying-wrapper .buying-process {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .home-page .resources a {
        border: 1px solid #233358;
        border-radius: 10px;
    }

    .home-page .resources {
        grid-template-columns: repeat(2, 1fr);
    }

    .loan-options-wrap .purchase-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .refi-hero .container {
        padding: 0 0px;
    }

    .refi-hero .refi-heading {
        padding: 50px 20px;
    }

    .purchase-page .purchase-headline {
        padding: 5cap 0;
    }

    .home-page .loan p {
        min-height: unset;
        margin-bottom: 20px;
    }

    .home-page .layered-inner {
        grid-template-columns: 1fr;
        padding-top: 30px;
        gap: 0;
        max-width: 700px;
    }

    .home-page .layered-copy {
        padding: 5px 0 30px;
    }

    .home-page .layered-copy h1 {
        font-size: 57px;
        margin: 19px 0;
    }

    .home-page .layered-copy h1 span {
        display: inline;
    }

    .home-page .layered-copy h1 span:after {
        content: ' ';
    }

    .home-page .layered-copy>p {
        font-size: 19px;
    }

    .home-page .hero-markets {
        margin-top: 20px;
    }

    .home-page .leaders-composition {
        min-height: 550px;
    }

    .home-page .leader-cutout,
    .home-page .pj-cutout {
        height: 430px;
    }

    .home-page .phil-cutout {
        height: 415px;
        left: 10px;
    }

    .home-page .pj-cutout {
        right: 0;
    }

    .home-page .leader-callout {
        bottom: 25px;
    }

    .home-page .hero-texture span {
        font-size: 250px;
    }

    .home-page .hero-texture span:first-child {
        margin-top: 150px;
    }

    .home-page .crescenzo-motion.hero-texture {
        align-items: flex-start;
        padding-top: 230px;
    }

    .home-page .crescenzo-motion.hero-texture span {
        font-size: 240px;
    }

    .home-page .motion-control {
        top: 10px;
        right: 16px;
        font-size: 10px;
    }

    .home-page .diagonal-message {
        width: 90%;
        padding: 30px 0 0;
        text-align: center;
    }

    .home-page .diagonal-message h1 {
        text-align: center;
        margin: 12px 0;
    }

    .home-page .diagonal-message h1 br {
        display: none;
    }

    .home-page .diagonal-message h1 br:after {
        content: ' ';
    }

    .home-page .diagonal-message h1 span {
        display: block;
    }

    .home-page .diagonal-message>p {
        font-size: 16px;
        line-height: 1.4;
    }

    .home-page .diagonal-message>p br {
        display: none;
    }

    .home-page .diagonal-message .eyebrow {
        color: #233358;
    }

    .home-page .diagonal-gold-rule {
        margin: 15px auto 10px;
    }

    .home-page .diagonal-inquiry {
        font-size: 12px;
    }

    .home-page .diagonal-word {
        top: 235px;
        font-size: 220px;
    }

    .home-page .diagonal-phil {
        height: 480px;
        bottom: -45px;
        left: -40px;
    }

    .home-page .diagonal-pj {
        height: 480px;
        bottom: -30px;
        right: -35px;
    }

    .home-page .diagonal-person-label {
        bottom: 65px;
    }

    .home-page .label-phil {
        left: 25px;
    }

    .home-page .label-pj {
        right: 22px;
    }

    .home-page .left-shape {
        clip-path: polygon(0 240px, 65% 240px, 30% 100%, 0 100%);
    }

    .home-page .right-shape {
        clip-path: polygon(0 0, 100% 0, 100% 100%, 30% 100%, 65% 240px, 0 240px);
    }

    .home-page .right-shape:after {
        display: none;
    }

    .home-page .label-phil>p {
        background: #233358a8;
        display: inline-block;
        padding: 2px 4px;
    }

    .home-page .left-shape:after {
        display: none;
    }

    .home-page .diagonal-message h1 {
        -webkit-text-stroke: .8px #eef1f4;
    }

    .home-page .label-pj h2 {
        padding: 6px 8px;
        background: rgba(255, 255, 255, .96);
    }

    .home-page .diagonal-message {
        padding-top: 30px;
    }

    .home-page .diagonal-message h1 {
        font-size: clamp(38px, 6.5vw, 55px);
        line-height: 1.04;
        margin: 12px 0 18px;
    }

    .home-page .diagonal-stage {
        height: 790px;
        max-width: 100%;
    }

    .home-page .diagonal-message {
        width: 100%;
        padding: 30px 22px 0;
        margin: 0;
        box-sizing: border-box;
        text-align: center;
        z-index: 6;
    }

    .home-page .diagonal-message .eyebrow {
        margin: 0;
        font-size: 10px;
        letter-spacing: 1.6px;
    }

    .home-page .diagonal-message h1 {
        font-size: clamp(39px, 7.2vw, 58px);
        line-height: 1.04;
        letter-spacing: -1.5px;
        margin: 15px 0 18px;
        text-align: center;
    }

    .home-page .diagonal-message h1 br {
        display: block;
    }

    .home-page .diagonal-message h1 br:first-of-type {
        display: none;
    }

    .home-page .diagonal-message h1 br:first-of-type:after {
        content: ' ';
    }

    .home-page .diagonal-message h1 span {
        display: block;
        white-space: normal;
    }

    .home-page .diagonal-gold-rule {
        margin: 16px auto 12px;
        width: 48px;
        height: 2px;
    }

    .home-page .diagonal-inquiry {
        margin: 0;
        text-align: center;
        font-size: 12px;
    }

    .home-page .diagonal-word {
        top: 300px;
        font-size: 160px;
        opacity: .6;
    }

    .home-page .diagonal-portrait {
        top: auto;
        bottom: 120px;
        height: 420px;
        max-width: none;
    }

    .home-page .diagonal-phil {
        left: calc(25% - 170px);
        bottom: 112px;
    }

    .home-page .diagonal-pj {
        right: calc(25% - 175px);
        bottom: 112px;
        height: 420px;
    }

    .home-page .left-shape {
        clip-path: polygon(0 290px, 72% 290px, 36% 100%, 0 100%);
    }

    .home-page .left-shape:after {
        display: none;
    }

    .home-page .right-shape {
        clip-path: polygon(0 0, 100% 0, 100% 100%, 36% 100%, 72% 290px, 0 290px);
    }

    .home-page .right-shape:after {
        display: none;
    }

    .home-page .diagonal-person-label {
        bottom: 0;
        width: 50%;
        min-width: 0;
        height: 155px;
        padding: 23px 13px 15px;
        box-sizing: border-box;
        z-index: 7;
        background: #233358;
        color: #fff;
        text-align: center;
    }

    .home-page .label-phil {
        left: 0;
    }

    .home-page .label-pj {
        right: 0;
        background: #e5eaf0;
        color: #233358;
    }

    .home-page .diagonal-person-label h2 {
        font-size: 18px;
        line-height: 1.2;
        margin: 0 0 12px;
        display: block;
        padding: 0;
        background: none;
        box-shadow: none;
        -webkit-text-stroke: 0;
        text-shadow: none;
    }

    .home-page .diagonal-label-rule {
        display: none;
    }

    .home-page .diagonal-person-label .btn {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
        padding: 13px 10px;
        font-size: 11px;
        gap: 5px;
        letter-spacing: 0;
        justify-content: center;
        border-radius: 3px;
    }

    .home-page .diagonal-person-label .btn span {
        font-size: 16px;
        margin-left: 4px;
    }

    .home-page .diagonal-person-label>p {
        font-size: 9px;
        line-height: 1.4;
        margin: 12px 0 0;
        padding: 0;
        display: block;
        background: none;
        -webkit-text-stroke: 0;
        text-shadow: none;
        color: inherit;
    }

    .home-page .diagonal-motion-control {
        top: 8px;
        right: 8px;
        font-size: 9px;
        padding: 3px 7px;
    }

    .reviews-info {
        text-align: center;
    }

    .refinance-page .refi-steps {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .refinance-page .refi-heading {
        padding: 50px 0px;
    }

    .reviews-bottom {
        gap: 25px;
        flex-direction: column;
        text-align: center;
    }

    .reviews-hero h1 {
        text-align: center;
        font-size: 36px;
    }

    .reviews-hero p {
        max-width: 700px;
        font-size: 20px;
        margin: 0 auto;
    }

    .review-hero-actions {
        justify-content: center;
    }

    .purchase-page .split-info {
        padding-left: 6%;
        max-width: 78%;
    }

    .cct-contact-page .cct-contact-paths .cct-path-links {
        justify-content: center;
    }

    .cct-contact-page .cct-contact-paths .cct-content {
        align-items: center;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        gap: 20px;
    }

    .cct-contact-page .cct-contact-paths h2 {
        text-align: center;
    }

    .purchase-page .split-info h2 {
        font-size: 31px;
    }

    .purchase-page .split-photo,
    .purchase-page .pj .split-photo {
        right: -60px;
        max-width: 70%;
        height: 405px;
    }

    .purchase-page .split-person {
        min-height: 420px;
    }

    .purchase-page .split-info .eyebrow {
        max-width: 170px;
    }

    .purchase-page .split-info p {
        font-size: 12px;
    }

    .purchase-page .buying-process {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .purchase-page .purchase-grid {
        grid-template-columns: 1fr 1fr;
    }

    .purchase-page .process-intro h2 {
        font-size: 34px;
    }

    .purchase-page .purchase-headline h1 {
        font-size: 46px;
    }

    .purchase-page .purchase-hero-inner {
        grid-template-columns: 1.2fr 1fr;
    }

    .purchase-page .door-frame {
        left: 15%;
        width: 180px;
    }

    .purchase-page .chapter-label {
        left: 24px;
    }

    .purchase-page .chapter-label strong {
        font-size: 24px;
    }

    .cct-about-page .about-story {
        grid-template-columns: 1fr;
        gap: 20px
    }

    .cct-about-page .split-info {
        padding-left: 6%;
        max-width: 78%
    }

    .cct-about-page .split-info h2 {
        font-size: 31px
    }

    .cct-about-page .split-photo,
    .cct-about-page .pj .split-photo {
        right: -60px;
        max-width: 70%;
        height: 405px
    }

    .cct-about-page .split-person {
        min-height: 420px
    }

    .cct-about-page .split-info .eyebrow {
        max-width: 170px
    }

    .cct-about-page .split-info p {
        font-size: 12px
    }

    .cct-about-page .bio-grid {
        grid-template-columns: 1fr
    }

    .cct-about-page .values {
        grid-template-columns: 1fr 1fr
    }

    .cct-about-page .relationship {
        grid-template-columns: 1fr;
        gap: 30px;
        padding: 0px 24px
    }

    .cct-about-page h2 {
        font-size: 36px;
    }

    .cct-about-page .split-person {
        min-height: 450px
    }

    .cct-about-page .about-story h2 {
        font-size: 36px
    }

    .why-section .why-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .cct-about-page .team-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px
    }

    .cct-about-page .about-inline-intro {
        padding: 0;
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 35px;
        align-items: center
    }

    .cct-about-page .about-inline-intro .eyebrow {
        grid-column: 1/-1
    }

    .cct-about-page .about-inline-intro h1 {
        font-size: 34px;
        margin: 12px 0 0
    }

    .cct-about-page .about-inline-intro>p {
        grid-column: 2;
        grid-row: 2
    }

    .cct-about-page .about-inline-intro .about-gold-rule {
        display: none
    }

    .cct-about-page .team-layout .unified-profiles {
        max-width: none
    }

    .cct-about-page .team-layout .unified-profile .split-person {
        height: 300px
    }

    .story-section .feature-content {
        text-align: center;
    }

    .rl-story-quote {
        text-align: center;
    }

    .rl-story-quote h2 {
        font-size: 36px;
    }

    .rl-benefits-heading {
        max-width: 100%;
        margin-bottom: 30px;
        text-align: center;
    }

    .rl-benefits-heading h2 {
        font-size: 36px;
    }

    .bridge-intro-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        text-align: center;
    }

    .usda-intro-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        text-align: center;
    }

    .jumbo-split .wrap {
        gap: 30px;
    }

    .jumbo-stats .wrap {
        grid-template-columns: repeat(2, 1fr);
    }

    .jumbo-stats .stat {
        border: 1px solid #ffffff42;
        border-radius: 10px;
        padding: 15px;
    }

    .heloc-why-grid {
        grid-template-columns: 1fr;
    }

    .heloc-intro-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .closing-process-section .process-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .fha-loan-option .who-content h2 {
        font-size: 36px;
    }

    .fha-loan-option .who-wrapper {
        gap: 20px;
    }

    .fha-loan-difference .feature-wrapper {
        grid-template-columns: 1fr;
    }

    .fha-benefits-section .benefit-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .reviews-experience-content {
        text-align: center;
    }

    .reviews-section-heading {
        max-width: 100%;
        margin-bottom: 0;
        text-align: center;
    }

    .qualification-section .requirements-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .feature-strip .strip-info h2 {
        font-size: 36px;
    }

    .benefits-section .benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .intro-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        text-align: center;
    }

    .fha-faq-inner .section-heading {
        text-align: center;
        margin-bottom: 20px;
    }

    .who-section .who-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .fha-faq-inner {
        grid-template-columns: 1fr;
    }

    .fha-faq-inner .section-heading {
        text-align: center;
    }

    .who-section .check-list {
        margin-bottom: 0;
    }

    .financial-details-section .feature-content {
        text-align: left;
    }

    .financial-details-section .feature-inner {
        gap: 30px;
    }

    .loan-options .loan-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .process-section .process-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .contact-wrapper .contact-grid {
        grid-template-columns: repeat(1, 1fr);
        gap: 30px;
    }


    .tm-social-icons {
        justify-content: center;
    }

    .feature-cta {
        justify-content: center;
    }

    .navbar-nav .header-menu {

        flex-direction: column;

        align-items: flex-start;

        width: 100%;

    }


    .story-feature {
        grid-template-columns: 1fr;
        padding: 32px 28px;
        gap: 32px;
    }

    .intro-form-wrapper .intro-ritgh img {
        height: 100%;
    }

    .intro-form-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .reviews-hero-grid,
    .reviews-experience-grid {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .reviews-hero-content h1 {
        font-size: 3rem;
    }

    .reviews-featured-grid {
        grid-template-columns: 1fr;
    }

    .reviews-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .reviews-section-heading h2,
    .reviews-experience-content h2 {
        font-size: 2.4rem;
    }

    .reviews-cta-content h2 {
        font-size: 2.6rem;
    }

    .rl-hero {

        min-height: auto;

    }


    .rl-hero-bg {

        width: 100%;

        height: 43%;

        top: auto;

        bottom: 0;

        clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%);

    }


    .rl-hero-grid {

        grid-template-columns: 1fr;

    }


    .rl-hero-content {

        padding: 80px 0 40px;

    }


    .rl-hero-visual {

        height: 520px;

    }


    .rl-hero-visual .rl-before {

        left: 8%;

    }


    .rl-hero-visual .rl-after {

        right: 8%;

    }


    .rl-intro-grid {

        grid-template-columns: 50px 1fr;

    }


    .rl-intro-copy {

        grid-column: 2;

        padding-top: 0;

    }


    .rl-project-header {
        grid-template-columns: 1fr;
        gap: 20px;
        text-align: center;
        margin-bottom: 30px;
    }

    .rl-project-grid {

        grid-template-columns: 1fr 1fr;

    }

    .rl-project-number {
        display: none;
    }

    .rl-project-card {
        min-height: auto;
        padding: 25px;
    }

    .rl-project-large {

        grid-column: span 2;

        grid-row: auto;

        min-height: auto;

    }


    .rl-feature-grid {

        grid-template-columns: 1fr;

    }


    .rl-feature-side {

        grid-column: 2;

        padding-left: 0;

        border-left: 0;

    }

    .rl-process-heading {
        grid-template-columns: 1fr;
        gap: 25px;
        text-align: center;
        margin-bottom: 30px;
    }

    .rl-process-heading h2 {
        font-size: 36px;
    }

    .rl-process-steps {

        grid-template-columns: 1fr 1fr;

    }


    .rl-step:nth-child(2) {

        border-right: 0;

    }


    .rl-step:nth-child(3),
    .rl-step:nth-child(4) {

        border-top: 1px solid var(--rl-border);

    }


    .rl-story-grid {

        grid-template-columns: 1fr;

        gap: 50px;

    }


    .rl-faq-grid {

        grid-template-columns: 1fr;

        gap: 50px;

    }

    .bridge-hero-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .bridge-visual {
        max-width: 650px;
    }

    .bridge-arrow {
        flex-direction: row;
    }

    .bridge-benefits-grid {
        grid-template-columns: 1fr;
        gap: 65px;
    }

    .bridge-use-grid {
        grid-template-columns: 1fr 1fr;
    }

    .bridge-process-grid {
        grid-template-columns: 1fr 1fr;
        row-gap: 50px;
    }

    .bridge-step::after {
        display: none;
    }

    .va-loan-hero-content,
    .va-eligibility-wrapper {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .va-benefits-grid,
    .va-process-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .va-loan-hero-text h1 {
        font-size: 44px;
    }

    .va-eligibility-image img {
        height: 420px;
    }

    .va-loan-hero-image img {
        height: 420px;
    }

    .section-heading h2,
    .va-eligibility-content h2,
    .va-cta-content h2 {
        font-size: 34px;
    }

    .va-hero-stats {
        flex-wrap: wrap;
        gap: 16px;
    }

    .va-hero-stat {
        flex: 1 1 45%;
        border-right: none;
        padding-right: 0;
    }

    .usda-hero-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .usda-hero-visual {
        max-width: 650px;
    }



    .usda-feature {
        padding: 15px 0;
        border-right: 0;
    }

    .usda-feature:last-child {
        border-bottom: 0;
    }

    .usda-fit-grid {
        grid-template-columns: 1fr 1fr;
    }

    .usda-highlight-grid {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .usda-process-grid {
        grid-template-columns: 1fr 1fr;
        row-gap: 50px;
    }

    .usda-process-step::after {
        display: none;
    }

    .jumbo-card-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .paths-section .cards-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .pc-bio-body {
        columns: 2;
    }

    .pc-bio-body p:first-child {
        margin-top: 0;
    }

    .feature-photo {
        max-width: 280px;
        margin: 0 auto;
    }

    .values-grid {

        grid-template-columns: repeat(2, 1fr);

    }

    .legacy-section {

        height: 720px;

    }



    .legacy-container {

        height: 100%;

    }



    .feature-area {

        display: none;

    }



    /* Grey shape */



    .legacy-diagonal {

        top: 245px;

        left: 0;



        width: 100%;

        height: 480px;



        clip-path: polygon(0 0,

                100% 38%,

                100% 100%,

                0 72%);

    }





    /* Content */



    .legacy-content {

        position: relative;



        top: auto;

        right: auto;



        width: 100%;



        margin: 0 auto;



        padding-top: 10px;



        text-align: center;

    }



    .legacy-title {

        margin-bottom: 18px;

    }



    .legacy-title-small {

        font-size: 30px;

        letter-spacing: -0.5px;

    }



    .legacy-title-bottom {

        justify-content: center;

        flex-wrap: wrap;



        margin-top: 3px;

    }



    .legacy-driven {

        font-size: 30px;

    }



    .legacy-word {

        margin-left: 5px;

        margin-top: 3px;

        font-size: 30px;

        letter-spacing: 0px;

    }



    .legacy-description {

        max-width: 100%;

        margin: 0 auto;

        font-size: 16px;

        line-height: 1.45;

        padding-left: 0;

    }





    /* People */



    .legacy-people {

        width: 100%;

        height: 550px;

    }



    .legacy-phil {

        left: 60%;

        top: 50px;

        transform: translateX(-40%);

        /* transform: translateX(-40%) scale(0.67); */

        /* transform-origin: top left; */

    }



    .legacy-pj {

        left: 40%;

        transform: translateX(-60%);

        bottom: 0;

        transform-origin: bottom left;

    }



    .legacy-lines-right img {

        display: none;

    }



    /* Decorative patterns */



    .legacy-lines-left {

        display: none;

    }



    .legacy-lines-right {

        right: -80px;

        bottom: -80px;



        transform: scale(0.7) rotate(45deg);

    }



    .legacy-lines-right img {

        height: 200px;

    }



    .feature-section .feature-text {

        max-width: 100%;

        text-align: center;

        padding-left: 0px;

    }



    .testimonial-section {

        padding: 60px 20px;

    }



    .footer-wrap .footer-nav a {

        font-size: 12px;

    }



    .footer-wrap .footer-nav {

        gap: 20px;

        flex-wrap: wrap;

        justify-content: end;

    }



    .cta-section .cta-buttons {

        gap: 25px;

    }



    .feature-caption {

        display: none;

    }



    .feature-image-area img {

        width: 400px;

        height: 500px;

        left: 50%;

        transform: translateX(-50%);

    }



    .resources-wrapper .resources-links {

        grid-template-columns: repeat(2, 1fr);

    }



    .resource-item {

        border: 1px solid #fff;

        padding: 15px 20px;

        border-radius: 10px;

    }



    .testimonial-title {

        font-size: 24px;

    }



    .testimonial-text {

        font-size: 15px;

    }



    .testimonial-slider .slick-prev {

        left: -35px;

    }



    .testimonial-slider .slick-next {

        right: -35px;

    }

}

@media (max-width: 860px) {
    .refi-hero .refi-heading {
        padding: 50px 20px;
        text-align: center;
    }

    .refi-hero .refi-inner {
        grid-template-columns: 1fr;
    }

    .refi-hero .refi-heading h1 {
        text-align: center;
    }

    .refi-hero .purchase-hero-actions {
        justify-content: center;
    }

    .refi-hero .refi-heading .refi-support {
        max-width: 600px;
        color: #000;
        margin: 15px auto;
    }

    .cct-about-page .unified-profiles {
        grid-template-columns: 1fr;
        max-width: 590px;
        margin: 30px auto 0
    }

    .purchase-hero .container {
        padding: 0;
    }

    .purchase-page .purchase-hero-inner {
        grid-template-columns: 1fr;
    }

    .refi-hero .container {
        padding: 0 0px;
    }

    .purchase-page .purchase-headline {
        padding: 50px 15px;
        text-align: center;
    }

    .purchase-page .purchase-headline>p {
        max-width: 100%;
    }

    .purchase-page .purchase-hero-actions {
        justify-content: center;
    }

    .purchase-page .purchase-headline h1 {
        font-size: 36px;
        text-align: center;
    }

    .refinance-page .refi-heading h1 {
        text-align: center;
    }

    .refinance-page .purchase-hero-actions {
        justify-content: center;
    }

    .refinance-page .refi-heading>p {
        font-size: 20px;
        max-width: 100%;
    }

    .refinance-page .refi-heading .refi-support {
        max-width: 600px;
        color: #000;
        margin: 15px auto;
    }

    .refinance-page .refi-inner {
        grid-template-columns: 1fr;
    }

    .refinance-page .refi-heading {
        padding: 50px 20px;
        text-align: center;
    }

    .advisors {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .advisor {
        grid-template-columns: 0.85fr 1.15fr;
    }

    .advisor__photo img {
        aspect-ratio: 4 / 5;
    }

    .cct-about-page .unified-profile .split-info {
        padding-left: 7%;
        max-width: 70%
    }

    .cct-about-page .unified-profile .split-person {
        min-height: 370px
    }

    .cct-about-page .unified-profile .split-photo,
    .cct-about-page .unified-profile .pj .split-photo {
        height: 380px;
        right: -10px
    }

    .legacy-pj {

        left: 50%;

        transform: translateX(-50%);

    }

    .fha-loan-option .who-wrapper {
        grid-template-columns: 1fr;
    }

    .fha-loan-difference .feature-image img {
        height: 100%;
    }


    .legacy-people {

        height: 520px;

    }

}

@media (max-width: 768px) {
    .refi-section-heading {
        grid-template-columns: 1fr;
        gap: 15px;
        margin-bottom: 35px;
        align-items: center;
        text-align: center;
    }

    .refi-options .refi-section-heading {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .refi-options .content {
        padding: 50px 15px;
    }

    .your-goals h2 {
        max-width: 100%;
        font-size: 30px;
    }

    .ccm-officer-card {
        flex-direction: column;
        text-align: center;
        padding: 20px;
    }

    .cct-about-page h2 {
        font-size: 32px;
    }

    .home-page nav a {
        display: none;
    }

    .home-page nav {
        gap: 0;
    }

    .home-page nav button {
        padding: 10px 17px !important;
    }

    .home-page h1 {
        font-size: 40px;
    }

    .home-page .hero {
        padding: 25px 18px 0;
    }

    .home-page .people {
        gap: 16px;
    }

    .home-page .portrait {
        height: 230px;
    }

    .home-page .portrait img {
        height: 300px;
    }

    .home-page .person {
        padding: 0 16px 20px;
    }

    .home-page .portrait {
        margin: 0 -16px 18px;
    }

    .home-page .person h3 {
        font-size: 21px;
    }

    .home-page .story {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .home-page .grid,
    .home-page .resources {
        grid-template-columns: 1fr 1fr;
    }

    .home-page h2 {
        font-size: 32px;
    }

    .home-page .content {
        padding: 50px 15px;
    }

    .home-page .qualify-btn {
        margin: 12px 0 0;
    }

    .softcta span {
        display: block !important;
        margin-bottom: 15px;
    }

    .home-page footer {
        flex-direction: column;
        align-items: flex-start;
    }

    .cct-contact-info {
        margin-bottom: 25px;
        text-align: center;
    }

    .cct-contact-page .cct-contact-sidebar>p {
        font-size: 16px;
    }

    .cct-contact-page .cct-contact-sidebar h2 {
        margin-bottom: 10px;
    }

    .ccm-officer-left {
        flex: 0 0 auto;
        width: 100%;
    }

    .ccm-officer-socials,
    .ccm-officer-buttons,
    .ccm-officer-contact p {
        justify-content: center;
    }

    .main-banner {
        padding: 50px 0;
    }

    .cct-contact-page .cct-contact-hero-inner {
        padding: 50px 0px;
        grid-template-columns: 1fr;
        gap: 18px;
        text-align: center;
    }

    .cct-contact-page .cct-contact-hero h1 {
        font-size: 30px;
        text-align: center;
    }

    .cct-contact-page .cct-contact-sidebar {
        padding: 20px;
        text-align: center;
    }

    .cct-contact-page .cct-contact-layout {
        grid-template-columns: 1fr;
    }

    .cct-contact-page .cct-contact-hero-inner>p {
        font-size: 18px;
        max-width: 100%;
    }

    .usda-feature-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .qualification-section .requirements-heading {
        max-width: 100%;
        margin-bottom: 30px;
        text-align: center;
    }

    .usda-feature-grid .usda-feature {
        padding: 15px;
        border: 1px solid rgba(255, 255, 255, .16);
        border-radius: 10px;
    }

    .fha-loan-option .who-content {
        text-align: center;
    }

    .fha-loan-difference .feature-content h2 {
        font-size: 36px;
    }

    .main-banner h1 {
        font-size: 36px;
    }

    .intro-content h2 {
        font-size: 30px;
    }

    .reviews-section-heading p {
        font-size: 16px;
        line-height: 1.7;
        color: var(--rv-text-muted);
    }

    .financial-details-section .feature-inner {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .financial-details-section .feature-title h2 {
        font-size: 30px;
    }

    .refi-page .why-header {
        text-align: center;
    }

    .refi-page .why-section,
    .refi-page .options-dark,
    .refi-page .how-section,
    .refi-page .testimonial-section,
    .refi-page .form-dark {
        padding: 50px 0;
    }

    .cta-wrapper .cta-band h2 {
        font-size: 30px;
    }

    .cta-wrapper .cta-band p {
        font-size: 16px;
    }

    .cta-wrapper .band-buttons {
        gap: 20px;
        flex-wrap: wrap;
    }

    .block-pd {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .main-banner p {
        font-size: 18px;
        max-width: 100%;
    }

    .banner-text {
        max-width: 100%;
        text-align: center;
    }

    .reviews-container {
        padding: 0 1.5rem;
    }

    .reviews-hero {
        padding: 3.5rem 0 3.5rem;
    }

    .reviews-hero-content h1 {
        font-size: 2.5rem;
    }

    .reviews-hero-content>p {
        font-size: 1rem;
    }

    .reviews-hero-card {
        padding: 2rem;
    }

    .reviews-hero-card>p {
        font-size: 1.1rem;
    }

    .reviews-summary-grid {
        grid-template-columns: 1fr 1fr;
    }

    .reviews-summary-item {
        padding: 1.5rem 1rem;
    }

    .reviews-summary-number {
        font-size: 1.8rem;
    }

    .reviews-grid {
        grid-template-columns: 1fr;
    }

    .reviews-section-heading h2,
    .reviews-experience-content h2 {
        font-size: 28px;
    }

    .reviews-experience-stat {
        padding: 25px;
    }

    .reviews-cta {
        padding: 4rem 0;
    }

    .reviews-cta-content h2 {
        font-size: 2.2rem;
    }

    .reviews-cta-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .reviews-cta-buttons .reviews-btn {
        width: 100%;
    }

    .reviews-hero-rating {
        flex-wrap: wrap;
        gap: 0.8rem;
        padding: 0.8rem 1.5rem;
    }

    .bridge-hero {
        padding: 65px 0 75px;
    }

    .bridge-hero h1 {
        font-size: 44px;
        letter-spacing: -1px;
    }

    .bridge-hero-text {
        font-size: 16px;
    }

    .bridge-hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .bridge-btn {
        width: 100%;
    }

    .bridge-visual {
        min-height: 390px;
    }

    .bridge-house {
        transform: scale(.78);
    }

    .bridge-house-left {
        left: -5px;
    }

    .bridge-house-right {
        right: -5px;
    }

    .bridge-connector {
        width: 145px;
    }

    .bridge-intro-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }



    .bridge-use-card {
        min-height: auto;
    }

    .bridge-info-card {
        padding: 30px;
        box-shadow: 12px 12px 0 var(--bridge-gold);
    }

    .bridge-process-grid {
        grid-template-columns: 1fr;
    }

    .bridge-cta-inner {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: center;
    }

    .bridge-cta .bridge-btn {
        width: 100%;
    }

    .usda-container {
        width: min(100% - 30px, 1180px);
    }

    .usda-hero {
        padding: 65px 0 75px;
    }

    .usda-hero h1 {
        font-size: 44px;
        letter-spacing: -1px;
    }

    .usda-hero-text {
        font-size: 16px;
    }

    .usda-hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .usda-btn {
        width: 100%;
    }

    .usda-hero-visual {
        min-height: 400px;
    }

    .usda-house {
        transform: translateX(-50%) scale(.85);
    }

    .usda-intro-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }



    .usda-fit-card {
        min-height: auto;
    }

    .usda-info-card {
        padding: 30px;
        box-shadow: 12px 12px 0 var(--usda-gold);
    }

    .usda-process-grid {
        grid-template-columns: 1fr;
    }

    .usda-cta {
        padding: 70px 0;
    }

    .usda-cta-inner {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .usda-cta .usda-btn {
        width: 100%;
    }

    .usda-faq {
        padding-bottom: 75px;
    }

    .jumbo-hero-text h1 {
        font-size: 36px;
    }

    .jumbo-page .wrap {
        padding: 0 20px;
    }

    .jumbo-hero-text h1 {
        font-size: 30px;
    }

    .jumbo-hero {
        padding: 50px 0 45px;
    }


    .jumbo-about h2,
    .jumbo-features h2,
    .jumbo-split-text h2,
    .jumbo-calc-head h2,
    .jumbo-rate-head h2 {
        font-size: 28px;
    }

    .jumbo-cta h2 {
        font-size: 28px;
    }

    .jumbo-hero-img img {
        height: 320px;
    }

    .jumbo-split-img img {
        height: 320px;
    }

    .jumbo-rate-grid {
        grid-template-columns: 1fr;
        max-width: 450px;
        margin: 0 auto;
    }

    .jumbo-calc-box {
        flex-direction: column;
        padding: 32px 24px;
        gap: 30px;
    }

    .jumbo-calc-result .result-value {
        font-size: 36px;
    }

    .jumbo-calc-result {
        padding: 32px 26px;
    }

    .heloc-hero {
        padding: 70px 0 80px;
    }

    .heloc-hero h1 {
        font-size: 42px;
        letter-spacing: -1.5px;
    }

    .heloc-hero-copy {
        font-size: 16px;
    }

    .heloc-intro h2 {
        font-size: 36px;
        letter-spacing: 0;
    }

    .heloc-hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .heloc-btn {
        width: 100%;
    }

    .heloc-equity-card {
        padding: 28px;
    }

    .heloc-intro-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .heloc-use-grid {
        grid-template-columns: 1fr;
    }

    .heloc-use-card {
        min-height: auto;
    }

    .heloc-house {
        height: 250px;
    }

    .heloc-process-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .heloc-callout {
        padding: 80px 0;
    }

    .heloc-callout .heloc-btn {
        width: 100%;
    }

    .heloc-card-bottom {
        grid-template-columns: 1fr;
    }

    .heloc-faq-item summary {
        padding: 22px 45px 22px 0;
        font-size: 16px;
    }

    .heloc-faq-answer {
        padding: 0 0 22px 0;
    }


    .story-heading {
        margin-bottom: 40px;
    }

    .feature-cta .btn {
        justify-content: center;
    }

    .facc-panel-inner {
        padding-left: 46px;
    }

    .header-inner {

        gap: 15px;

    }

    .contact-wrapper .form-row {
        grid-template-columns: 1fr;
        gap: 20px;

    }



    .footer-wrap .footer-nav a {

        font-size: 16px;

    }



    .mortgage-btn {

        justify-content: center;

        flex-wrap: wrap;

    }



    header {

        padding: 15px 0;

    }



    .footer-wrap .footer-top {
        padding-bottom: 20px;
        margin-bottom: 0;
    }



    .footer-wrap .legal-text p {

        font-size: 12px;

    }



    .feature-section .feature-inner {

        flex-direction: column;

    }



    .feature-image-area img {

        position: unset;

        transform: unset;

        width: 100%;

        height: 350px;

        object-fit: cover;

    }



    .feature-section .feature-text {

        padding: 50px 0;

        text-align: center;



    }



    .feature-image-area {

        flex: 1;

        align-self: unset;

        display: flex;

        justify-content: center;

        position: relative;

    }



    .cta-section h2 {

        font-size: 32px;

    }



    .cta-section p {

        margin-bottom: 25px;

        font-size: 16px;

    }



    .cta-section {

        padding: 50px 0 110px;

        text-align: center;

        position: relative;

    }



    .resource-item {

        font-size: 16px;

    }



    .paths-section h3 {

        text-align: center;

        font-size: 24px;

    }



    .resources-title {

        text-align: center;

    }



    .resources-title::after {

        margin: 0 auto;

    }



    nav ul {

        gap: 15px;

        flex-wrap: wrap;

        justify-content: center;

    }



    .hero {

        padding: 50px 0;

    }





    .hero-content {

        width: 100%;

        text-align: center;

    }



    .hero h1 {

        font-size: 36px;

    }



    .hero p {

        margin: 0 auto;

        font-size: 1.2rem;

    }



    .hero::before {

        display: none;

    }



    .resources-wrapper {

        margin-top: 20px;

    }



    .resource-item {

        flex-direction: column;

        text-align: center;

        gap: 10px;

    }



    .cards-grid {

        grid-template-columns: 1fr;

    }



    .testimonial-card h3 {

        font-size: 1.4rem;

    }



    .form-row {

        flex-direction: column;

        gap: 20px;

    }



    .form-header h2 {

        font-size: 1.8rem;

    }



    .footer-top {

        flex-direction: column;

        gap: 20px;

        text-align: center;

    }



    .footer-nav {

        flex-direction: column;

        gap: 15px;

        margin: 0;

        align-items: center;

    }



    .footer-bottom {

        flex-direction: column;

        gap: 20px;

        text-align: center;

        justify-content: center;

    }



    .legal-text {

        justify-content: center;

        text-align: center;

        flex-direction: column;

        align-items: center;

    }



    .form-section .form-header {

        text-align: center;

    }



    .form-section {

        padding: 50px 0;

        background: var(--white);

    }

    .section-heading p {
        font-size: 16px;
    }

    .feature-strip .feature-strip-inner {
        gap: 20px;
        flex-direction: column;
        text-align: center;
    }
}

@media (max-width: 767px) {
    .mb-cres-hero {
        position: relative;
        display: block;
        width: 100%;
        min-height: auto;
        padding: 50px 20px;
        overflow: hidden;
        background: #182541;
        color: #ffffff;
        font-family: Arial, Helvetica, sans-serif;
        isolation: isolate;
    }

    .section-heading {
        margin-bottom: 0px;
    }

    .buying-wrapper .process-intro h2 {
        font-size: 28px;
        margin: 15px 0 14px;
    }

    .refi-hero .refi-heading h1 {
        font-size: 32px;
        letter-spacing: 0px;
    }

    .refi-hero .refi-art.architectural-refi {
        min-height: 380px;
    }

    .mb-cres-hero-stage {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        max-width: 1440px;
        margin: 0 auto;
    }

    /* =====================================
               BACKGROUND SHAPES
            ===================================== */

    .mb-cres-bg-shape {
        position: absolute;
        top: 0;
        width: 100%;
        height: 430px;
        pointer-events: none;
        z-index: -1;
    }

    .mb-cres-bg-left {
        left: -30%;
        background: #243653;
        clip-path: polygon(0 0,
                100% 0,
                70% 100%,
                0 100%);
    }

    .mb-cres-bg-right {
        right: -35%;
        background: #111d34;
        clip-path: polygon(55% 0,
                100% 0,
                100% 100%,
                20% 100%);
    }

    .mb-cres-bg-word {
        position: absolute;
        top: 300px;
        left: 50%;
        z-index: 0;
        transform: translate(-50%, -50%);
        color: rgba(255, 255, 255, 0.035);
        font-size: clamp(45px, 12vw, 82px);
        font-weight: 800;
        letter-spacing: 3px;
        line-height: 1;
        white-space: nowrap;
        pointer-events: none;
    }

    /* =====================================
               MAIN HEADING
            ===================================== */

    .mb-cres-hero-content {
        position: relative;
        order: 1;
        width: 100%;
        margin: 0 0 25px;
        padding: 0;
        text-align: center;
        z-index: 2;
    }

    .mb-cres-hero-eyebrow {
        margin: 0 0 13px;
        color: #b88e2f;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 2px;
        line-height: 1.6;
        text-transform: uppercase;
    }

    .mb-cres-hero-title {
        margin: 0;
        color: #ffffff;
        font-size: clamp(40px, 10vw, 54px);
        font-weight: 800;
        line-height: 1.06;
        letter-spacing: 0px !important;
    }

    .mb-cres-hero-title span {
        color: #b88e2f;
    }

    .mb-cres-gold-divider {
        width: 65px;
        height: 3px;
        margin: 18px auto;
        background: #d8b574;
    }

    /* =====================================
               INQUIRY LINK
            ===================================== */

    .mb-cres-inquiry-link {
        display: inline-block;
        padding-bottom: 5px;
        border-bottom: 1px solid rgba(216, 181, 116, 0.6);
        color: #ffffff;
        font-size: 13px;
        line-height: 1.7;
        text-decoration: none;
        cursor: pointer;
        transition: color 0.25s ease;
    }

    .mb-cres-inquiry-link:hover {
        color: #d8b574;
    }

    /* =====================================
               PORTRAITS
            ===================================== */

    .mb-cres-person-image {
        position: relative;
        display: block;
        width: 100%;
        max-width: 285px;
        height: auto;
        max-height: 340px;
        margin: 0 auto;
        object-fit: contain;
        object-position: center bottom;
        z-index: 1;
    }

    .mb-cres-phil-image {
        order: 2;
    }

    .mb-cres-pj-image {
        order: 4;
        margin-top: 32px;
    }

    /* =====================================
               PERSON DETAILS
            ===================================== */

    .mb-cres-person-info {
        position: relative;
        order: 3;
        width: 100%;
        max-width: 340px;
        margin: -2px auto 0;
        padding: 22px 16px;
        /* border: 1px solid rgba(216, 181, 116, 0.35); */
        background: rgb(24 37 65);
        text-align: center;
        z-index: 2;
    }

    .mb-cres-pj-info {
        order: 5;
        margin-top: -2px;
    }

    .mb-cres-person-name {
        margin: 0 0 12px;
        color: #ffffff;
        font-size: 23px !important;
        font-weight: 700;
        line-height: 1.3;
    }

    .mb-cres-person-divider {
        width: 55px;
        height: 2px;
        margin: 0 auto 16px;
        background: #d8b574;
    }

    /* =====================================
               APPLY BUTTONS
            ===================================== */

    .mb-cres-apply-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 16px;
        width: 100%;
        max-width: 250px;
        min-height: 48px;
        padding: 13px 20px;
        border: 1px solid #b88e2f;
        background: #b88e2f;
        color: #fff;
        font-size: 16px;
        line-height: 1.4;
        text-align: center;
        text-decoration: none;
        transition:
            background 0.25s ease,
            color 0.25s ease;
    }

    .mb-cres-apply-btn:hover {
        background: transparent;
        color: #b88e2f;
    }

    .mb-cres-apply-arrow {
        flex-shrink: 0;
    }

    .mb-cres-person-meta {
        margin: 12px 0 0;
        color: #d5d9e1;
        font-size: 12px !important;
        line-height: 1.6;
    }

    /* =====================================
               CSS-ONLY INQUIRY MODAL
            ===================================== */

    .mb-cres-modal-toggle {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }

    .mb-cres-modal-overlay {
        position: fixed;
        inset: 0;
        z-index: 99999;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px;
        background: rgba(8, 14, 27, 0.85);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition:
            opacity 0.25s ease,
            visibility 0.25s ease;
    }

    .mb-cres-modal-toggle:checked+.mb-cres-modal-overlay {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .mb-cres-modal-content {
        position: relative;
        width: 100%;
        max-width: 440px;
        max-height: 85vh;
        padding: 30px 22px;
        overflow-y: auto;
        border: 1px solid #b88e2f;
        background: #182541;
        color: #ffffff;
        transform: translateY(12px);
        transition: transform 0.25s ease;
    }

    .mb-cres-modal-toggle:checked+.mb-cres-modal-overlay .mb-cres-modal-content {
        transform: translateY(0);
    }

    .mb-cres-modal-title {
        margin: 0 35px 15px 0;
        color: #b88e2f;
        font-size: 25px;
        font-weight: 700;
        line-height: 1.3;
    }

    .mb-cres-modal-text {
        margin: 0 0 18px;
        color: #e1e5ed;
        font-size: 14px;
        line-height: 1.8;
    }

    .mb-cres-modal-close {
        position: absolute;
        top: 12px;
        right: 15px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        color: #ffffff;
        font-size: 28px;
        line-height: 1;
        text-decoration: none;
        cursor: pointer;
    }

    .mb-cres-modal-action {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 46px;
        padding: 12px 20px;
        background: #b88e2f;
        color: #182541;
        font-size: 14px;
        font-weight: 700;
        text-decoration: none;
    }

    .mb-cres-modal-action:hover {
        background: #c6a15f;
        color: #182541;
    }

    .diagonal-hero {
        display: none;
    }

    .purchase-page .split-heading {
        padding: 26px 18px;
    }

    .cct-about-page .relationship {
        text-align: center;
    }

    .cct-about-page .relationship aside {
        padding: 15px;
        background: #23335814;
    }

    .contact-in {
        text-align: center;
    }

    .cct-about-page .about-story {
        text-align: center;
    }

    .cct-about-page .story-pull {
        font-size: 20px;
        max-width: 100%;
        margin: 0 auto;
    }

    .cct-about-page .content {
        padding: 50px 15px;
    }

    .cct-about-page .story-rule {
        margin: 25px auto;
    }

    .cct-about-page .story-copy p {
        font-size: 16px;
    }

    .cct-about-page .about-inline-intro {
        grid-template-columns: 1fr;
        column-gap: 30px;
        text-align: center;
    }

    .cct-about-page .about-inline-intro .eyebrow {
        grid-column: 1;
    }

    .cct-about-page .about-inline-intro>p {
        grid-column: 1;
        grid-row: 2;
    }

    .cct-about-page .about-inline-intro h1 {
        text-align: center;
    }

    .home-page .split-heading {
        padding: 26px 18px;
    }

    .home-page .split-heading h1 {
        font-size: 37px;
    }

    .home-page .split-heading p {
        font-size: 17px;
    }

    .home-page .split-stage {
        grid-template-columns: 1fr;
    }

    .home-page .split-person {
        min-height: 360px;
    }

    .home-page .split-photo,
    .home-page .pj .split-photo {
        height: 390px;
        max-width: 65%;
        right: -15px;
        bottom: -35px;
    }

    .home-page .split-info {
        padding: 105px 20px 30px 7%;
        max-width: 70%;
    }

    .home-page .split-info h2 {
        font-size: 34px;
    }

    .home-page .split-info p {
        font-size: 12px;
    }

    .home-page .background-name {
        font-size: 190px;
    }

    .home-page .pj .background-name {
        font-size: 210px;
    }

    .home-page .graphic-ring {
        width: 330px;
        height: 330px;
        right: -60px;
        top: 35px;
    }

    .home-page .split-info:before {
        inset: 65px -12px 0 -10px;
    }

    .footer-in p {
        font-size: 14px;
        max-width: 235px;
    }

    .refinance-page .refi-check {
        grid-template-columns: 1fr;
        gap: 35px;
        text-align: center;
    }

    .refinance-page p {
        font-size: 16px;
    }

    .refinance-page .refi-option-grid p {
        font-size: 15px;
    }

    .refinance-page .content {
        padding: 50px 15px;
    }

    .refinance-page h2 {
        font-size: 28px;
    }

    .refinance-page .refi-option-grid article:nth-child(even) {
        padding-left: 25px;
    }

    .refinance-page .refi-option-grid article {
        padding: 25px 25px 25px 0;
    }

    .refinance-page .refi-heading h1 {
        font-size: 32px;
        letter-spacing: 0px;
    }

    .refinance-page .refi-art.architectural-refi {
        min-height: 380px;
    }

    .refinance-page .refi-section-heading {
        grid-template-columns: 1fr;
        gap: 15px;
        align-items: center;
        text-align: center;
    }

    .reviews-bottom h2 {
        font-size: 30px;
    }

    .reviews-hero p {
        font-size: 16px;
    }

    .reviews-hero h1 {
        font-size: 30px;
    }

    .finalcta h2 {
        font-size: 30px !important;
    }

    .finalcta p {
        font-size: 16px;
    }

    .finalcta-btn {
        gap: 20px;
        flex-wrap: wrap;
    }

    .hero__content {
        margin-bottom: 34px;
    }

    .advisor {
        grid-template-columns: 1fr;
    }

    .advisor__photo img {
        aspect-ratio: 16 / 10;
    }

    .advisor__info {
        padding: 28px 24px;
    }

    .purchase-page .split-heading h1 {
        font-size: 37px;
    }

    .purchase-page .split-heading p {
        font-size: 17px;
    }

    .purchase-page .split-stage {
        grid-template-columns: 1fr;
    }

    .purchase-page .split-person {
        min-height: 360px;
    }

    .purchase-page .split-photo,
    .purchase-page .pj .split-photo {
        height: 390px;
        max-width: 65%;
        right: -15px;
        bottom: -35px;
    }

    .purchase-page .split-info {
        padding: 105px 20px 30px 7%;
        max-width: 70%;
    }

    .purchase-page .split-info h2 {
        font-size: 34px;
    }

    .purchase-page .split-info p {
        font-size: 12px;
    }

    .purchase-page .background-name {
        font-size: 190px;
    }

    .purchase-page .pj .background-name {
        font-size: 210px;
    }

    .purchase-page .graphic-ring {
        width: 330px;
        height: 330px;
        right: -60px;
        top: 35px;
    }

    .purchase-page .split-info:before {
        inset: 65px -12px 0 -10px;
    }

    .purchase-page .purchase-hero-inner {
        grid-template-columns: 1fr;
    }

    .purchase-page .purchase-headline {
        padding: 40px 23px;
    }

    .purchase-page .purchase-headline>p {
        font-size: 18px;
    }

    .purchase-page .chapter-art {
        min-height: 310px;
    }

    .purchase-page .door-frame {
        top: 35px;
        left: auto;
        right: 12%;
        width: 135px;
        height: 230px;
    }

    .purchase-page .door-knob {
        top: 130px;
    }

    .purchase-page .chapter-label {
        bottom: 25px;
        max-width: 240px;
        background: transparent;
    }

    .purchase-page .chapter-label strong {
        font-size: 25px;
    }

    .purchase-page .art-floor {
        top: 245px;
    }

    .purchase-page .art-orbit {
        top: -220px;
    }

    .purchase-page .art-orbit.second {
        top: -155px;
    }

    .purchase-page .chapter-art {
        min-height: 300px;
        padding: 15px;
    }

    .purchase-page .purchase-artwork {
        max-width: 300px;
    }

    .purchase-page .chapter-art.modern-entry {
        min-height: 350px;
    }

    .purchase-page .modern-entry img {
        object-position: center 52%;
    }

    .financial-story-section .benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .cct-about-page .split-person {
        min-height: 390px
    }

    .cct-about-page .bio {
        padding: 25px
    }


    .cct-about-page .split-heading h1 {
        font-size: 32px
    }

    .legacy-section {
        display: none;
    }

    .legacy-persons.legacy-phils {
        margin-bottom: 25px;
    }

    .legacy-peopl {
        margin-top: 30px;
    }

    .legacy-contents {
        text-align: center;
    }

    .legacy-phil-labels {
        text-align: center;
        margin-top: 15px;
    }

    .legacy-phil-labels strong {
        display: block;
        font-size: 20px;
        font-weight: 700;
        margin-bottom: 3px;
        line-height: 1;
    }

    .legacy-phil-labels span {
        display: block;
        font-size: 16px;
        font-weight: 400;
    }

    .legacy-persons img {
        width: 100%;
        border-radius: 16px;
    }

    .legacy-sections.legacy-mobile {
        display: block;
        padding-bottom: 50px;
    }

    .legacy-phil-label {
        left: -90px;
    }

    .pc-main-block {
        padding: 50px 0 50px;
    }

    .pc-bio-column {
        text-align: center;
    }

    .pc-sidebar-title {
        text-align: center;
    }

    .pc-bio-body {
        columns: 1;
    }

    .rl-step {
        text-align: center;
    }

    .rl-step-icon {
        margin: 20px auto 20px;
    }

    .rl-process-heading h2 {
        font-size: 28px;
    }

    .rl-intro-grid {
        text-align: center;
    }

    .bridge-scenario-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .bridge-scenario-number {
        margin-bottom: 25px;
    }

    .bridge-scenario-card {
        text-align: center;
    }

    .usda-intro-content p {
        font-size: 16px;
    }

    .bridge-intro-content p {
        font-size: 16px;
    }

    .usda-feature-grid {
        grid-template-columns: 1fr;
    }

    .heloc-section-heading.center h2 {
        font-size: 28px;
        letter-spacing: 0;
    }

    .conventional-financing .option-grid {
        grid-template-columns: 1fr;
    }

    .fha-loan-option .who-list {
        grid-template-columns: 1fr;
    }

    .closing-process-section .process-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .section-padding {
        padding: 65px 0;
    }

    .why-section .why-image img {
        height: 100%;
    }

    .rl-hero-content {

        padding: 60px 0 30px;

    }


    .rl-hero-content h1 {

        font-size: 43px;

        letter-spacing: -1px;

    }


    .rl-hero-content>p {

        font-size: 14px;

    }


    .rl-hero-buttons {

        flex-direction: column;

        align-items: flex-start;

    }


    .rl-hero-visual {

        height: 430px;

    }


    .rl-before,
    .rl-after {

        width: 72%;

        height: 300px;

    }


    .rl-before {

        left: 0;

    }


    .rl-after {

        right: 0;

    }


    .rl-transform-badge {

        width: 90px;

        height: 90px;

    }


    .rl-transform-badge span {

        font-size: 7px;

    }



    .rl-intro-grid {

        grid-template-columns: 1fr;

        gap: 15px;

    }


    .rl-intro-copy {

        grid-column: auto;

    }


    .rl-intro-grid h2 {

        font-size: 35px;

    }


    .rl-project-header h2,
    .rl-benefits-heading h2,
    .rl-process-heading h2,
    .rl-faq-title h2 {

        font-size: 28px;

    }


    .rl-project-grid {

        grid-template-columns: 1fr;

    }


    .rl-project-large {

        grid-column: auto;

        min-height: 460px;

    }


    .rl-project-card {

        min-height: auto;

    }


    .rl-feature-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        text-align: center;
    }


    .rl-feature-side {
        grid-column: auto;
        gap: 10px;
        justify-content: center;
    }

    .rl-feature-content h2 {
        max-width: 100%;
        font-size: 28px;
    }

    .rl-feature-content p {
        max-width: 100%;
    }

    .rl-benefit {

        grid-template-columns: 40px 1fr 20px;

        gap: 12px;

    }


    .rl-benefit:hover {

        padding-left: 10px;

        padding-right: 10px;

    }


    .rl-benefit h3 {

        font-size: 19px;

    }


    .rl-process-steps {

        grid-template-columns: 1fr;

    }


    .rl-step,
    .rl-step:nth-child(2) {

        border-right: 0;

        border-bottom: 1px solid var(--rl-border);

        padding: 30px 0;

    }


    .rl-step:last-child {

        border-bottom: 0;

    }


    .rl-step:nth-child(3),
    .rl-step:nth-child(4) {

        border-top: 0;

    }

    .rl-story-quote h2 {
        font-size: 24px;
        letter-spacing: 0;
    }

    .rl-story-copy {
        padding: 30px;
        text-align: center;
    }


    .rl-faq-grid {

        gap: 40px;

    }


    .rl-final-content h2 {

        font-size: 43px;

    }


    .rl-final-buttons {

        flex-direction: column;

        align-items: stretch;

    }


    .rl-final-buttons .rl-btn {

        width: 100%;

    }


    .va-loan-hero {
        padding: 60px 0 50px;
    }

    .va-loan-hero-text h1 {
        font-size: 36px;
    }

    .va-loan-hero-text p {
        font-size: 15.5px;
    }

    .section-heading h2,
    .va-eligibility-content h2,
    .va-cta-content h2 {
        font-size: 28px;
    }

    .va-eligibility-image img {
        height: 300px;
    }

    .va-loan-hero-image img {
        height: 320px;
    }

    .va-loan-hero-buttons,
    .va-cta-buttons {
        flex-direction: column;
        width: 100%;
    }

    .va-loan-hero-buttons .btn,
    .va-cta-buttons .btn {
        text-align: center;
        width: 100%;
    }

    .va-hero-image-badge {
        bottom: -12px;
        left: -12px;
        padding: 14px 18px;
    }

    .va-hero-image-badge .badge-num {
        font-size: 22px;
    }

    .va-loan-cta {
        padding: 70px 0;
    }

    .va-cta-content p {
        font-size: 15px;
    }

    .va-faq-item h3 {
        font-size: 17px;
    }

    .va-faq-item p {
        font-size: 14.5px;
    }

    .testimonial-section {

        padding: 50px 15px;

    }



    .testimonial-slide {

        padding: 0 10px;

    }



    .navbar-nav {

        width: 320px;

        padding-left: 25px;

        padding-right: 25px;

    }



    .testimonial-card {

        min-height: auto;

        padding: 30px 30px;

        border-radius: 18px;

    }



    .testimonial-title {

        font-size: 21px;

        line-height: 1.15;



        margin-bottom: 15px;

    }



    .testimonial-text {

        font-size: 14px;

        padding-left: 0;

        margin-bottom: 25px;

    }



    .testimonial-bottom {

        justify-content: flex-start;



        flex-wrap: wrap;



        gap: 12px;

    }



    .testimonial-stars span {

        font-size: 24px;

    }



    .testimonial-author {

        font-size: 18px;

    }





    /* Smaller arrows */



    .testimonial-slider .slick-prev,

    .testimonial-slider .slick-next {

        width: 30px;

        height: 55px;

    }



    .testimonial-slider .slick-prev {

        left: -8px;

    }



    .testimonial-slider .slick-next {

        right: -8px;

    }



    .testimonial-slider .slick-prev:after {

        left: 2px;



        border-top-width: 25px;

        border-bottom-width: 25px;

        border-right-width: 19px;

    }



    .testimonial-slider .slick-next:after {

        right: 2px;



        border-top-width: 25px;

        border-bottom-width: 25px;

        border-left-width: 19px;

    }

    .main-banner h1 {
        font-size: 36px;
        margin-bottom: 12px;
        color: #233358;
        line-height: 1;
        text-transform: capitalize;
    }
}

@media(max-width:650px) {
    .cct-contact-page .reviews-hero-inner {
        padding: 45px 23px
    }

    .cct-about-page .team-layout .profile-copy {
        text-align: center;
    }

    .cct-about-page .team-layout .bio-actions {
        justify-content: center;
    }

    .cct-about-page .team-layout .unified-profiles {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .cct-contact-page .reviews-hero h1 {
        font-size: 35px
    }

    .cct-contact-page .reviews-grid {
        grid-template-columns: 1fr
    }

    .cct-contact-page .reviews-section-title,
    .cct-contact-page .reviews-bottom {
        align-items: flex-start;
        flex-direction: column
    }

    .cct-contact-page .cct-contact-hero-inner,
    .cct-contact-page .cct-contact-layout {
        grid-template-columns: 1fr
    }

    .cct-contact-page .cct-contact-hero-inner>p {
        font-size: 16px
    }

    .cct-contact-page .cct-contact-sidebar h2 {
        font-size: 28px
    }

    .cct-contact-page .cct-contact-form-panel h2 {
        font-size: 30px
    }

    .cct-contact-page .cct-contact-paths>.cct-content {
        padding: 35px 15px
    }

    .cct-contact-page .cct-contact-paths .cct-path-links {
        gap: 18px
    }
}

@media (max-width: 575px) {
    .pc-container {
        padding: 0 20px;
    }
.cct-contact-layout .fields {
    grid-template-columns: 1fr;
}
    .resources p {
        text-align: center;
    }

    .refi-options .refi-option-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .refi-options .refi-option-grid article {
        padding: 32px 0;
        text-align: center;
    }

    .refi-options .refi-option-grid p {
        max-width: 100%;
    }

    .refi-options .refi-option-grid article:nth-child(even) {
        padding-left: 0;
        padding-right: 0;
        border-left: unset;
    }

    .your-goals .reason {
        grid-template-columns: 1fr;
        gap: 15px;
        padding: 20px 0;
        text-align: center;
    }

    .home-page .resources a {
        flex-direction: column;
        text-align: center;
    }

    .loan-options-wrap .purchase-loan {
        align-items: center;
        text-align: center;
    }

    .loan-options-wrap h2 {
        font-size: 28px;
    }

    .loan-options-wrap .purchase-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .cta-wrapper .btn-cta {
        width: auto;
    }

    .purchase-page .purchase-headline h1 {
        font-size: 28px;
    }

    .purchase-page .purchase-grid {
        grid-template-columns: 1fr;
    }

    .purchase-page .purchase-loan h3 {
        width: 100%;
    }

    .purchase-page .purchase-icon {
        margin: 0 auto 20px;
    }

    .purchase-page .learn {
        text-align: center;
        width: 100%;
    }

    .apply-demo-header {
        padding: 20px;
    }

    .purchase-page h2 {
        font-size: 28px;
    }

    .purchase-page .purchase-loan {
        text-align: center;
    }

    .apply-popup-overlay {
        padding: 16px;
    }

    .purchase-page .step h3 {
        font-size: 18px;
    }

    .purchase-page .process-intro h2 {
        font-size: 30px;
    }

    .apply-popup-overlay .apply-popup-box {
        padding: 28px 22px 25px;
        border-radius: 16px;
    }

    .apply-popup-overlay .apply-popup-box h2 {
        margin-right: 15px;
        margin-bottom: 17px;
        font-size: 22px;
        line-height: 1.2;
    }

    .apply-popup-overlay .apply-popup-box p {
        font-size: 16px;
    }

    .apply-popup-overlay .apply-popup-close {
        top: 10px;
        right: 10px;
    }

    .apply-popup-overlay .apply-popup-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .apply-popup-overlay .apply-popup-btn {
        width: 100%;
        min-height: 50px;
        padding: 0 18px;
    }

    .cct-about-page .value {
        text-align: center;
    }

    .cct-about-page .value-icon {
        margin: 0 auto 20px;
    }

    .cct-about-page .about-inline-intro h1 {
        font-size: 28px;
    }

    .cct-about-page .values {
        grid-template-columns: 1fr
    }

    .home-page h2 br {
        display: none;
    }

    .home-page .loan {
        text-align: center;
    }

    .home-page .story aside {
        background: #23335814;
        text-align: center;
    }

    .about-in {
        text-align: center;
    }

    .home-page .loan .icon {
        margin: 0 auto 20px;
    }

    .home-page .quote p {
        font-size: 18px;
    }

    .home-page .quote {
        padding: 25px;
    }

    .home-page .resources {
        grid-template-columns: 1fr;
    }

    .home-page .grid {
        grid-template-columns: 1fr;
    }

    .refinance-page .refi-steps {
        grid-template-columns: repeat(1, 1fr);
    }

    .refinance-page .reason {
        grid-template-columns: 1fr;
        gap: 15px;
        align-items: center;
        padding: 20px 0;
        text-align: center;
    }

    .refinance-page .refi-steps article {
        text-align: center;
    }

    .refinance-page .refi-option-grid {
        grid-template-columns: 1fr;
    }

    .refinance-page .refi-option-grid article:nth-child(even) {
        padding-left: 0;
        border-left: unset;
    }

    .refinance-page .refi-option-grid article {
        text-align: center;
    }

    .refinance-page .refi-option-grid p {
        margin: 0 auto;
    }

    .cct-contact-page .cct-fields {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .cct-contact-page form small {
        text-align: center;
    }

    .cct-contact-page .cct-note {
        text-align: center;
    }

    .cct-contact-page .cct-btn {
        width: 100%;
    }

    .bridge-use-grid {
        grid-template-columns: 1fr;
    }

    .rl-project-large h3 {
        font-size: 24px;
    }

    .rl-project-card {
        text-align: center;
    }

    .rl-project-icon {
        margin-bottom: 25px;
        margin: 0 auto 20px;
    }

    .va-process-card {
        text-align: center;
    }

    .bridge-use-card {
        text-align: center;
    }

    .bridge-use-icon {
        margin: 0 auto 20px;
    }

    .va-benefits-grid,
    .va-process-grid {
        grid-template-columns: 1fr;
    }

    .va-benefit-card {
        text-align: center;
    }

    .va-benefit-icon {
        margin: 0 auto 20px;
    }

    .jumbo-card .icon {
        margin: 0 auto 20px;
    }

    .usda-fit-card {
        text-align: center;
    }

    .usda-fit-number {
        margin-bottom: 25px;
    }

    .usda-fit-grid {
        grid-template-columns: 1fr;
    }

    .jumbo-card {
        text-align: center;
    }

    .jumbo-stats .wrap {
        grid-template-columns: repeat(1, 1fr);
    }

    .heloc-intro h2 {
        font-size: 30px;
    }

    .fha-loan-difference .feature-content h2 {
        font-size: 30px;
    }

    .heloc-intro-content p {
        font-size: 16px;
    }

    .fha-loan-option .who-content h2 {
        font-size: 30px;
    }

    .closing-process-section .process-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .closing-process-section .process-card {
        text-align: center;
    }

    .fha-benefits-section .benefit-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .reviews-experience-stat h3 {
        font-size: 24px;
    }

    .qualification-section .requirement {
        text-align: center;
    }

    .qualification-section .req-icon {
        margin: 0 auto 20px;
    }

    .qualification-section .requirements-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .feature-strip .strip-info h2 {
        font-size: 28px;
    }

    .who-section .who-content h2 {
        font-size: 28px;
    }

    .qualification-section .requirements-heading h2 {
        font-size: 30px;
    }

    .benefits-section .benefits-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .benefits-section .benefit-card {
        text-align: center;
    }

    .benefits-section .benefit-icon {
        margin: 0 auto 20px;
    }

    .benefits-section .benefit-card h3 {
        font-size: 20px;
    }

    .conventional-financing .option-item {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .financial-story-section .benefits-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .why-section .benefit-list {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .why-section .why-content h2 {
        font-size: 28px;
        margin-bottom: 15px;
    }

    .why-section .why-content>p {
        margin-bottom: 20px;
    }

    .process-section .process-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .refi-page .options-grid-text {
        grid-template-columns: 1fr;
    }

    .refi-page .options-grid-text {
        gap: 0;
    }

    .refi-page .opt-block {
        padding: 25px 0 !important;
        text-align: center;
    }

    .refi-page .opt-desc {
        max-width: 100%;
    }

    .process-section .process-card {
        padding: 20px;
        text-align: center;
    }

    .loan-options .loan-card {
        padding: 25px;
        text-align: center;
    }

    .loan-options .loan-icon {
        margin: 0 auto 20px;
    }

    .loan-options .section-heading {
        margin-bottom: 30px;
    }

    .loan-options .read-more {
        justify-content: center;
    }

    .intro-form-wrapper .intro-left {
        text-align: center;
    }

    .contact-wrapper .section-divider {
        width: 100%;
    }

    .loan-options .loan-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .why-section .why-list {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .main-banner h1 {
        font-size: 32px;
    }

    .main-banner p {
        font-size: 16px;
    }

    .jumbo-card-grid {
        grid-template-columns: 1fr;
    }


    .refi-page .gold-band {
        padding: 50px 0;
    }

    .refi-page .how-timeline {
        grid-template-columns: 1fr;
    }

    .refi-page .why-row {
        grid-template-columns: 1fr;
        gap: 12px;
        border: 1px solid #e5e7eb;
        padding: 20px;
        text-align: center;
    }

    .refi-page .why-desc {
        grid-column: auto;
    }

    .paths-section .cards-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .paths-section .card {
        align-items: center;
        text-align: center;
    }

    .pc-hero {
        padding: 50px 0 50px;
    }

    .pc-hero-photo-wrap {
        max-width: 300px;
    }

    .pc-stats-inner {
        grid-template-columns: 1fr 1fr;
        gap: 20px 10px;
    }

    .pc-stat-num {
        font-size: 26px;
    }

    .pc-stat-label {
        font-size: 10px;
        letter-spacing: 1.2px;
    }

    .pc-bio-signature {
        flex-direction: column;
        align-items: flex-start;
    }

    .pc-badges-track {
        gap: 36px;
    }

    .pc-badge img {
        height: 44px;
    }

    .pc-acc-panel-inner {
        padding-left: 20px;
    }

    .pc-acc-label {
        font-size: 16px;
    }

    .pc-btn {
        padding: 14px 26px;
        font-size: 12px;
    }

    .form-section .form-header h2 {

        font-size: 28px;

    }

    .feature-name {
        font-size: 26px;
    }

    .feature-photo {
        max-width: 220px;
    }

    .about-page-hero .mortgage-btn {

        flex-wrap: wrap;

    }



    .section-head h2 {

        font-size: 26px;

    }



    .values-grid {

        grid-template-columns: 1fr;

    }

    .form-section input.number {

        width: 100%;

    }



    .hero-sub {

        font-size: 18px;

    }



    .hero h1 {

        font-size: 30px;

    }



    .feature-section .feature-text h2 {

        font-size: 24px;

    }



    .feature-section .feature-text p {

        margin-bottom: 20px;

        font-size: 16px;

    }



    .form-section .form-row {

        grid-template-columns: 1fr;

    }



    .form-section .form-header p {

        font-size: 16px;

    }



    .navbar-nav {

        width: 290px;

        max-width: 88%;



        padding-left: 20px;

        padding-right: 20px;

    }



    .cta-buttons {

        flex-direction: column;

        align-items: center;

    }



    .testimonial-card {

        text-align: center;

    }



    .testimonial-bottom {

        justify-content: center;

        flex-direction: column;

    }



    .testimonial-title {

        font-size: 21px;

    }



    .testimonial-container {

        width: 100%;

    }



    .testimonial-wrap {

        gap: 10px;

        flex-direction: column;

        text-align: center;

    }



    .testimonial-title {

        margin-bottom: 0;

    }



    .resources-wrapper .resources-links {

        grid-template-columns: repeat(1, 1fr);

    }



    .logo-area {

        max-width: 230px;

    }



    .navbar-toggle {

        width: 40px;

        height: 40px;

    }



    .navbar-toggle span {

        width: 25px;

    }



    .legacy-section {

        height: 770px;

    }



    .legacy-pj {

        left: 60%;

        transform: translateX(-40%);

    }



    .legacy-pj-label {

        top: 145px;

        left: -100px;

    }



    .legacy-pj-label span {

        font-size: 10px;

    }



    .legacy-phil-label span {

        font-size: 10px;

    }



    .legacy-pj {

        width: 300px;

        height: 310px;

    }

}

/* ---------- Mobile ---------- */

@media (max-width: 991px) {

    .navbar-nav .header-menu li {

        width: 100%;

        border-bottom: 1px solid #eee;

    }



    .navbar-nav .header-menu li a {
        padding: 4px 10px;
        width: 100%;
        font-size: 14px;
    }



    /* Submenu becomes static in mobile */

    .navbar-nav .header-menu .sub-menu {

        position: static;

        opacity: 1;

        visibility: visible;

        transform: none;

        box-shadow: none;

        border-radius: 0;

        background: #f8f9fa;

        display: none;
        /* hidden by default, toggled by JS */

        padding: 0;

    }



    .navbar-nav .header-menu .sub-menu li a {

        padding-left: 10px;

        font-size: 14px;

    }



    .navbar-nav .header-menu .sub-menu .sub-menu li a {

        padding-left: 20px;

    }



    /* Rotate arrow when submenu is open */

    .navbar-nav .header-menu li.submenu-open>a::after {

        transform: rotate(180deg);

    }

}


/* 15-10-2026 */


/* Mobile */
@media (max-width: 480px) {
    .purchase-page .people {
        grid-template-columns: 1fr;
        max-width: 350px;
    }

    .qualify-lead-form .lead-row {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0;
    }

    .cct-about-page .fields {
        grid-template-columns: 1fr;
    }

    .home-page .people {
        grid-template-columns: 1fr;
        max-width: 350px;
    }

    .home-page .portrait {
        height: 260px;
    }

    .home-page .portrait img {
        height: 350px;
    }

    .home-page .person {
        border-radius: 16px;
    }

    .home-page .people {
        padding-bottom: 24px;
    }

    .home-page h1 {
        font-size: 36px;
    }

    .home-page .grid,
    .home-page .fields {
        grid-template-columns: 1fr;
    }

    .home-page .loan p {
        min-height: 0;
        margin-bottom: 18px;
    }

    .home-page .finalcta .btn {
        margin: 6px;
    }

    .home-page header img {
        width: 190px;
    }

    .home-page .layered-inner {
        padding: 27px 22px 0;
    }

    .home-page .layered-copy h1 {
        font-size: 43px;
        letter-spacing: -1.4px;
    }

    .home-page .layered-copy .eyebrow {
        font-size: 8px;
        letter-spacing: 1px;
    }

    .home-page .layered-copy>p {
        font-size: 17px;
    }

    .home-page .hero-inquiry {
        font-size: 13px;
    }

    .home-page .hero-markets {
        font-size: 8px;
    }

    .home-page .leaders-composition {
        min-height: 425px;
    }

    .home-page .leader-cutout,
    .home-page .pj-cutout {
        height: 310px;
        bottom: 122px;
    }

    .home-page .phil-cutout {
        height: 300px;
        left: -15px;
    }

    .home-page .pj-cutout {
        right: -28px;
    }

    .home-page .leader-halo {
        width: 310px;
        height: 310px;
        left: calc(50% - 155px);
        top: 0;
    }

    .home-page .leader-callout h2 {
        font-size: 17px;
    }

    .home-page .leader-callout p {
        font-size: 9px;
        max-width: 145px;
    }

    .home-page .leader-callout .btn {
        font-size: 12px;
        padding: 10px 15px;
    }

    .home-page .pj-callout {
        right: 0;
    }

    .home-page .leader-callout {
        width: 49%;
        bottom: 19px;
    }

    .home-page .callout-rule {
        margin-bottom: 10px;
    }

    .home-page .crescenzo-motion.hero-texture {
        padding-top: 250px;
    }

    .home-page .crescenzo-motion.hero-texture span {
        font-size: 185px;
    }

    .home-page .motion-control {
        top: auto;
        bottom: 7px;
        right: 12px;
        padding: 3px 8px;
        font-size: 9px;
    }

    .home-page .leader-callout {
        bottom: 30px;
    }

    .home-page .diagonal-message>p {
        font-size: 14px;
        max-width: 310px;
        margin: auto;
    }

    .home-page .diagonal-phil {
        height: 375px;
    }

    .home-page .diagonal-person-label h2 {
        max-width: 170px;
    }

    .home-page .diagonal-motion-control {
        bottom: 10px;
    }

    .home-page .diagonal-stage {
        height: 665px;
    }

    .home-page .diagonal-message {
        padding: 35px 15px 0;
    }

    .home-page .diagonal-message h1 {
        font-size: clamp(33px, 8.8vw, 42px);
        letter-spacing: -1px;
        margin: 13px 0;
    }

    .home-page .diagonal-portrait {
        height: 340px;
        bottom: 132px;
    }

    .home-page .diagonal-phil {
        left: calc(25% - 138px);
        bottom: 131px;
        height: 340px;
    }

    .home-page .diagonal-pj {
        right: calc(25% - 144px);
        bottom: 131px;
        height: 340px;
    }

    .home-page .diagonal-person-label {
        height: 143px;
        padding: 20px 10px 12px;
    }

    .home-page .diagonal-person-label h2 {
        font-size: 16px;
    }

    .home-page .diagonal-person-label .btn {
        font-size: 12px;
        padding: 12px 6px;
    }

    .home-page .left-shape {
        clip-path: polygon(0 255px, 76% 255px, 38% 100%, 0 100%);
    }

    .home-page .right-shape {
        clip-path: polygon(0 0, 100% 0, 100% 100%, 38% 100%, 76% 255px, 0 255px);
    }

    .home-page .diagonal-word {
        top: 280px;
        font-size: 120px;
    }

    .purchase-page .portrait {
        height: 260px;
    }

    .purchase-page .portrait img {
        height: 350px;
    }

    .purchase-page .person {
        border-radius: 16px;
    }

    .purchase-page .people {
        padding-bottom: 24px;
    }

    .purchase-page h1 {
        font-size: 36px;
    }

    .purchase-page .grid,
    .purchase-page .fields {
        grid-template-columns: 1fr;
    }

    .purchase-page .loan p {
        min-height: 0;
        margin-bottom: 18px;
    }

    .purchase-page .finalcta .btn {
        margin: 6px;
    }

    .purchase-page header img {
        width: 175px;
    }

    .purchase-page header img {
        width: 190px;
    }

    .eligibility-popup-box {
        padding: 25px 18px;
    }

    .cct-about-page .unified-profile .split-info h2 {
        font-size: 25px
    }

    .cct-about-page .unified-profile .split-info .eyebrow {
        max-width: 130px;
        font-size: 8px
    }

    .cct-about-page .profile-copy {
        padding: 24px
    }

    .cct-about-page .unified-profile .split-photo,
    .cct-about-page .unified-profile .pj .split-photo {
        right: -45px
    }

    .cct-about-page .unified-profile .split-info {
        padding-left: 6%
    }

    .eligibility-popup-header h3 {
        font-size: 19px;
    }

    /* Prevent iPhone zoom */
    .eligibility-popup-body input {
        font-size: 14px !important;
    }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 1080px) {
    .advisor {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .advisor__photo img {
        aspect-ratio: 16 / 10;
        object-position: center 20%;
    }

    .advisor__info {
        padding: 32px 28px;
    }
}


@media (max-width: 420px) {
    .hero h1 {
        font-size: 2.35rem;
    }

    .cct-contact-layout .primary-btn {
        width: 100% !important;
    }

    .form-wrapper form .btn {
        width: 100%;
    }

    .advisor__info {
        padding: 26px 22px;
    }

    .btn {
        width: 100%;
        text-align: center;
    }
}

/* ============================================================
   ACCESSIBILITY
   ============================================================ */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        transition-duration: 0.001ms !important;
    }

    .btn:hover,
    .advisor:hover {
        transform: none;
    }

    .advisor:hover .advisor__photo img {
        transform: none;
    }
}