.wpcf7 .screen-reader-response {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
word-wrap: normal !important;
}
.wpcf7 .hidden-fields-container {
display: none;
}
.wpcf7 form .wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid #00a0d2; }
.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
display: none;
}
.wpcf7 form.sent .wpcf7-response-output {
border-color: #46b450; }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
border-color: #dc3232; }
.wpcf7 form.spam .wpcf7-response-output {
border-color: #f56e28; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: #ffb900; }
.wpcf7-form-control-wrap {
position: relative;
}
.wpcf7-not-valid-tip {
color: #dc3232; font-size: 1em;
font-weight: normal;
display: block;
}
.use-floating-validation-tip .wpcf7-not-valid-tip {
position: relative;
top: -2ex;
left: 1em;
z-index: 100;
border: 1px solid #dc3232;
background: #fff;
padding: .2em .8em;
width: 24em;
}
.wpcf7-list-item {
display: inline-block;
margin: 0 0 0 1em;
}
.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
content: " ";
}
.wpcf7-spinner {
visibility: hidden;
display: inline-block;
background-color: #23282d; opacity: 0.75;
width: 24px;
height: 24px;
border: none;
border-radius: 100%;
padding: 0;
margin: 0 24px;
position: relative;
}
form.submitting .wpcf7-spinner {
visibility: visible;
}
.wpcf7-spinner::before {
content: '';
position: absolute;
background-color: #fbfbfc; top: 4px;
left: 4px;
width: 6px;
height: 6px;
border: none;
border-radius: 100%;
transform-origin: 8px 8px;
animation-name: spin;
animation-duration: 1000ms;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@media (prefers-reduced-motion: reduce) {
.wpcf7-spinner::before {
animation-name: blink;
animation-duration: 2000ms;
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes blink {
from {
opacity: 0;
}
50% {
opacity: 1;
}
to {
opacity: 0;
}
}
.wpcf7 [inert] {
opacity: 0.5;
}
.wpcf7 input[type="file"] {
cursor: pointer;
}
.wpcf7 input[type="file"]:disabled {
cursor: default;
}
.wpcf7 .wpcf7-submit:disabled {
cursor: not-allowed;
}
.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
direction: ltr;
}
.wpcf7-reflection > output {
display: list-item;
list-style: none;
}
.wpcf7-reflection > output[hidden] {
display: none;
}.cmplz-video.cmplz-iframe-styles{background-color:transparent}.cmplz-video.cmplz-hidden{visibility:hidden !important}.cmplz-blocked-content-notice{display:none}.cmplz-placeholder-parent{height:inherit}.cmplz-optin .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optin .cmplz-wp-video .cmplz-blocked-content-notice,.cmplz-optout .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optout .cmplz-wp-video .cmplz-blocked-content-notice{display:block}.cmplz-blocked-content-container,.cmplz-wp-video{animation-name:cmplz-fadein;animation-duration:600ms;background:#FFF;border:0;border-radius:3px;box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15);display:flex;justify-content:center;align-items:center;background-repeat:no-repeat !important;background-size:cover !important;height:inherit;position:relative}.cmplz-blocked-content-container.gmw-map-cover,.cmplz-wp-video.gmw-map-cover{max-height:100%;position:absolute}.cmplz-blocked-content-container.cmplz-video-placeholder,.cmplz-wp-video.cmplz-video-placeholder{padding-bottom:initial}.cmplz-blocked-content-container iframe,.cmplz-wp-video iframe{visibility:hidden;max-height:100%;border:0 !important}.cmplz-blocked-content-container .cmplz-custom-accept-btn,.cmplz-wp-video .cmplz-custom-accept-btn{white-space:normal;text-transform:initial;cursor:pointer;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:200px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-custom-accept-btn:focus,.cmplz-wp-video .cmplz-custom-accept-btn:focus{border:1px dotted #cecece}.cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-wp-video .cmplz-blocked-content-notice{white-space:normal;text-transform:initial;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:300px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links{display:block;margin-bottom:10px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links a,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links a{color:#fff}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body{display:block}.cmplz-blocked-content-container div div{display:none}.cmplz-wp-video .cmplz-placeholder-element{width:100%;height:inherit}@keyframes cmplz-fadein{from{opacity:0}to{opacity:1}}a,
a:visited,
a:hover,
a:active {
color: inherit;
text-decoration: none;
list-style: none;
} :root { --container-max-xs:   96%;
--container-max-sm:   540px;
--container-max-md:   720px;
--container-max-lg:   960px;
--container-max-xl:   1140px;
--container-max-xxl:  1320px; --gravity-blue: oklch(0.278 0.0902 263);
--gravity-green: #89fc00;
--gravity-yellow: #F5CB5C;
--gravity-darkblue: #010B21;
--gravity-midblue: #05163A;
--gravity-lightblue: #23396D;
--gravity-lightestblue: #3A5284;
--gravity-gray: #161616;
--gravity-offwhite: rgb(221, 221, 221);
--gravity-font-family: "articulat-cf", sans-serif;
--gravity-font-style: normal;
--bold: 800;
--demi-bold: 700;
--normal: 400; --container-padding-x: 1rem;
--offer-gap: 1rem;
--offer-card-width: 350px;
--offer-card-height: 350px;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.spacer{
padding-top: 1rem;
}
html, body {
margin: 0;
padding: 0;
background-color: transparent;
}
body {
font-style: var(--gravity-font-style);
font-family: var(--gravity-font-family);
} h1, h2, h3, h4, h5, h6 {
margin: 0;
border-bottom: none;
padding: 0;
}
h2 {
line-height: 1.2;
}
br {
margin: 0;
padding: 0;
} .reviews-title, .how-it-works-title, .how-refi-saves-title, .time-to-refi-title, .our-process-steps-title, .beyond-refi-title, .documents-you-need-title, .faq-hero-title, .glossary-hero-title, .about-hero-title, .careers-hero-title, .blog-title, .offer-wall-title, .benefits-title{
font-weight: var(--bold);
font-size: 36px;
color: var(--gravity-darkblue);
border-bottom: none;
text-align: center;
margin: 0;
padding: 0;
padding-bottom: 0.5rem;
}
.reviews-subtitle, .how-refi-saves-subtitle, .time-to-refi-subtitle, .our-process-steps-subtitle, .beyond-refi-subtitle, .documents-you-need-subtitle, .benefits-subtitle, .faq-hero-subtitle, .glossary-hero-subtitle, .about-hero-subtitle, .careers-hero-subtitle, .blog-subtitle, .offer-wall-subtitle{
font-weight: 400;
padding-bottom: 1.5rem;
}
@keyframes lp-phone-ring {
0% {
transform: rotate(0deg);
}
5% {
transform: rotate(-18deg);
}
10% {
transform: rotate(18deg);
}
15% {
transform: rotate(-14deg);
}
20% {
transform: rotate(14deg);
}
25% {
transform: rotate(-8deg);
}
30% {
transform: rotate(8deg);
}
35% {
transform: rotate(0deg);
}
100% {
transform: rotate(0deg);
}
}
.cta-phone-icon{
animation: lp-phone-ring 3s ease-in-out infinite;
color: var(--gravity-green);
}
.container {
width: var(--container-max-xs); margin-inline: auto;
padding-inline: var(--container-padding-x);
box-sizing: border-box;
}
.content{
padding-bottom: 2rem;
text-align: center;
} .nav-menu{ list-style: none;
display: flex;
align-items: center;
justify-content: center;
position: sticky;
top: 0;
left: 0;
right: 0;
width: 100%;
height: 100%;
background-color: rgb(255, 255, 255);
flex-direction: row;
justify-content: flex-start;
gap: 8px;
transform: translateY(-100%);
animation: slideIn 0.2s ease-out forwards;
z-index: 1000;
padding: 1.5rem;
color: rgb(0, 0, 0);
}
@keyframes slideIn {
to { transform: translateY(0); }
}
.nav-menu a {
text-decoration: none;
color: var(--gravity-darkblue);
}
.site-nav{
display: flex;
flex-direction: row;
flex: 1;
align-items: center;
}
.site-header{
display: flex;
position: fixed;
top: 1%;
left: 50%;
transform: translateX(-50%);
width: calc(100% - 2rem);
max-width: 1400px;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 18px;
padding: 1rem;
height: 72px;
gap: 16px;
z-index: 9999999;
background: rgba(227, 227, 227, 0.8);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
box-shadow: 0 4px 32px rgba(0, 0, 0, 0.35), 0 1px 0 rgba(255, 255, 255, 0.08);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.apply-now-nav-btn{
all: unset;
margin-left: auto;
border-radius: 12px;
padding: 0.5rem 0.5rem;
background-color: var(--gravity-green);
color: var(--gravity-blue);
} .hero{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100%;
padding-top: 7rem;
font-family: var(--gravity-font-family);
position: relative;
}
.hero-text{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: var(--gravity-darkblue);
}
h1.hero-text-title{
font-weight: var(--bold);
font-size: 56px;
color: var(--gravity-darkblue);
border-bottom: none; line-height: 1;
letter-spacing: -2px;
}
@keyframes heroSlideInRight {
from {
opacity: 0;
transform: translateX(40px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
.hero-title-line-1,
.hero-title-line-2 {
display: block;
opacity: 0;
}
.hero-title-line-1 {
animation: heroSlideInRight 0.6s ease 0.1s forwards;
}
.hero-title-line-2 {
animation: heroSlideInRight 0.6s ease 0.35s forwards;
}
h2.hero-text-subtitle{
font-weight: var(--normal);
font-size: 20px;
}
.apply-now-btn{
all: unset;
text-align: center;
border-radius: 12px;
width: 100px;
margin-top: 8px;
padding: 0.5rem 0.5rem;
background-color: var(--gravity-green);
color: var(--gravity-darkblue) !important;
border: 1px solid var(--gravity-gray);
cursor: pointer;
}
.apply-now-btn-nav{
all: unset;
text-align: center;
border-radius: 12px;
margin-left: 12px;
padding: 0.4rem 0.85rem;
font-size: 14px;
white-space: nowrap;
background-color: var(--gravity-green);
color: var(--gravity-blue);
border: 1px solid var(--gravity-gray);
cursor: pointer;
} .screen-reader-text {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.nav-search-btn {
all: unset;
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
margin-left: 12px;
border-radius: 50%;
cursor: pointer;
transition: background-color 0.2s ease;
}
.nav-search-btn:hover {
background-color: rgba(0, 0, 0, 0.06);
}
.nav-search-btn img {
width: 20px;
height: 20px;
display: block;
}
body.search-open {
overflow: hidden;
}
.search-overlay {
position: fixed;
inset: 0;
z-index: 10000000;
display: flex;
flex-direction: column;
align-items: center;
padding: 18vh 1.5rem 2rem;
background: rgba(1, 11, 33, 0.92);
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
opacity: 0;
visibility: hidden;
transition: opacity 0.25s ease, visibility 0.25s ease;
}
.search-overlay.is-open {
opacity: 1;
visibility: visible;
}
.search-overlay-close {
all: unset;
position: absolute;
top: 24px;
right: 28px;
font-size: 2.5rem;
line-height: 1;
color: rgba(255, 255, 255, 0.8);
cursor: pointer;
transition: color 0.2s ease;
}
.search-overlay-close:hover {
color: #fff;
}
.search-overlay-form {
display: flex;
align-items: center;
gap: 8px;
width: 100%;
max-width: 640px;
background: #fff;
border-radius: 50px;
padding: 6px 6px 6px 24px;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}
.search-overlay-input {
flex: 1;
min-width: 0;
border: none;
outline: none;
background: transparent;
font-family: inherit;
font-size: 1.1rem;
color: var(--gravity-darkblue);
padding: 12px 0;
}
.search-overlay-input::placeholder {
color: #98a2b3;
}
.search-overlay-submit {
all: unset;
display: inline-flex;
align-items: center;
justify-content: center;
width: 48px;
height: 48px;
flex-shrink: 0;
border-radius: 50%;
background: var(--gravity-green);
cursor: pointer;
transition: transform 0.15s ease;
}
.search-overlay-submit:hover {
transform: scale(1.05);
}
.search-overlay-submit img {
width: 20px;
height: 20px;
display: block;
}
.mobile-menu-search {
all: unset;
box-sizing: border-box;
display: flex;
align-items: center;
gap: 10px;
width: 100%;
padding: 0.9rem 0;
color: var(--gravity-darkblue);
font-weight: var(--demi-bold);
cursor: pointer;
}
.mobile-menu-search img {
width: 18px;
height: 18px;
} .search-page {
max-width: 800px;
margin: 0 auto;
padding: 140px 1.5rem 80px;
}
.search-page-title {
font-size: clamp(1.6rem, 4vw, 2.2rem);
color: var(--gravity-darkblue);
margin-bottom: 8px;
}
.search-page-title span {
color: var(--gravity-blue);
}
.search-page-subtitle {
color: #667085;
margin-bottom: 32px;
}
.search-page-form {
display: flex;
align-items: center;
gap: 8px;
background: #fff;
border: 1px solid var(--gravity-gray, #d6dce6);
border-radius: 50px;
padding: 4px 4px 4px 20px;
margin-bottom: 40px;
}
.search-page-form input[type="search"] {
flex: 1;
min-width: 0;
border: none;
outline: none;
background: transparent;
font-family: inherit;
font-size: 1rem;
color: var(--gravity-darkblue);
padding: 12px 0;
}
.search-page-form button {
all: unset;
display: inline-flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
flex-shrink: 0;
border-radius: 50%;
background: var(--gravity-green);
cursor: pointer;
}
.search-page-form button img {
width: 18px;
height: 18px;
}
.search-result {
display: block;
padding: 22px 24px;
border: 1px solid #e7eaf0;
border-radius: 14px;
margin-bottom: 16px;
text-decoration: none;
transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.search-result:hover {
box-shadow: 0 8px 28px rgba(1, 11, 33, 0.08);
transform: translateY(-2px);
}
.search-result-type {
display: inline-block;
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--gravity-blue);
background: rgba(137, 252, 0, 0.15);
padding: 3px 10px;
border-radius: 20px;
margin-bottom: 10px;
}
.search-result-title {
font-size: 1.25rem;
font-weight: var(--demi-bold);
color: var(--gravity-darkblue);
margin: 0 0 6px;
}
.search-result-excerpt {
color: #667085;
font-size: 0.95rem;
line-height: 1.55;
margin: 0;
}
.search-no-results {
color: #667085;
line-height: 1.7;
} .search-pagination {
display: flex;
gap: 8px;
flex-wrap: wrap;
margin-top: 32px;
}
.search-pagination .page-numbers {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 40px;
height: 40px;
padding: 0 8px;
border-radius: 8px;
border: 1px solid #e7eaf0;
color: var(--gravity-darkblue);
text-decoration: none;
font-weight: 600;
}
.search-pagination .page-numbers.current {
background: var(--gravity-green);
border-color: var(--gravity-green);
color: var(--gravity-blue);
}
.search-pagination .page-numbers:hover:not(.current) {
border-color: var(--gravity-blue);
}
.cta-text-title{
font-size: 32px;
font-weight: var(--bold);
}
.cta-text-subtitle{
font-size: 1rem;
font-weight: var(--normal);
color: rgba(255, 255, 255, 0.65);
line-height: 1.6;
margin: 0;
}
.check-my-rate-btn{
all: unset;
border-radius: 12px;
width: 240px;
margin-top: 24px;
padding: 0.5rem 0.5rem;
font-size: 20px;
font-weight: var(--demi-bold);
background-color: var(--gravity-green);
color: var(--gravity-blue);
border: 1px solid var(--gravity-gray);
cursor: pointer;
}
.hero-image-wrap {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: clamp(350px, 20vw, 600px);
}
@keyframes drawPlane {
0%   { clip-path: inset(0 0 0 100%); }
19%  { clip-path: inset(0 0 0 0%); }
100% { clip-path: inset(0 0 0 0%); }
}
.hero-plane {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
z-index: 0;
pointer-events: none;
user-select: none;
transform: translate(calc(-50% + 90px), calc(-50% - 60px));
animation: drawPlane 6.2s ease-out 0.4s infinite both;
}
.hero-image {
position: relative;
z-index: 1;
width: 100%;
}
.cta {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
.cta-text {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: var(--gravity-darkblue);
padding: 2rem 2rem;
border-radius: 1.5rem;
color: white;
gap: 0.6rem;
width: 100%;
max-width: 500px;
}
.cta-eyebrow {
font-size: 0.78rem;
font-weight: var(--demi-bold);
letter-spacing: 0.09em;
text-transform: uppercase;
color: var(--gravity-green);
margin: 0;
}
.cta-phone-number {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: clamp(1.75rem, 3.5vw, 2.4rem);
font-weight: var(--bold);
color: white;
text-decoration: none;
line-height: 1;
margin: 0.25rem 0 0.25rem;
transition: color 0.2s ease;
}
.cta-phone-number:hover { color: var(--gravity-green); }
.cta-apply-btn {
margin-top: 0.5rem;
padding: 0.65rem 2rem !important;
width: auto !important;
font-size: 0.95rem;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.cta-bottom {
display: flex;
align-items: center;
justify-content: center;
padding: 2rem 1rem 3rem;
}
.cta-bottom-inner {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
background-color: var(--gravity-darkblue);
border-radius: 1.5rem;
padding: 3.5rem 2.5rem;
width: 100%;
max-width: 720px;
gap: 0.75rem;
}
.cta-bottom-eyebrow {
font-size: 0.8rem;
font-weight: var(--demi-bold);
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--gravity-green);
margin: 0;
}
.cta-bottom-title {
font-size: clamp(2rem, 4vw, 2.75rem);
font-weight: var(--bold);
color: white;
margin: 0.25rem 0 0.5rem;
line-height: 1.15;
}
.cta-bottom-subtitle {
color: rgba(255, 255, 255, 0.7);
font-size: 1rem;
line-height: 1.65;
max-width: 520px;
margin: 0 0 0.75rem;
}
.cta-bottom-btn {
all: unset;
cursor: pointer;
background-color: var(--gravity-green);
color: var(--gravity-blue);
font-weight: var(--demi-bold);
font-size: 1rem;
border-radius: 12px;
padding: 0.75rem 2rem;
border: 1px solid var(--gravity-gray);
margin-top: 0.5rem;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.cta-bottom-btn:hover { transform: translateY(-2px); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18); }
.cta-bottom-phone {
font-size: 0.875rem;
color: rgb(255, 255, 255);
margin: 0;
}
.cta-bottom-phone a {
color: rgb(255, 255, 255);
text-decoration: none;
}
.cta-bottom-phone a:hover { color: white; }
.benefits{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: var(--gravity-darkblue);
border-radius: 1rem;
padding: 1rem;
} .benefits-columns{
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: repeat(6, auto);
grid-auto-flow: column;
column-gap: 8px;
row-gap: 8px;
padding-top: 16px;
text-align: center;
}
.benefits-left, .benefits-right{
display: contents;
}
.feature{
display: grid;
grid-template-rows: subgrid;
grid-row: span 3;
justify-items: center;
text-align: center;
opacity: 0;
transform: translateY(28px);
transition: opacity 0.7s ease, transform 0.7s ease;
background-color: rgba(0, 0, 0, 0.03);
border-radius: 12px;
padding: 1rem;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
.feature.feature-visible {
opacity: 1;
transform: translateY(0);
}
.benefits-right .feature:nth-child(1) { transition-delay: 0.18s; }
.benefits-left .feature:nth-child(2)  { transition-delay: 0.36s; }
.benefits-right .feature:nth-child(2) { transition-delay: 0.54s; }
.feature:nth-child(2){
margin-top: 1.5rem;
}
.benefits-photo{
border-radius: 1rem;
width: clamp(325px, 40vw, 600px);
}
.how-it-works{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.how-it-works-timeline{
display: flex;
flex-direction: column;
padding: 16px;
margin-top: 12px;
gap: 16px;
max-width: 360px;
border-radius: 16px;
color: var(--gravity-darkblue); }
.how-it-works-title .how-it-works-subtitle{
color: var(--gravity-darkblue);
}
.how-it-works-subtitle{
font-weight: var(--normal);
}
.how-it-works-title {
opacity: 0;
transform: translateX(28px);
transition: opacity 0.7s ease, transform 0.7s ease;
}
.how-it-works-title.feature-visible {
opacity: 1;
transform: translateY(0);
}
.how-it-works-step {
display: flex;
gap: 14px;
opacity: 0;
transform: translateY(28px);
transition: opacity 0.7s ease, transform 0.7s ease;
}
.how-it-works-step.feature-visible {
opacity: 1;
transform: translateY(0);
}
.how-it-works-step:nth-child(2) {
transition-delay: 0.18s;
}
.how-it-works-step:nth-child(3) {
transition-delay: 0.36s;
}
.step-indicator {
display: flex;
flex-direction: column;
align-items: center;
flex-shrink: 0;
}
.step-dot {
width: 30px;
height: 30px;
border-radius: 50%;
background-color: var(--gravity-green);
color: var(--gravity-darkblue);
display: flex;
align-items: center;
justify-content: center;
font-weight: var(--bold);
font-size: 14px;
flex-shrink: 0;
transform: scale(0);
transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) 0.2s;
}
.how-it-works-step.feature-visible .step-dot {
transform: scale(1);
}
.how-it-works-step:nth-child(2) .step-dot { transition-delay: 0.38s; }
.how-it-works-step:nth-child(3) .step-dot { transition-delay: 0.56s; }
.step-line {
width: 2px;
flex: 1;
min-height: 16px;
margin-top: 6px;
background-color: rgba(144, 144, 144, 0.2);
transform-origin: top;
transform: scaleY(0);
transition: transform 0.4s ease 0.55s;
}
.how-it-works-step.feature-visible .step-line {
transform: scaleY(1);
}
.how-it-works-step:nth-child(2) .step-line { transition-delay: 0.75s; }
.how-it-works-step:nth-child(3) .step-line { transition-delay: 0.93s; }
.how-it-works-step:last-child .step-line {
display: none;
}
.step-body {
flex: 1;
padding-bottom: 0.5rem;
}
.how-it-works-step-title{
padding-bottom: 0.5rem;
font-weight: var(--bold);
}
.how-it-works-step-content{
font-weight: var(--normal);
}
.feature-icon{
width: 50px;
}
.savings-stat {
display: flex;
justify-content: center;
padding: 1.5rem 1rem;
}
.savings-stat-inner {
display: flex;
align-items: center;
gap: 1.5rem;
background-color: var(--gravity-darkblue);
border-radius: 1rem;
padding: 1.5rem 2.5rem;
opacity: 0;
transform: translateY(28px);
transition: opacity 0.7s ease, transform 0.7s ease;
}
.savings-stat-inner.feature-visible {
opacity: 1;
transform: translateY(0);
}
.savings-stat-number {
font-size: clamp(2.5rem, 5vw, 3.5rem);
font-weight: var(--bold);
color: var(--gravity-green);
line-height: 1;
white-space: nowrap;
}
.savings-stat-divider {
width: 1px;
height: 3rem;
background-color: rgba(255, 255, 255, 0.15);
flex-shrink: 0;
}
.savings-stat-text {
font-size: 0.95rem;
font-weight: var(--demi-bold);
color: rgba(255, 255, 255, 0.8);
line-height: 1.5;
}
.reviews{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.reviews-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: var(--gravity-darkblue);
}
.review-grid{
display: flex;
flex-direction: column;
gap: 16px; align-items: center;
justify-content: center;
}
.review-card{
display: flex;
position: relative;
padding: 8px;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background-color: var(--gravity-darkblue);
color: white;
border-radius: 8px;
}
.google-icon{
position: absolute;
top: 5%;
right: 5%;
}
.review-source-icon{
position: absolute;
top: 5%;
right: 5%;
}
.review-card-text {
display: -webkit-box;
-webkit-line-clamp: 4;
line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
}
.review-card-meta{
font-size: 0.72rem;
opacity: 0.65;
margin-bottom: 4px;
}
.review-card-date{
position: absolute;
top: 5%;
left: 8px;
font-size: 0.72rem;
opacity: 0.55;
}
.how-refi-saves{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
color: var(--gravity-darkblue);
}
.how-refi-saves-title{
padding: 0 4rem;
padding-bottom: 0.5rem;
}
.how-refi-saves-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/how-refi-saves-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.how-refi-saves-hero-title{
text-align: center;
color: white;
font-size: 36px;
font-weight: var(--bold);
}
.how-refi-saves-hero-subtitle{
font-weight: var(--normal);
font-size: 24px;
text-align: center;
color: white;
}
.how-refi-saves-card-container{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
align-items: center;
justify-items: center;
}
.how-refi-saves-card-1, .how-refi-saves-card-2, .how-refi-saves-card-3, .how-refi-saves-card-4{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: var(--gravity-darkblue);
max-width: 200px;
min-height: 314px;
border-radius: 12px;
position: relative;
overflow: hidden;
cursor: pointer;
opacity: 0;
transform: translateY(28px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.how-refi-saves-card-1.refi-card-visible,
.how-refi-saves-card-2.refi-card-visible,
.how-refi-saves-card-3.refi-card-visible,
.how-refi-saves-card-4.refi-card-visible {
opacity: 1;
transform: translateY(0);
}
.how-refi-saves-card-2 { transition-delay: 0.15s; }
.how-refi-saves-card-3 { transition-delay: 0.3s; }
.how-refi-saves-card-4 { transition-delay: 0.45s; }
.how-refi-saves-card-1{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/longer-loan-term.png);
background-size: cover;
background-position: center;
}
.how-refi-saves-card-2{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/lower-monthly-payment.png);
background-size: cover;
background-position: center;
}
.how-refi-saves-card-3{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/lower-interest-rate.png);
background-size: cover;
background-position: center;
}
.how-refi-saves-card-4{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/shorter-loan-term.png);
background-size: cover;
background-position: center;
}
.how-refi-saves-card-title{
text-transform: uppercase;
color: white;
text-align: center;
padding: 0 0.5rem;
position: relative;
z-index: 1;
transition: opacity 0.2s ease;
}
.how-refi-saves-card-1:hover .how-refi-saves-card-title,
.how-refi-saves-card-2:hover .how-refi-saves-card-title,
.how-refi-saves-card-3:hover .how-refi-saves-card-title,
.how-refi-saves-card-4:hover .how-refi-saves-card-title{
opacity: 0;
}
.how-refi-saves-card-overlay{
position: absolute;
bottom: 0;
left: 0;
right: 0;
background-color: var(--gravity-darkblue);
border-radius: 0 0 12px 12px;
display: flex;
align-items: center;
justify-content: center;
padding: 1.25rem;
transform: translateY(100%);
transition: transform 0.35s ease;
}
.how-refi-saves-card-overlay p{
color: white;
font-size: 16px;
text-align: center;
line-height: 1.5;
margin: 0;
}
.how-refi-saves-card-1:hover .how-refi-saves-card-overlay,
.how-refi-saves-card-2:hover .how-refi-saves-card-overlay,
.how-refi-saves-card-3:hover .how-refi-saves-card-overlay,
.how-refi-saves-card-4:hover .how-refi-saves-card-overlay{
transform: translateY(0);
}
.time-to-refi{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
.time-to-refi-content{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 32px;
}
.time-to-refi-point{
opacity: 0;
transform: translateY(28px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.time-to-refi-point.time-to-refi-point-visible{
opacity: 1;
transform: translateY(0);
}
.time-to-refi-point-wrapper hr{
border: none;
border-top: 1px solid var(--gravity-offwhite);
margin: 0.25rem;
width: 100%;
}
.time-to-refi-point-title{
font-weight: var(--demi-bold);
}
.time-to-refi-point-subtitle{
padding: 0 5rem;
}
.time-to-refi-title-wrapper{
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
gap: 4px;
}
.time-to-refi-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: var(--gravity-darkblue);
}
.our-process-cta{
display: flex;
color: white;
flex-direction: column;
align-items: center;
justify-content: center;
max-width: 420px;
min-height: 300px;
border-radius: 24px;
padding: 0rem 0.5rem;
background-color: var(--gravity-darkblue);
}
.our-process-steps-title, .our-process-steps-subtitle{
color: white;
}
.our-process-title{
font-size: 24px;
font-weight: var(--demi-bold);
}
.our-process-cta-title{
font-size: 28px;
font-weight: var(--bold);
padding-bottom: 16px; padding: 0 2rem;
}
.our-process-cta-subtitle{
padding-bottom: 12px; padding: 0 2rem;
}
.our-process-mobile-wrapper{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 16px;
}
.our-process-desktop-wrapper{
display: none;
}
.our-process-steps{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 12px;
background-color: var(--gravity-darkblue);
}
.our-process-mobile-step{
background-color: var(--gravity-darkblue);
color: white;
border-radius: 12px;
padding: 1rem;
max-width: 450px;
}
.documents-you-need{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
.documents-you-need-content{
display: flex;
flex-direction: column;
}
.documents-photo-wrapper{
display: none;
}
.documents-you-need-step{
font-size: 20px;
}
.documents-you-need-step-title{
font-size: 20px;
cursor: pointer;
font-weight: var(--demi-bold);
}
.documents-you-need-accordian li{
text-decoration: none;
list-style: none;
font-size: 1rem;
padding: 0.2rem 0;
}
.documents-you-need-accordian ul{
padding: 0.25rem 0 0.25rem 0.75rem;
}
.doc-subcategory{
font-weight: var(--demi-bold);
font-size: 0.9rem;
margin-top: 0.6rem;
}
.beyond-refi{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
.beyond-refi-card-container{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 16px;
}
.beyond-refi-card{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
color: white;
width: 100%;
max-width: 350px;
min-height: 250px;
border-radius: 12px;
opacity: 0;
transform: translateY(28px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.beyond-refi-card.beyond-refi-card-visible{
opacity: 1;
transform: translateY(0);
}
.beyond-refi-card:hover{
transform: scale(1.02);
transition: transform 0.3s ease;
}
.beyond-refi-card-title{
font-size: 24px;
font-weight: var(--demi-bold);
padding-bottom: 12px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
}
.beyond-refi-card-content{
padding: 0 0.5rem;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
}
.beyond-refi-card-1{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/lease-buyout.png);
background-size: cover;
background-position: center;
}
.beyond-refi-card-2{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/co-borrower.png);
background-size: cover;
background-position: center;
}
.beyond-refi-card-3{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/remove-co-borrower.png);
background-size: cover;
background-position: center;
}
.beyond-refi-card-4{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/vehicle-transfer.png);
background-size: cover;
background-position: center;
}
.beyond-refi-cta-btn-wrapper{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 8px;
}
.beyond-refi-btn{
all: unset;
margin-left: auto;
border-radius: 12px;
padding: 0.5rem 0.5rem;
background-color: var(--gravity-green);
color: var(--gravity-blue);
cursor: pointer;
}
.privacy-policy-content {
max-width: 780px;
margin: 0 auto;
color: var(--gravity-darkblue);
line-height: 1.7;
}
.privacy-policy-effective-date {
font-weight: var(--demi-bold);
margin-bottom: 1.5rem;
}
.privacy-policy-section {
margin-top: 2rem;
}
.privacy-policy-section h2 {
font-size: 22px;
font-weight: var(--bold);
margin-bottom: 0.75rem;
border-bottom: 2px solid var(--gravity-darkblue);
padding-bottom: 0.4rem;
}
.privacy-policy-section ul {
padding-left: 1.5rem;
margin-top: 0.5rem;
}
.privacy-policy-section li {
margin-bottom: 0.6rem;
}
.privacy-policy-section a {
color: var(--gravity-darkblue);
text-decoration: underline;
}
.privacy-policy-address {
font-style: normal;
line-height: 2;
}
.terms-hero {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/privacy-policy-hero.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 60dvh;
color: white;
}
.terms-hero-title {
text-align: center;
color: white;
}
.terms-hero-subtitle {
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.sms-privacy-policy-hero {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/privacy-policy-hero.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 60dvh;
color: white;
}
.sms-privacy-policy-hero-title {
text-align: center;
color: white;
}
.sms-privacy-policy-hero-subtitle {
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.privacy-policy-hero {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/privacy-policy-hero.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 60dvh;
color: white;
}
.privacy-policy-hero-title {
text-align: center;
color: white;
}
.privacy-policy-hero-subtitle {
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.offer-wall-hero {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/offer-wall-hero.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 60dvh;
color: white;
}
.offer-wall-hero-title {
text-align: center;
color: white;
}
.offer-wall-hero-subtitle {
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.glossary-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/glossary-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.glossary-hero-title{
text-align: center;
color: white;
}
.glossary-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.glossary-content{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
.glossary-alphabet-wrapper{
display: flex;
align-items: center;
justify-content: center;
height: 50px;
text-align: center;
background-color: var(--gravity-green);
border-radius: 12px;
padding: 12px;
}
.glossary-icon{
width: 40px;
}
.glossary-alphabet-letters{
display: flex;
gap: 6px;
flex-wrap: wrap;
justify-content: center;
}
.glossary-alphabet-letters a {
color: #000000;
font-weight: 700;
font-size: 1rem;
text-decoration: none;
padding: 2px 6px;
border-radius: 4px;
transition: background 0.15s, color 0.15s;
}
.glossary-alphabet-letters a:hover {
background: var(--gravity-darkblue);
text-decoration: none;
color: white;
}
.glossary-definitions{
display: flex;
flex-direction: column;
align-items: left;
justify-content: left;
gap: 16px;
}
.glossary-def-content{
display: flex;
flex-direction: column;
align-items: left;
justify-content: left;
text-align: left;
}
.faq-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/faq-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.faq-hero-title{
text-align: center;
color: white;
}
.faq-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.faq-card-wrapper{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 12px;
padding-top: 1rem;
}
.faq-card{
width: 100%;
max-width: 680px;
border-radius: 18px;
padding: 1rem 1.25rem;
color: white;
background-color: var(--gravity-darkblue);
text-align: left;
cursor: pointer;
}
.faq-title{
font-size: 24px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}
.faq-title::after {
content: '';
flex-shrink: 0;
width: 9px;
height: 9px;
border-right: 2.5px solid rgba(255,255,255,0.75);
border-bottom: 2.5px solid rgba(255,255,255,0.75);
transform: rotate(45deg);
transition: transform 0.3s ease;
margin-top: -4px;
}
.faq-card.active .faq-title::after {
transform: rotate(-135deg);
margin-top: 4px;
}
.faq-card p {
font-size: 18px;
padding-top: 0.5rem;
max-height: 0;
overflow: hidden;
opacity: 0;
transition: max-height 0.4s ease, opacity 0.3s ease;
}
.faq-card.active p {
max-height: 600px;
opacity: 1;
}
.about-us-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/about-us.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.about-hero-title{
text-align: center;
color: white;
}
.about-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.about-us-text{
text-align: left;
padding: 1.5rem 1rem;
}
.about-us-text::before{
content: '';
display: block;
width: 3rem;
height: 3px;
background-color: var(--gravity-green);
margin-bottom: 1.25rem;
border-radius: 2px;
}
.about-us-text p{
font-size: clamp(0.95rem, 1.5vw, 1.05rem);
line-height: 1.8;
color: var(--gravity-darkblue);
margin-bottom: 1.1rem;
}
.about-us-text p:last-child{
margin-bottom: 0;
font-weight: var(--demi-bold);
color: var(--gravity-lightblue);
}
.contact-layout{
display: flex;
flex-direction: column;
}
.contact-left-col,
.contact-right-col{
width: 100%;
}
.our-awards{
padding: 0 1rem 1.5rem;
border-top: 1px solid var(--gravity-offwhite);
margin-top: 0.5rem;
padding-top: 1.5rem;
}
.logo-wrapper{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1.75rem;
}
.top-work-places{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 36px;
}
.top-work-places img{
max-height: 250px;
width: auto;
object-fit: contain;
opacity: 0;
transform: translateY(28px);
transition: opacity 0.7s ease, transform 0.7s ease;
}
.top-work-places img.award-visible {
opacity: 1;
transform: translateY(0);
}
.top-work-places img:nth-child(2) {
transition-delay: 0.18s;
}
.top-work-places img:nth-child(3) {
transition-delay: 0.36s;
}
.top-work-places img:nth-child(4) {
transition-delay: 0.54s;
}
.top-work-places img:nth-child(5) {
transition-delay: 0.72s;
}
.best-places{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 12px;
flex-wrap: wrap;
}
.best-places img{
max-height: 75px;
width: auto;
object-fit: contain;
}
.lending-tree-awards{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
align-items: center;
justify-items: center;
}
.award-col-1, .award-col-2{
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
}
.lending-tree-awards img{
max-height: 55px;
width: auto;
object-fit: contain;
}
.leadership-wrapper{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.john-scofield, .brian-jones, .tommy-predmore, .mark-lavagni, .holly-gleason{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.award-col-1, .award-col-2{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.careers-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/careers-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.careers-hero-title{
text-align: center;
color: white;
}
.careers-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.careers{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.careers-window{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
border-radius: 1rem;
margin-top: 2rem;
margin-bottom: 2rem;
color: white;
width: clamp(350px, 85%, 850px);
background-color: var(--gravity-darkblue);
padding: 1rem 0.25rem;
}
.careers-interior-window{
background-color: white;
color: var(--gravity-darkblue);
width: 95%;
border-radius: 0.5rem;
}
.careers-window-title{
font-weight: var(--bold);
}
.careers-window-subtitle{
font-weight: var(--normal);
padding-bottom: 0.5rem;
}
.careers-opening{
display: flex;
flex-direction: column;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
.careers-opening:last-child{
border-bottom: none;
}
.career-summary{
display: flex;
flex-direction: column;
gap: 4px;
align-items: center;
justify-content: center;
padding: 0.75rem 0.5rem;
cursor: pointer;
transition: background-color 0.2s ease;
border-radius: 0.5rem 0.5rem 0 0;
}
.career-summary:hover,
.careers-opening.open .career-summary{
background-color: rgba(0, 0, 0, 0.04);
}
.career-title{
font-weight: var(--demi-bold);
font-size: 18px;
}
.career-location{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.career-location img{
margin-left: 6px;
transition: transform 0.35s ease;
}
.careers-opening.open .career-location img{
transform: rotate(90deg);
}
.career-details{
display: grid;
grid-template-rows: 0fr;
transition: grid-template-rows 0.35s ease;
}
.career-details-inner{
overflow: hidden;
}
.careers-opening.open .career-details{
grid-template-rows: 1fr;
}
.career-details-content{
padding: 1rem 1.5rem 1.5rem;
text-align: left;
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.career-details-content h3{
font-size: 1.1rem;
font-weight: var(--demi-bold);
color: var(--gravity-darkblue);
margin-bottom: 0.25rem;
}
.career-details-tagline{
font-size: 0.92rem;
color: #555;
margin-bottom: 0.75rem;
}
.career-details-meta{
display: flex;
flex-direction: column;
gap: 0.2rem;
font-size: 0.9rem;
margin-bottom: 1rem;
padding-bottom: 0.75rem;
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.career-details-section{
margin-bottom: 1rem;
}
.career-details-section h4{
font-size: 1rem;
font-weight: var(--demi-bold);
color: var(--gravity-darkblue);
margin-bottom: 0.4rem;
}
.career-details-section h5{
font-size: 0.9rem;
font-weight: var(--demi-bold);
color: var(--gravity-lightestblue);
margin-top: 0.75rem;
margin-bottom: 0.25rem;
}
.career-details-section ul{
padding-left: 1.25rem;
margin-bottom: 0.5rem;
}
.career-details-section ul li{
margin-bottom: 0.3rem;
font-size: 0.92rem;
line-height: 1.5;
}
.career-details-section p{
font-size: 0.92rem;
line-height: 1.5;
}
.career-details-cta{
padding-top: 0.75rem;
border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.career-details-cta p{
font-size: 0.92rem;
line-height: 1.5;
margin-bottom: 0.5rem;
}
.career-details-disclaimer{
font-size: 0.8rem;
color: #777;
font-style: italic;
margin-bottom: 1rem;
}
.career-apply-btn{
display: inline-block;
background-color: var(--gravity-lightblue);
color: white;
padding: 0.6rem 1.5rem;
border-radius: 2rem;
font-weight: var(--demi-bold);
text-decoration: none;
font-size: 0.95rem;
transition: opacity 0.2s ease;
}
.career-apply-btn:hover{
opacity: 0.8;
color: white;
}
.career-apply-btn:visited{
color: white;
} .careers-no-openings {
text-align: center;
padding: 2rem 1.5rem 0.5rem;
}
.careers-no-openings-title {
font-size: 1.4rem;
font-weight: var(--bold);
margin-bottom: 0.5rem;
}
.careers-no-openings-body {
color: var(--gravity-darkblue);
opacity: 0.75;
max-width: 560px;
margin: 0 auto;
line-height: 1.6;
}
.careers-no-openings-body a {
color: var(--gravity-blue);
text-decoration: underline;
font-weight: var(--demi-bold);
}
.careers-resume-wrapper {
text-align: left;
padding: 1.5rem 1.5rem 2rem;
}
.gl-field input[type="file"] {
padding: 10px 14px;
cursor: pointer;
}
.gl-field input[type="file"]::file-selector-button {
margin-right: 12px;
padding: 8px 16px;
border: none;
border-radius: var(--radius-lg);
background: var(--navy);
color: var(--white);
font-weight: 600;
font-size: 0.85rem;
cursor: pointer;
transition: background var(--transition);
}
.gl-field input[type="file"]::file-selector-button:hover {
background: var(--navy-mid);
}
.careers-benefits-strip{
width: 100%;
background-color: white;
padding: 2rem 1.5rem;
border-bottom: 1px solid rgba(0,0,0,0.07);
}
.careers-benefits-inner{
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 1.5rem 2.5rem;
max-width: 900px;
margin: 0 auto;
}
.careers-benefit-item{
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
color: var(--gravity-darkblue);
text-align: center;
width: 100px;
opacity: 0;
transform: translateY(20px);
transition: opacity 0.5s ease, transform 0.5s ease;
}
.careers-benefit-item.benefit-visible {
opacity: 1;
transform: translateY(0);
}
.careers-benefit-item:nth-child(2) { transition-delay: 0.08s; }
.careers-benefit-item:nth-child(3) { transition-delay: 0.16s; }
.careers-benefit-item:nth-child(4) { transition-delay: 0.24s; }
.careers-benefit-item:nth-child(5) { transition-delay: 0.32s; }
.careers-benefit-item:nth-child(6) { transition-delay: 0.40s; }
.careers-benefit-item svg{
width: 36px;
height: 36px;
stroke: var(--gravity-lightblue);
fill: none;
stroke-width: 1.75;
stroke-linecap: round;
stroke-linejoin: round;
flex-shrink: 0;
}
.careers-benefit-item span{
font-size: 0.78rem;
font-weight: var(--demi-bold);
line-height: 1.3;
}
.blog{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.blog-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/blog-hero.png);
background-size: cover;
background-position: center;
width: 100%; 
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.blog-hero-title{
text-align: center;
color: white;
}
.blog-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.blog-tag-wrapper{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
}
.blog-tag-title{
font-size: 18px;
text-decoration: underline;
}
.blog-tag-row-1, .blog-tag-row-2{
display: flex;
flex-direction: row;
gap: 8px;
}
.blog-tag{
display: flex;
align-items: center;
justify-content: center;
height: 20px;
max-width: 70px;
background-color: var(--gravity-green);
padding: 0.5rem;
border-radius: 0.5rem;
font-size: 9px;
text-wrap: nowrap;
text-align: center;
cursor: pointer;
transition: background-color 0.2s ease, color 0.2s ease;
}
.blog-tag:hover {
background-color: var(--gravity-darkblue);
color: #fff;
}
.blog-tag.active {
background-color: var(--gravity-darkblue);
color: #fff;
}
.blog-tag-reset-btn {
display: inline-flex;
align-items: center;
height: 20px;
padding: 0.5rem;
border-radius: 0.5rem;
font-size: 9px;
text-wrap: nowrap;
cursor: pointer;
background-color: transparent;
border: 1px solid var(--gravity-darkblue);
color: var(--gravity-darkblue);
transition: background-color 0.2s ease, color 0.2s ease;
}
.blog-tag-reset-btn:hover {
background-color: var(--gravity-darkblue);
color: #fff;
}
.blog-section-divider{
border: none;
border-top: 1px solid var(--gravity-offwhite);
margin: 0.5rem 0 1.5rem;
}
.blog-featured-section{
margin-bottom: 2rem;
width: 100%;
}
.blog-featured-heading{
font-size: 22px;
font-weight: var(--demi-bold);
color: var(--gravity-darkblue);
margin-bottom: 1rem;
text-align: center;
}
.blog-featured-row{
display: flex;
flex-direction: column;
gap: 12px;
}
.blog-featured-card{
display: flex;
flex-direction: column;
justify-content: flex-end;
width: 100%;
height: 220px;
border-radius: 14px;
padding: 1rem;
gap: 6px;
background-size: cover;
background-position: center;
position: relative;
transition: transform 0.3s ease;
}
.blog-featured-card::after{
content: '';
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.5);
border-radius: 14px;
z-index: 0;
}
.blog-featured-card:hover{
transform: scale(1.01);
}
.blog-featured-card-title{
color: white;
font-size: 16px;
font-weight: var(--demi-bold);
position: relative;
z-index: 1;
}
.blog-featured-card-excerpt{
color: rgba(255, 255, 255, 0.85);
font-size: 12px;
line-height: 1.4;
position: relative;
z-index: 1;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.blog-featured-card .blog-card-tag-wrapper{
position: relative;
z-index: 1;
margin-right: 0;
align-self: center;
}
.blog-grid{
display: grid;
grid-template-columns: repeat(auto-fill, minmax(150px, 190px));
justify-content: center;
align-items: center;
justify-items: center;
gap: 10px;
}
.blog-card{
display: flex;
flex-direction: column;
align-items: center;
text-align: left;
justify-content: end;
width: 100%;
max-width: 190px;
height: 250px;
border-radius: 14px;
gap: 4px;
padding: 1rem 0.5rem;
transition: transform 0.3s ease;
background-size: cover;
background-position: center;
position: relative;
}
.blog-card::after{
content: '';
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.45);
border-radius: 14px;
z-index: 0;
}
.blog-card:hover{
transform: scale(1.02);
}
.blog-card-date{
color: rgba(255, 255, 255, 0.75);
font-size: 9px;
margin-right: auto;
position: relative;
z-index: 1;
}
.blog-card-tag-wrapper{
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 4px;
margin-right: auto;
position: relative;
z-index: 1;
}
.blog-card-tag{
background-color: var(--gravity-green);
padding: 0.25rem;
border-radius: 4px;
font-size: 8px;
text-wrap: nowrap;
}
.blog-card-title{
color: white;
margin-right: auto;
font-weight: var(--demi-bold);
position: relative;
z-index: 1;
}
.blog-card-subtitle{
color: white;
font-size: 10px;
margin-right: auto;
font-weight: var(--normal);
position: relative;
z-index: 1;
}
.blog-card-hidden{
display: none;
}
@keyframes blogCardFadeIn {
from {
opacity: 0;
transform: translateY(16px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.blog-card-revealed{
display: flex;
animation: blogCardFadeIn 0.4s ease forwards;
}
.blog-view-all-wrapper{
display: flex;
justify-content: center;
margin-top: 2rem;
}
.blog-view-all-btn{
background-color: var(--gravity-green);
color: rgb(0, 0, 0);
border: none;
border-radius: 50px;
padding: 0.75rem 2rem;
font-size: 14px;
font-weight: var(--demi-bold);
cursor: pointer;
transition: opacity 0.2s ease, transform 0.2s ease;
}
.blog-view-all-btn:hover{
opacity: 0.85;
transform: scale(1.03);
}
.blog-card-1{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/save-money-stress.png);
background-size: cover;
background-position: center;
}
.blog-card-2{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/lower-payments.png);
background-size: cover;
background-position: center;
}
.blog-card-3{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/gap-coverage-matters.png);
background-size: cover;
background-position: center;
}
.blog-card-4{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/depreciation-protection.png);
background-size: cover;
background-position: center;
}
.blog-card-5{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/use-autoloan-refi.png);
background-size: cover;
background-position: center;
}
.blog-card-6{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/top-reasons-cosigner.png);
background-size: cover;
background-position: center;
}
.blog-featured-wrapper, .blog-latest-wrapper{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
max-width: 110px;
min-height: 110px;
gap: 12px;
}
.blog-featured-photo, .blog-latest-photo{
border-radius: 12px;
}
.blog-featured-grid, .blog-latest-grid{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 12px;
}
.blog-featured-title, .blog-featured-date, .blog-latest-title, .blog-latest-date{
font-size: 12px;
} .single-blog-post{
display: flex;
flex-direction: column;
align-items: center;
padding-top: 5rem;
}
.single-blog-thumbnail img{
width: 100%;
max-height: 400px;
object-fit: cover;
border-radius: 16px;
}
.single-blog-content{
padding-top: 2rem;
padding-bottom: 4rem;
text-align: left;
max-width: 760px;
}
.single-blog-meta{
display: flex;
flex-direction: row;
align-items: center;
gap: 12px;
padding-bottom: 1rem;
}
.single-blog-date{
font-size: 13px;
color: var(--gravity-lightestblue);
}
.single-blog-tags{
display: flex;
flex-direction: row;
gap: 6px;
}
.single-blog-title{
font-size: 32px;
font-weight: var(--bold);
color: var(--gravity-darkblue);
line-height: 1.2;
padding-bottom: 1.5rem;
}
.single-blog-body{
font-size: 16px;
line-height: 1.75;
color: var(--gravity-darkblue);
}
.single-blog-body p{
padding-bottom: 1rem;
}
.single-blog-body h2,
.single-blog-body h3{
font-weight: var(--demi-bold);
padding-bottom: 0.5rem;
padding-top: 1rem;
}
.single-blog-back{
display: inline-block;
margin-top: 2.5rem;
font-size: 14px;
font-weight: var(--demi-bold);
color: var(--gravity-darkblue);
text-decoration: underline;
} .footer-inner, .footer-outer{
border-radius: 10px;
width: 100%;
background-color: var(--gravity-darkblue);
}
.footer-inner{
display: flex;
flex-direction: column;
padding: 0.5rem;
border: 1px solid #655D5D;
gap: 64px;
}
.footer-outer{
padding: 1rem;
}
.footer-nav{
display: flex;
flex-direction: row;
align-items: start;
justify-content: space-between;
padding: 0.5rem;
gap: 16px;
}
.footer-menu-left, .footer-menu-right{ list-style: none;
text-decoration: none;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: rgb(183, 183, 183);
gap: 8px;
}
.footer-menu a {
text-decoration: none;
color: inherit;
}
.footer-menu a:visited {
color: inherit;
}
.footer-disclaimer{
text-align: center;
color: rgb(183, 183, 183);
}
.apply-now-footer-btn{
all: unset;
text-align: center;
border-radius: 12px;
margin-top: 8px;
padding: 0.5rem 0.85rem;
font-size: 14px;
white-space: nowrap;
align-self: flex-start;
background-color: var(--gravity-green);
color: var(--gravity-blue);
border: 1px solid var(--gravity-gray);
cursor: pointer;
}
.footer-column-title{
font-weight: var(--bold);
color: white;
padding-bottom: 8px;
}
.social-wrapper{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 8px;
}
.company-info{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: 16px;
}
.company-logo{
padding-top: 2px;
}
.company-info-left, .company-info-right{
display: flex;
flex-direction: column;
gap: 8px;
}
.company-info-wrapper{
display: flex;
align-items: center;
justify-content: center;
}
.site-footer{
display: flex;
flex-direction: column; color: white;
}
.product-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/products-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.product-hero-title{
text-align: center;
color: white;
}
.product-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.product-main{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.product-card-inner-wrapper{
display: flex;
position: relative;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 12px;
}
.product-cards-outer-wrapper{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 16px;
}
.product-card{
display: flex;
align-items: center;
justify-content: center;
width: 164px;
height: 185px;
background-color: black;
border-radius: 12px;
color: white;
padding: 0.5rem;
}
.product-card-1{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/vsc.png);
background-size: cover;
background-position: center;
position: relative;
}
.product-card-2{
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/vpp.png);
background-size: cover;
background-position: center;
position: relative;
}
.product-information-window{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.purchase-now-btn{
all: unset;
padding: 0.25rem 0.5rem;
background-color: var(--gravity-green);
border-radius: 12px;
border: 1px solid black;
}
.product-info-description{
width: 80%;
}
.vehicle-mileage, .vehicle-vin, .vehicle-yearly-miles{
background-color: #DEDEDE;
width: 300px;
height: 50px;
border-radius: 12px;
border: none;
} .referral-note{
max-width: 680px;
margin: 0 auto;
padding: 40px 20px 0;
}
.referral-note p{
margin: 0;
padding: 14px 22px;
text-align: center;
line-height: 1.5;
font-weight: 600;
color: var(--gravity-darkblue);
background: rgba(137, 252, 0, 0.12);
border: 1px solid rgba(137, 252, 0, 0.45);
border-radius: 12px;
} .referral-apply .gl-app-wrapper{
padding-top: 24px;
}
.apply-now-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/apply-now-hero.webp);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.apply-now-hero-title{
text-align: center;
color: white;
}
.apply-now-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.progress-bar{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 16px;
}
.progress-circle{
width: 40px;
background-color: black;
border-radius: 5rem;
}
.progress-indicator-wrapper{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 12px;
}
.application-field-wrapper{
display: grid;
grid-template-columns: 1fr 1fr;
}
.depreciation-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/depreciation-protection-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.depreciation-hero-title{
text-align: center;
color: white;
}
.depreciation-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.guaranteed-asset-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/guaranteed-asset-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.guaranteed-asset-hero-title{
text-align: center;
color: white;
}
.guaranteed-asset-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.vehicle-debt-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/vehicle-debt-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.vehicle-debt-hero-title{
text-align: center;
color: white;
}
.vehicle-debt-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.vehicle-protection-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/vehicle-protection-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.vehicle-protection-hero-title{
text-align: center;
color: white;
}
.vehicle-protection-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.vehicle-service-hero{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/vehicle-service-hero.png);
background-size: cover;
background-position: center;
width: 100%;
height: 60dvh;
color: white;
background-repeat: no-repeat;
}
.vehicle-service-hero-title{
text-align: center;
color: white;
}
.vehicle-service-hero-subtitle{
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
} .review-carousel{
display: flex;
align-items: center;
gap: 0.75rem;
width: 100%;
}
.review-carousel-viewport{
overflow: hidden;
width: 100%;
}
.review-carousel-track{
display: flex;
transition: transform 0.6s ease;
}
.review-slide{
min-width: 100%;
}
.review-arrow{
all: unset;
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
flex-shrink: 0;
border-radius: 50%;
background-color: var(--gravity-darkblue);
color: white;
cursor: pointer;
transition: opacity 0.2s ease;
}
.review-arrow:hover{
opacity: 0.75;
} .apply-now-btn,
.apply-now-nav-btn,
.check-my-rate-btn,
.beyond-refi-btn,
.career-apply-btn{
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
cursor: pointer;
}
.apply-now-btn:hover,
.apply-now-nav-btn:hover,
.check-my-rate-btn:hover,
.beyond-refi-btn:hover{
transform: translateY(-2px);
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
}
.career-apply-btn:hover{
transform: translateY(-2px);
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
opacity: 1;
}
.apply-now-btn:active,
.apply-now-nav-btn:active,
.check-my-rate-btn:active,
.beyond-refi-btn:active,
.career-apply-btn:active{
transform: translateY(0);
box-shadow: none;
} @media (min-width: 576px) {
.container { 
max-width: var(--container-max-sm);
}
.footer-nav{
padding: 0.5rem 3rem;
}
.company-info{
padding: 0.5rem 1rem;
}
} @media (min-width: 768px) {
.container {
max-width: var(--container-max-md);
--container-padding-x: 1.5rem;
}
.our-process-desktop-step-wrapper{
display: none;
}
.footer-nav{
padding: 0.5rem 7rem;
}
.blog-tag{
font-size: 11px;
height: 24px;
max-width: 90px;
}
.blog-tag-title{ font-size: 20px; }
.blog-grid{ grid-template-columns: repeat(auto-fill, minmax(175px, 215px)); }
.blog-card{ max-width: 215px; height: 280px; }
.blog-card-title{ font-size: 13px; }
.blog-card-subtitle{ font-size: 11px; }
.blog-card-tag{ font-size: 9px; }
.blog-featured-row{ flex-direction: row; }
.blog-featured-card{ height: 260px; }
.blog-featured-card-title{ font-size: 18px; }
} @media (max-width: 767px) {
.blog-grid{
grid-template-columns: 1fr;
gap: 12px;
}
.blog-card{
max-width: 100%;
height: 220px;
}
.blog-card-title{ font-size: 16px; }
.blog-card-subtitle{ font-size: 12px; }
.blog-card-tag{ font-size: 10px; }
} @media (min-width: 992px) {
.container { max-width: var(--container-max-lg); }
.footer-nav{
padding: 0.5rem 10rem;
} .time-to-refi-point{
display: flex;
flex-direction: column;
align-self: left;
}
.our-process-mobile-wrapper{
display: none;
}
.our-process-desktop-wrapper{
display: flex;
flex-direction: column;
gap: 160px;
}
.our-process-desktop-step-wrapper{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 24px;
}
.our-process-desktop-step{
display: flex;
flex-direction: column;
color: white;
gap: 16px;
padding: 1rem;
max-width: 400px;
opacity: 0;
transform: translateY(28px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.our-process-desktop-step.step-visible {
opacity: 1;
transform: translateY(0);
}
.our-process-content{
padding: 0 1rem;
text-align: left;
}
.hero {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-areas:
'left right';
align-items: center;
justify-items: center;
}
h1.hero-text-title{
margin-right: auto;
}
.hero-text{
display: flex;
align-items: center;
justify-content: flex-start;
grid-area: left;
text-align: left;
place-self: flex-start;
}
.hero-text .apply-now-btn{
align-self: flex-start;
}
.hero-image-wrap{
place-self: flex-end;
}
.benefits-content, .how-it-works{
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-areas: 
'left right';
align-items: center;
justify-items: center;
padding: 1rem;
}
.benefits-photo{
grid-area: right;
}
.benefits-columns{
grid-area: left;
}
.how-it-works-text{
display: flex;
flex-direction: column; justify-content: flex-start;
text-align: left;
}
.how-it-works-title{
margin-right: auto;
}
.how-it-works-timeline{
margin-left: auto;
}
.review-grid{
display: grid;
grid-template-columns: repeat(3, 1fr);
justify-items: center;
padding: 0 0.5rem;
}
.review-card{
width: 100%;
max-width: 340px;
}
.how-refi-saves-card-container{
display: flex;
flex-direction: row;
}
.beyond-refi-card-container{
flex-direction: row;
}
.beyond-refi-card{
flex: 1;
}
.time-to-refi-content{
flex-direction: row;
}
.time-to-refi-point-wrapper{
padding: 0 5rem;
display: flex;
flex-direction: column; }
.time-to-refi-title-wrapper{
justify-content: center;
}
.time-to-refi-point-subtitle{
padding: 0 0 0 1.5rem; max-width: 42ch;
}
.documents-photo-wrapper{
display: flex;
}
.documents-you-need-content{
display: flex;
flex-direction: row;
gap: 50px;
align-items: center;
justify-content: center;
}
.careers{
display: grid;
grid-template-columns: 1fr;
grid-template-areas:
"hero"
"benefits"
"awards"
"window";
align-items: start;
justify-items: center;
}
.careers-benefits-strip{
grid-area: benefits;
}
.careers .top-work-places{
grid-area: awards;
}
.careers-window{
grid-area: window;
}
.careers .spacer{
display: none;
}
.contact-layout{
display: grid;
grid-template-columns: 1fr 1fr;
align-items: start;
gap: 2rem;
padding: 0 2rem;
}
.contact-left-col,
.contact-right-col{
width: 100%;
}
.gl-app-wrapper{
max-width: 100%;
margin: 0;
padding: 24px 0;
}
.careers-hero{
grid-area: hero;
}
.careers-window{
grid-area: window;
}
.careers .top-work-places{
grid-area: awards;
flex-direction: row;
align-self: center;
padding: 0 1.5rem 2rem;
}
.blog-tag{
font-size: 13px;
height: 28px;
max-width: 110px;
}
.blog-tag-title{ font-size: 22px; }
.blog-grid{ grid-template-columns: repeat(auto-fill, minmax(220px, 260px)); }
.blog-card{ max-width: 260px; height: 330px; }
.blog-card-title{ font-size: 15px; }
.blog-card-subtitle{ font-size: 12px; }
.blog-card-tag{ font-size: 10px; }
.blog-featured-card{ height: 310px; }
.blog-featured-card-title{ font-size: 20px; }
.blog-featured-card-excerpt{ font-size: 13px; }
} @media (max-width: 991px) {
.careers .top-work-places{
flex-wrap: wrap;
gap: 1.5rem 2rem;
padding: 0 1.5rem 2rem;
}
.careers .top-work-places img{
max-height: 150px;
}
}
@media (max-width: 480px) {
.careers .top-work-places{
gap: 1.25rem 1.5rem;
}
.careers .top-work-places img{
max-height: 110px;
max-width: 40vw;
}
} @media (min-width: 1200px) {
.container { max-width: var(--container-max-xl); }
.hero-image-wrap{
width: 600px;
}
.hero-text, .hero-image-wrap{
margin-top: auto;
}
.footer-nav{
padding: 0.5rem 20rem;
}
.blog-tag{
font-size: 14px;
height: 30px;
max-width: 120px;
}
.blog-grid{ grid-template-columns: repeat(auto-fill, minmax(260px, 300px)); }
.blog-card{ max-width: 300px; height: 370px; }
.blog-card-title{ font-size: 20px; }
.blog-card-subtitle{ font-size: 15px; }
.blog-card-tag{ font-size: 11px; }
.blog-featured-card{ height: 360px; }
} @media (min-width: 1400px) {
.container {
max-width: var(--container-max-xxl);
--container-padding-x: 2rem;
}
.footer-nav{
padding: 0.5rem 30rem;
}
}
@media (max-width: 1448px) {
.hero-plane {
display: none;
}
} .hamburger {
display: none;
flex-direction: column;
justify-content: space-between;
width: 24px;
height: 18px;
background: none;
border: none;
cursor: pointer;
padding: 0;
margin-left: auto;
}
.hamburger span {
display: block;
width: 100%;
height: 2px;
background-color: rgb(0, 0, 0);
border-radius: 2px;
transition: transform 0.2s, opacity 0.2s;
}
.hamburger.is-open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; }
.hamburger.is-open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
@media (max-width: 768px) {
.site-header.container {
max-width: 100%;
padding: 1rem;
position: fixed;
top: 0;
left: 0;
border-radius: 0;
background-color: white;
}
} @media (max-width: 924px) {
.hamburger {
display: flex;
}
.site-nav {
flex-wrap: wrap;
align-items: center;
}
.nav-menu {
display: none;
}
.apply-now-btn-nav {
display: none;
}
.nav-search-btn {
display: none;
}
}
@media (max-width: 767px) {
.hero-text{
display: flex;
align-items: center;
justify-content: center;
text-align: center
}
h1.hero-text-title{
margin: 0;
}
} .mobile-menu {
display: none;
}
body.mobile-menu-open {
overflow: hidden;
}
@media (max-width: 924px) {
.mobile-menu.is-open {
display: block;
position: fixed;
inset: 0;
z-index: 999998;
background-color: rgb(255, 255, 255);
overflow-y: auto;
padding: 6.5rem 1.5rem 2rem;
}
.mobile-menu-list {
list-style: none;
display: flex;
flex-direction: column;
}
.mobile-menu-list > li {
border-top: 1px solid rgba(1, 11, 33, 0.1);
}
.mobile-menu-list > li:last-child {
border-bottom: 1px solid rgba(1, 11, 33, 0.1);
}
.mobile-menu-list > li > a,
.mobile-menu-list .dropdown-toggle {
display: flex;
align-items: center;
width: 100%;
padding: 0.9rem 0;
color: var(--gravity-darkblue);
font-weight: var(--demi-bold);
text-decoration: none;
}
.mobile-menu-list .dropdown-menu li a {
padding: 0.6rem 0 0.6rem 1rem;
color: rgba(1, 11, 33, 0.7);
font-weight: var(--normal);
border-top: 1px solid rgba(1, 11, 33, 0.08) !important;
}
.mobile-menu-apply {
margin-top: 1.5rem;
justify-content: center !important;
background-color: var(--gravity-green);
border-radius: 12px;
padding: 0.75rem !important;
}
} @media (min-width: 925px) {
.hamburger {
display: none;
}
.nav-menu { position: static;
width: auto;
height: auto;
background-color: transparent;
transform: none;
animation: none;
flex-direction: row;
margin-left: auto;
justify-content: flex-end;
gap: 2rem;
padding: 0;
z-index: auto;
}
.nav-menu li a {
display: inline;
padding: 0;
border: none;
color: rgb(0, 0, 0);
} }
.documents-you-need-accordian {
max-height: 0;
overflow: hidden;
transition: max-height 0.4s ease; }
.documents-you-need-accordian.active {
max-height: 350px;
}
.offer-wall {
display: grid;
grid-template-columns: repeat(6, calc(var(--offer-card-width) / 2));
gap: var(--offer-gap);
justify-content: center;
padding: 2rem;
margin: 0 auto;
max-width: 1440px;
}
.offer-wall-title, .offer-wall-subtitle { grid-column: 1 / -1; }
.offer-category:nth-of-type(1) { grid-column: 1 / 3; }
.offer-category:nth-of-type(2) { grid-column: 3 / 5; }
.offer-category:nth-of-type(3) { grid-column: 5 / 7; }
.offer-category:nth-of-type(4) { grid-column: 2 / 4; }
.offer-category:nth-of-type(5) { grid-column: 4 / 6; }
.offer-category{
background-size: cover;
background-position: center;
display: flex;
justify-content: center;
align-items: center;
width: var(--offer-card-width);
height: var(--offer-card-height);
text-align: center;
position: relative;
overflow: hidden;
cursor: pointer;
opacity: 0;
transform: translateY(28px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.offer-category.offer-category-visible{
opacity: 1;
transform: translateY(0);
}
.offer-category-name{
transition: 0.6s;
}
.offer-category:hover .offer-category-name, .offer-category:hover .offer-category-arrow{
opacity: 0;
}
h1.offer-text-content-headline{
text-decoration: none;
color: white;
text-transform: uppercase;
font-size: clamp(1rem, 0.912rem + 0.3756vw, 1.25rem);
}
p.offer-text-content-desc{
font-size: clamp(0.5rem, 0.3239rem + 0.7512vw, 1rem);
}
.offer-text-content{
width: 100%;
height: 100%;
color: white;
top: 0;
left: 0;
position: absolute;
background: rgba(0, 0, 0, 0.6);
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
opacity: 0;
transition: 0.6s;
z-index: 5;
padding: 0 0.5rem;
gap: 16px;
}
.offer-styled-line {
border: none;
border-top: 3px solid #ffffff; 
width: 70%;
}
.offer-category:hover .offer-text-content{
opacity: 1;
}
.offer-category-arrow{
position: absolute;
bottom: 10px;
right: 10px;
z-index: 3;
} .offer-category:after {
content: '';
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.50);
z-index: 1;
}
.offer-category-name{
text-transform: uppercase;
z-index: 2;
color: white;
font-size: clamp(2rem, calc(2.4vw + 0.4rem), 2.5rem);
font-weight: 600;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
.offer-category .offer-category-name {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
} .offer-description, .offer-info{
font-family: var(--offer-wall-text);
text-align: center;
}
.offer-category{
border-radius: 1rem;
}
.offer-category-btn{
margin: 0;
padding: 6px 10px;
background: none;
border: 1px solid grey;
border-radius: 0.5rem;
font: inherit;
color: inherit;
cursor: pointer;
appearance: none;
transition: transform all 0.2s ease;
text-transform: uppercase;
}
.offer-category-btn:hover{
background: white;
color: black;
}
@media (max-width: 1130px) {
:root {
--offer-card-width: 300px;
--offer-card-height: 300px;
}
}
@media (max-width: 1000px){
:root {
--offer-card-width: 260px;
--offer-card-height: 260px;
}
}
@media (max-width: 845px){ }
@media (max-width: 768px) {
.offer-wall {
grid-template-columns: 1fr;
}
.offer-category,
.offer-category:nth-of-type(1),
.offer-category:nth-of-type(2),
.offer-category:nth-of-type(3),
.offer-category:nth-of-type(4),
.offer-category:nth-of-type(5) {
grid-column: 1 / -1;
width: 100%;
height: var(--offer-card-height);
}
.offer-category-name{ font-size: clamp(2rem, 1.6479rem + 1.5023vw, 3rem);
}
h1.offer-text-content-headline{ font-size: clamp(1.25rem, 0.9859rem + 1.1268vw, 2rem);
}
p.offer-text-content-desc{
font-size: clamp(0.75rem, 0.3239rem + 0.7512vw, 1.5rem);
}
}
@media (max-width: 400px){
p.offer-text-content-desc{
display: none;
}
} .nav-dropdown {
position: relative;
}
.dropdown-toggle {
display: flex;
align-items: center;
gap: 6px;
background: none;
border: none;
cursor: pointer;
padding: inherit;
font: inherit;
color: inherit;
}
.dropdown-icon {
transition: transform 0.2s ease;
}
.nav-dropdown:hover .dropdown-icon,
.dropdown-toggle[aria-expanded="true"] .dropdown-icon {
transform: rotate(180deg);
}
.dropdown-menu {
position: absolute;
top: 100%;
left: 0;
background: white;
border: 1px solid #e0e0e0;
border-radius: 8px;
list-style: none;
padding: 8px 8px;
margin: 8px 0 0 0;
min-width: 260px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
opacity: 0;
visibility: hidden;
transform: translateY(-10px);
transition: opacity 0.2s, visibility 0.2s, transform 0.2s;
z-index: 1000;
}
.nav-dropdown:hover .dropdown-menu,
.nav-dropdown.active .dropdown-menu {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.dropdown-menu a {
display: block;
padding: 12px 16px;
text-decoration: none;
color: inherit;
transition: background-color 0.2s;
}
.dropdown-menu a:hover {
background-color: #f5f5f5;
} @media (max-width: 924px) {
.dropdown-menu {
position: static;
opacity: 0;
visibility: hidden;
max-height: 0;
overflow: hidden;
box-shadow: none;
border: none;
border-radius: 0;
background: none;
padding: 0;
margin: 0;
transform: none;
transition: opacity 0.2s, visibility 0.2s, max-height 0.3s ease;
}
.nav-dropdown.active .dropdown-menu {
opacity: 1;
visibility: visible;
max-height: 400px;
}
.dropdown-menu a {
padding: 0.6rem 0;
border-top: 1px solid rgba(255, 255, 255, 0.1);
background: none;
}
} :root {
--navy: #0d1b2a;
--navy-mid: #1a2e45;
--lime: #7ed321;
--lime-dark: #5fa818;
--lime-glow: rgba(126, 211, 33, 0.35);
--white: #ffffff;
--off-white: #f5f6f8;
--muted: #8a9bb0;
--border: #d6dce6;
--input-bg: #eef0f4;
--danger: #e53e3e;
--text: #0d1b2a;
--radius-lg: 14px;
--radius-xl: 20px;
--shadow-sm: 0 2px 8px rgba(13, 27, 42, 0.08);
--shadow-md: 0 8px 32px rgba(13, 27, 42, 0.12);
--transition: 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}  .gl-app-wrapper {
max-width: 680px;
margin: 0 auto;
padding: 40px 20px 60px;
} .gl-step-heading {
text-align: center;
margin-bottom: 32px;
}
.gl-step-heading h2 { font-size: clamp(1.5rem, 4vw, 2rem);
line-height: 1.25;
color: var(--navy);
max-width: 520px;
margin: 0 auto;
} .gl-progress {
display: flex;
align-items: flex-start;
justify-content: center;
gap: 0;
margin-bottom: 44px;
position: relative;
}
.gl-progress-step {
display: flex;
flex-direction: column;
align-items: center;
position: relative;
flex: 1;
max-width: 120px;
} .gl-progress-step:not(:last-child)::after {
content: '';
position: absolute;
top: 22px;
left: calc(50% + 22px);
right: calc(-50% + 22px);
height: 2px;
background: var(--border);
z-index: 0;
transition: background var(--transition);
}
.gl-progress-step.completed:not(:last-child)::after {
background: var(--lime);
}
.gl-progress-dot {
width: 44px;
height: 44px;
border-radius: 50%;
background: var(--navy);
color: var(--white);
display: flex;
align-items: center;
justify-content: center;
font-size: 1rem;
font-weight: 700;
position: relative;
z-index: 1;
transition: all var(--transition);
border: 3px solid transparent;
}
.gl-progress-step.active .gl-progress-dot {
border-color: var(--lime);
box-shadow: 0 0 0 4px var(--lime-glow);
}
.gl-progress-step.completed .gl-progress-dot {
background: var(--lime);
color: var(--navy);
border-color: var(--lime);
}
.gl-progress-label {
margin-top: 8px;
font-size: 0.75rem;
font-weight: 600;
color: var(--muted);
text-align: center;
white-space: nowrap;
letter-spacing: 0.01em;
}
.gl-progress-step.active .gl-progress-label,
.gl-progress-step.completed .gl-progress-label {
color: var(--navy);
} .gl-form-card {
background: var(--white);
border-radius: var(--radius-xl);
box-shadow: var(--shadow-md);
padding: 36px 32px 32px;
margin-bottom: 24px;
}
@media (max-width: 480px) {
.gl-form-card {
padding: 24px 18px 24px;
}
} .gl-field-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px 24px;
}
.gl-field-grid .gl-field-full {
grid-column: 1 / -1;
}
@media (max-width: 480px) {
.gl-field-grid {
grid-template-columns: 1fr;
}
.gl-field-grid .gl-field-full {
grid-column: 1;
}
} .gl-field {
display: flex;
flex-direction: column;
gap: 6px;
}
.gl-field label {
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--muted);
}
.gl-field input,
.gl-field select,
.gl-field textarea {
width: 100%;
padding: 14px 16px;
font-family: 'DM Sans', sans-serif;
font-size: 1rem;
color: var(--text);
background: var(--input-bg);
border: 1.5px solid transparent;
border-radius: var(--radius-lg);
outline: none;
transition: border-color var(--transition), background var(--transition), box-shadow var(--transition);
-webkit-appearance: none;
appearance: none;
}
.gl-field select {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238a9bb0' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 14px center;
padding-right: 36px;
cursor: pointer;
}
.gl-field textarea {
resize: vertical;
min-height: 120px;
}
.gl-field input::placeholder,
.gl-field textarea::placeholder {
color: var(--muted);
}
.gl-field input:focus,
.gl-field select:focus,
.gl-field textarea:focus {
border-color: var(--lime);
background: #fff;
box-shadow: 0 0 0 3px var(--lime-glow);
}
.gl-field input.is-invalid,
.gl-field select.is-invalid,
.gl-field textarea.is-invalid {
border-color: var(--danger);
background: #fff5f5;
}
.gl-field .gl-error {
font-size: 0.75rem;
color: var(--danger);
font-weight: 500;
} .gl-intent-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
margin-bottom: 8px;
}
@media (max-width: 400px) {
.gl-intent-grid {
grid-template-columns: 1fr;
}
}
.gl-intent-btn {
padding: 14px 10px;
border-radius: var(--radius-lg);
border: 1.5px solid var(--border);
background: var(--input-bg);
font-family: 'DM Sans', sans-serif;
font-size: 0.9rem;
font-weight: 600;
color: var(--navy);
cursor: pointer;
transition: all var(--transition);
text-align: center;
}
.gl-intent-btn:hover {
border-color: var(--lime);
background: var(--white);
}
.gl-intent-btn.selected {
background: var(--lime);
border-color: var(--lime);
color: var(--navy);
box-shadow: 0 4px 12px var(--lime-glow);
} .gl-emp-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 10px;
}
@media (max-width: 480px) {
.gl-emp-grid {
grid-template-columns: 1fr 1fr;
}
} .gl-res-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 10px;
}
@media (max-width: 480px) {
.gl-res-grid {
grid-template-columns: 1fr 1fr;
}
} .gl-group-label {
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--muted);
margin-bottom: 8px;
display: block;
} .gl-divider {
height: 1px;
background: var(--border);
margin: 24px 0;
} .gl-employer-fields {
display: none;
}
.gl-employer-fields.visible {
display: contents;
} .gl-continue-btn {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
width: 100%;
max-width: 320px;
margin: 0 auto;
padding: 17px 32px;
background: var(--lime);
color: var(--navy);
font-family: 'DM Sans', sans-serif;
font-size: 1.15rem;
font-weight: 700;
border: none;
border-radius: 50px;
cursor: pointer;
transition: all var(--transition);
box-shadow: 0 4px 16px var(--lime-glow);
letter-spacing: 0.01em;
}
.gl-continue-btn:hover {
background: var(--lime-dark);
transform: translateY(-1px);
box-shadow: 0 8px 24px var(--lime-glow);
}
.gl-continue-btn:active {
transform: translateY(0);
}
.gl-continue-btn svg {
flex-shrink: 0;
} .gl-submit-btn {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
width: 100%;
max-width: 320px;
margin: 0 auto;
padding: 17px 32px;
background: var(--lime);
color: var(--navy);
font-family: 'DM Sans', sans-serif;
font-size: 1.15rem;
font-weight: 700;
border: none;
border-radius: 50px;
cursor: pointer;
transition: all var(--transition);
box-shadow: 0 4px 16px var(--lime-glow);
}
.gl-submit-btn:hover {
background: var(--lime-dark);
transform: translateY(-1px);
} .gl-btn-area {
margin-top: 32px;
display: flex;
flex-direction: column;
align-items: center;
gap: 14px;
}
.gl-back-link {
font-size: 0.85rem;
color: var(--muted);
cursor: pointer;
background: none;
border: none;
font-family: inherit;
text-decoration: underline;
text-underline-offset: 3px;
transition: color var(--transition);
}
.gl-back-link:hover {
color: var(--navy);
} .gl-trust {
text-align: center;
margin-top: 28px;
}
.gl-trust-icon {
width: 40px;
height: 40px;
margin: 0 auto 10px;
color: var(--navy);
}
.gl-trust ul {
list-style: none;
display: flex;
flex-direction: column;
gap: 4px;
}
.gl-trust li {
font-size: 0.8rem;
color: var(--muted);
font-weight: 500;
}
.gl-trust li::before {
content: '• ';
} .gl-section {
display: none;
}
.gl-section.active {
display: block;
} .gl-confirm-box {
background: var(--white);
border-radius: var(--radius-xl);
box-shadow: var(--shadow-md);
padding: 48px 32px;
text-align: center;
}
.gl-confirm-box h3 { font-size: 1.8rem;
color: var(--navy);
margin-bottom: 16px;
}
.gl-confirm-box p {
color: var(--muted);
line-height: 1.6;
margin-bottom: 12px;
}
.gl-confirm-box a {
color: var(--lime-dark);
font-weight: 600;
}
.gl-confirm-box .app-id {
display: inline-block;
margin-top: 12px;
padding: 8px 20px;
background: var(--off-white);
border-radius: 8px;
font-weight: 700;
color: var(--navy);
font-size: 1.1rem;
}
.gl-spinner {
width: 48px;
height: 48px;
border: 4px solid var(--border);
border-top-color: var(--lime);
border-radius: 50%;
animation: spin 0.8s linear infinite;
margin: 0 auto 20px;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
} .gl-warning {
font-size: 0.75rem;
color: var(--danger);
font-weight: 500;
margin-top: 4px;
display: block;
} .gl-tcpa {
display: flex;
gap: 10px;
align-items: flex-start;
background: var(--off-white);
border-radius: 10px;
padding: 14px;
margin-top: 4px;
}
.gl-tcpa input[type="checkbox"] {
-webkit-appearance: checkbox;
appearance: checkbox;
width: 18px;
height: 18px;
flex-shrink: 0;
margin-top: 2px;
padding: 0;
border: none;
background: transparent;
accent-color: var(--lime);
cursor: pointer;
}
.gl-tcpa label {
font-size: 0.75rem;
color: var(--muted);
line-height: 1.5;
cursor: pointer;
}
.gl-tcpa label a {
color: var(--navy);
} .gl-legal-note {
display: flex;
gap: 10px;
align-items: flex-start;
background: var(--off-white);
border-radius: 10px;
padding: 14px;
margin-top: 4px;
}
.gl-legal-note input[type="checkbox"] {
-webkit-appearance: checkbox;
appearance: checkbox;
width: 18px;
height: 18px;
flex-shrink: 0;
margin-top: 2px;
padding: 0;
border: none;
background: transparent;
accent-color: var(--lime);
cursor: pointer;
}
.gl-legal-note label {
font-size: 0.75rem;
color: var(--muted);
line-height: 1.5;
cursor: pointer;
}
.gl-legal-note a {
color: var(--navy);
} .gl-section.active .gl-form-card {
animation: slideUp 0.3s ease both;
}
@keyframes slideUp {
from {
opacity: 0;
transform: translateY(16px);
}
to {
opacity: 1;
transform: translateY(0);
}
} .gl-ml-subtitle {
text-align: center;
color: var(--muted);
line-height: 1.6;
max-width: 520px;
margin: -20px auto 32px;
}
.gl-ml-loading {
text-align: center;
}
.gl-ml-loading p {
color: var(--muted);
margin: 0;
}
.gl-ml-screen {
margin-bottom: 24px;
}
.gl-ml-greeting {
text-align: center;
color: var(--navy);
font-weight: 600;
margin-bottom: 20px;
} .gl-ml-rows {
display: flex;
flex-direction: column;
gap: 2px;
}
.gl-ml-row {
display: flex;
justify-content: space-between;
gap: 16px;
padding: 10px 0;
border-bottom: 1px solid var(--border);
}
.gl-ml-row:last-child {
border-bottom: none;
}
.gl-ml-row-label {
color: var(--muted);
font-size: 0.85rem;
font-weight: 600;
}
.gl-ml-row-value {
color: var(--navy);
font-weight: 600;
text-align: right;
} .gl-ml-offer {
margin-top: 20px;
padding: 18px;
border-radius: var(--radius-lg);
background: var(--off-white);
text-align: center;
}
.gl-ml-offer .gl-group-label {
text-align: center;
margin-bottom: 12px;
}
.gl-ml-offer-stats {
display: flex;
justify-content: space-around;
gap: 12px;
}
.gl-ml-stat {
display: flex;
flex-direction: column;
gap: 2px;
}
.gl-ml-stat strong {
font-size: 1.35rem;
color: var(--navy);
line-height: 1.1;
}
.gl-ml-stat span {
font-size: 0.75rem;
color: var(--muted);
}
.gl-ml-confirm-note {
text-align: center;
color: var(--muted);
font-size: 0.9rem;
line-height: 1.5;
margin-top: 20px;
}
.gl-ml-not-me-wrap {
text-align: center;
margin-top: 16px;
}
.gl-ml-not-me {
display: inline-block;
padding: 8px 18px;
border: 1px solid var(--border);
border-radius: 50px;
color: var(--muted);
font-size: 0.85rem;
font-weight: 600;
text-decoration: none;
transition: all var(--transition);
}
.gl-ml-not-me:hover {
border-color: var(--muted);
color: var(--navy);
}
.gl-ml-proceed {
text-align: center;
color: var(--muted);
line-height: 1.6;
margin: 8px 0 0;
}
.gl-ml-disclosures {
max-height: 220px;
overflow-y: auto;
padding: 4px 12px 4px 0;
margin-bottom: 4px;
}
.gl-ml-disclosures p {
font-size: 0.75rem;
color: var(--muted);
line-height: 1.6;
margin-bottom: 12px;
}
.gl-ml-check {
width: 56px;
height: 56px;
color: var(--lime);
margin: 0 auto 16px;
display: block;
}
.gl-ml-inline-error {
text-align: center;
color: var(--danger);
font-size: 0.85rem;
margin-top: 16px;
}
.gl-ml-inline-error a {
color: var(--danger);
font-weight: 600;
white-space: nowrap;
}  .gl-app-wrapper.gl-ml {
padding-top: 120px;
} .gl-ml .gl-form-card,
.gl-ml .gl-confirm-box {
background: var(--gravity-darkblue);
color: #fff;
}
.gl-ml .gl-ml-greeting {
color: #fff;
} .gl-ml .gl-ml-row {
border-bottom-color: rgba(255, 255, 255, 0.14);
}
.gl-ml .gl-ml-row-label {
color: rgba(255, 255, 255, 0.6);
}
.gl-ml .gl-ml-row-value {
color: #fff;
} .gl-ml .gl-ml-offer {
background: rgba(255, 255, 255, 0.06);
border-left-color: var(--gravity-green);
} .gl-ml .gl-ml-offer .gl-group-label {
color: var(--gravity-green);
}
.gl-ml .gl-ml-stat strong {
color: #fff;
}
.gl-ml .gl-ml-stat span {
color: rgba(255, 255, 255, 0.6);
} .gl-ml .gl-group-label {
color: rgba(255, 255, 255, 0.55);
}
.gl-ml .gl-ml-confirm-note,
.gl-ml .gl-ml-proceed,
.gl-ml .gl-ml-loading p {
color: rgba(255, 255, 255, 0.75);
}
.gl-ml .gl-divider {
background: rgba(255, 255, 255, 0.15);
}
.gl-ml .gl-ml-disclosures p {
color: rgba(255, 255, 255, 0.6);
} .gl-ml .gl-ml-not-me {
color: rgba(255, 255, 255, 0.8);
border-color: rgba(255, 255, 255, 0.3);
}
.gl-ml .gl-ml-not-me:hover {
color: #fff;
border-color: #fff;
} .gl-ml .gl-tcpa {
background: rgba(255, 255, 255, 0.06);
}
.gl-ml .gl-tcpa label {
color: rgba(255, 255, 255, 0.7);
}
.gl-ml .gl-tcpa label a {
color: #fff;
} .gl-ml .gl-confirm-box h3 {
color: #fff;
}
.gl-ml .gl-confirm-box p {
color: rgba(255, 255, 255, 0.7);
}
.gl-ml .gl-confirm-box a {
color: var(--gravity-green);
}
.gl-ml .gl-confirm-box .app-id {
background: rgba(255, 255, 255, 0.1);
color: #fff;
} .gravity-app-2022 .lp-banner {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
padding: 130px 20px 0;
} .gravity-app-2022.has-lp-banner .gl-app-wrapper.gl-pp {
padding-top: 28px;
}
.gravity-app-2022 .lp-logos {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 16px;
flex-wrap: wrap;
background: #fff;
padding: 14px 26px;
border-radius: 14px; }
.gravity-app-2022 .lp-logos-gl {
height: 46px;
width: auto;
}
.gravity-app-2022 .lp-logos-divider {
font-size: 0.75rem;
color: #6b7280;
text-transform: uppercase;
letter-spacing: 0.06em;
white-space: nowrap;
}
.gravity-app-2022 .lp-logos-partner {
height: 46px;
width: auto;
max-width: 200px;
object-fit: contain;
}
.gravity-app-2022 .lp-phone {
font-size: 1.4rem;
font-weight: 700;
color: var(--navy);
margin-top: 16px;
}
.gravity-app-2022 .lp-phone a {
color: inherit;
text-decoration: none;
}
.gravity-app-2022 .lp-phone a:hover {
text-decoration: underline;
}
.gravity-app-2022 .lp-phone-icon {
height: 0.95em;
width: auto;
vertical-align: middle;
margin-right: 8px;
}
@media (max-width: 420px) {
.gravity-app-2022 .lp-logos {
gap: 10px;
padding: 10px 16px;
}
.gravity-app-2022 .lp-logos-gl,
.gravity-app-2022 .lp-logos-partner {
height: 34px;
}
.gravity-app-2022 .lp-logos-partner {
max-width: 130px;
}
.gravity-app-2022 .lp-logos-divider {
font-size: 0.65rem;
}
} .gl-app-wrapper.gl-pp {
padding-top: 120px;
} .gl-pp-screen {
display: none;
}
.gl-pp-screen.active {
display: block;
}
.gl-pp-intro {
text-align: center;
color: var(--muted);
line-height: 1.6;
max-width: 560px;
margin: -18px auto 28px;
} .gl-pp-consent p {
font-size: 0.9rem;
color: var(--navy);
font-weight: 600;
margin-bottom: 10px;
}
.gl-pp-consent ul {
margin: 0 0 4px;
padding-left: 20px;
display: flex;
flex-direction: column;
gap: 8px;
}
.gl-pp-consent li {
font-size: 0.8rem;
color: var(--muted);
line-height: 1.55;
}
.gl-pp-consent a {
color: var(--navy);
font-weight: 600;
}
.gl-pp-badge {
text-align: center;
margin-top: 20px;
}
.gl-pp-awards {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 16px;
margin: 28px auto 0;
max-width: 560px;
}
.gl-pp-awards img {
height: 90px;
width: auto;
}
.gl-pp-received ul {
display: flex;
flex-direction: column;
gap: 8px;
margin-top: 8px;
} .gl-pp .warning {
display: block;
font-size: 0.78rem;
color: var(--danger);
font-weight: 500;
margin-top: 6px;
text-align: left;
}
.gl-pp .warning a {
color: var(--danger);
font-weight: 600;
} .gl-pp-modal {
position: fixed;
inset: 0;
z-index: 10000000;
display: flex;
align-items: center;
justify-content: center;
padding: 1.5rem;
background: rgba(1, 11, 33, 0.7);
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
opacity: 0;
visibility: hidden;
transition: opacity 0.2s ease, visibility 0.2s ease;
}
.gl-pp-modal.is-open {
opacity: 1;
visibility: visible;
}
.gl-pp-modal-card {
background: var(--white);
border-radius: var(--radius-xl);
box-shadow: var(--shadow-md);
padding: 40px 32px;
text-align: center;
max-width: 420px;
width: 100%;
}
.gl-pp-modal-msg {
color: var(--navy);
font-weight: 700;
font-size: 1.1rem;
margin-bottom: 20px;
}
.gl-pp-modal-sub {
color: var(--muted);
margin-top: 8px;
} input[type="range"].gl-slider {
-webkit-appearance: none;
width: 100%;
height: 4px;
border-radius: 2px;
background: linear-gradient(to right, var(--lime) 0%, var(--lime) 25%, var(--border) 25%, var(--border) 100%);
outline: none;
border: none;
padding: 0;
margin-top: 8px;
}
input[type="range"].gl-slider::-webkit-slider-thumb {
-webkit-appearance: none;
width: 22px;
height: 22px;
border-radius: 50%;
background: var(--lime);
border: 3px solid var(--white);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
cursor: pointer;
}
.gl-slider-labels {
display: flex;
justify-content: space-between;
font-size: 0.72rem;
color: var(--muted);
margin-top: 4px;
} .become-a-lender-hero {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/become-a-lender.png);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 60dvh;
color: white;
}
.become-a-lender-hero-title {
font-weight: var(--bold);
font-size: 36px;
margin: 0;
padding: 0 1rem 0.5rem;
text-align: center;
color: white;
}
.become-a-lender-hero-subtitle {
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
padding-bottom: 1.5rem;
}
.become-a-lender-benefits {
padding: 2rem 1rem 1.5rem;
}
.become-a-lender-benefits h2 {
font-size: 1.5rem;
font-weight: 700;
color: var(--gravity-darkblue);
margin-bottom: 1.25rem;
border-bottom: none;
}
.benefits-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 1rem;
}
.benefits-list li {
display: flex;
align-items: flex-start;
gap: 0.75rem;
font-size: 1rem;
line-height: 1.5;
}
.benefits-list li::before {
content: '✓';
color: var(--lime);
font-weight: 700;
font-size: 1.1rem;
flex-shrink: 0;
margin-top: 1px;
} .lender-services-hero {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/lender-services.png);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 60dvh;
color: white;
}
.lender-services-hero-title {
font-weight: var(--bold);
font-size: 36px;
margin: 0;
padding: 0 1rem 0.5rem;
text-align: center;
color: white;
}
.lender-services-hero-subtitle {
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
padding-bottom: 1.5rem;
}
.lender-services-content {
padding: 2rem 1rem 1.5rem;
}
.lender-services-intro,
.lender-services-closing {
font-size: 1rem;
line-height: 1.65;
margin-bottom: 1.25rem;
}
.services-list {
list-style: none;
padding: 0;
margin: 0 0 1.25rem;
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.services-list li {
display: flex;
align-items: flex-start;
gap: 0.75rem;
font-size: 1rem;
line-height: 1.5;
}
.services-list li::before {
content: '→';
color: var(--lime);
font-weight: 700;
flex-shrink: 0;
margin-top: 1px;
}
.lender-services-why-heading {
font-size: 1.35rem;
font-weight: 700;
color: var(--gravity-darkblue);
margin: 1.5rem 0 1rem;
border-bottom: none;
} .product-page-hero {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: url(//gravitylending.com/wp-content/themes/gravity-lending-theme/assets/images/glossary-hero.png);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 60dvh;
color: white;
}
.product-page-hero-title {
text-align: center;
color: white;
}
.product-page-hero-subtitle {
font-weight: var(--normal);
font-size: 20px;
text-align: center;
color: white;
}
.product-page-content {
display: flex;
flex-direction: column;
}  .dp-what-is {
display: flex;
flex-direction: column;
gap: 2.5rem;
align-items: flex-start;
}
.dp-eyebrow {
font-size: 0.8rem;
font-weight: var(--bold);
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--gravity-green);
margin: 0 0 0.5rem;
}
.dp-what-is-title {
font-size: clamp(1.75rem, 3vw, 2.5rem);
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 1rem;
}
.dp-what-is-body {
font-size: 1.05rem;
line-height: 1.75;
color: var(--gravity-darkblue);
margin-bottom: 1.75rem;
max-width: 560px;
}
.dp-stat-box {
background-color: var(--gravity-darkblue);
border-radius: 1.5rem;
padding: 2.5rem 2rem;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
color: white;
align-self: stretch;
min-width: 220px;
}
.dp-stat-number {
font-size: clamp(3rem, 7vw, 5rem);
font-weight: var(--bold);
color: var(--gravity-green);
line-height: 1;
}
.dp-stat-label {
font-size: 0.95rem;
margin-top: 1rem;
line-height: 1.5;
opacity: 0.85;
} .dp-ideal-for {
background-color: var(--gravity-darkblue);
border-radius: 1.5rem;
padding: 3rem 2.5rem;
color: white;
}
.dp-ideal-for-title {
font-size: clamp(1.5rem, 2.5vw, 2rem);
font-weight: var(--bold);
margin-bottom: 0.4rem;
}
.dp-ideal-for-subtitle {
font-size: 1rem;
font-weight: var(--normal);
opacity: 0.75;
margin-bottom: 1.75rem;
}
.dp-checklist {
list-style: none;
padding: 0;
margin: 0;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem 3rem;
}
.dp-checklist li {
display: flex;
align-items: flex-start;
gap: 0.75rem;
font-size: 1rem;
line-height: 1.5;
opacity: 0;
transform: translateY(20px);
transition: opacity 0.5s ease, transform 0.5s ease;
}
.dp-checklist li.dp-anim-visible {
opacity: 1;
transform: translateY(0);
}
.dp-checklist li::before {
content: '✓';
display: inline-flex;
align-items: center;
justify-content: center;
width: 22px;
height: 22px;
min-width: 22px;
background: var(--gravity-green);
border-radius: 50%;
color: var(--gravity-darkblue);
font-weight: var(--bold);
font-size: 0.7rem;
margin-top: 1px;
} .dp-benefits {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.dp-benefits-title {
font-size: clamp(1.75rem, 3vw, 2.5rem);
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 0.5rem;
}
.dp-benefit-row {
display: flex;
align-items: flex-start;
gap: 2rem;
padding: 2rem 0;
border-bottom: 1px solid rgba(1, 11, 33, 0.12);
opacity: 0;
transform: translateY(24px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.dp-benefit-row.dp-anim-visible {
opacity: 1;
transform: translateY(0);
}
.dp-benefit-row:nth-child(3) { transition-delay: 0.1s; }
.dp-benefit-row:nth-child(4) { transition-delay: 0.2s; }
.dp-benefit-num {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: var(--bold);
color: var(--gravity-darkblue);
line-height: 1;
flex-shrink: 0;
width: 72px;
}
.dp-benefit-body h3 {
font-size: 1.2rem;
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 0.5rem;
}
.dp-benefit-body p {
font-size: 1rem;
line-height: 1.7;
color: var(--gravity-darkblue);
}
@media (min-width: 769px) {
.dp-what-is {
flex-direction: row;
align-items: flex-start;
}
.dp-what-is-text {
flex: 1;
}
}
@media (max-width: 600px) {
.dp-checklist {
grid-template-columns: 1fr;
}
.dp-ideal-for {
padding: 2rem 1.25rem;
}
} .gap-what-is {
display: flex;
flex-direction: column; align-items: center;
justify-content: center;
}
.gap-eyebrow {
font-size: 0.8rem;
font-weight: var(--bold);
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--gravity-darkblue);
margin: 0 0 0.5rem;
}
.gap-what-is-title {
font-size: clamp(1.75rem, 3vw, 2.5rem);
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 1rem;
}
.gap-what-is-body {
font-size: 1.05rem;
line-height: 1.75;
color: var(--gravity-darkblue);
margin-bottom: 1.75rem;
} .gap-callout-box {
background-color: var(--gravity-darkblue);
border-radius: 1.5rem;
padding: 2.5rem 2rem;
display: flex;
flex-direction: column;
gap: 0;
color: white;
align-self: stretch;
min-width: 240px;
max-width: 600px;
}
.gap-callout-label {
font-size: 0.75rem;
font-weight: var(--bold);
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(255,255,255,0.5);
margin-bottom: 1.5rem;
}
.gap-callout-row {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem 0;
border-top: 1px solid rgba(255,255,255,0.1);
font-size: 0.95rem;
}
.gap-callout-row-name {
opacity: 0.8;
}
.gap-callout-row-amount {
font-weight: var(--bold);
}
.gap-callout-row.gap-highlight {
background: var(--gravity-green);
color: var(--gravity-darkblue);
border-radius: 0.5rem;
padding: 0.75rem 0.75rem;
margin-top: 0.25rem;
border-top: none;
}
.gap-callout-row.gap-highlight .gap-callout-row-name,
.gap-callout-row.gap-highlight .gap-callout-row-amount {
opacity: 1;
}
.gap-callout-note {
font-size: 0.8rem;
opacity: 0.5;
margin-top: 1.25rem;
line-height: 1.5;
} .gap-consider {
background-color: var(--gravity-darkblue);
border-radius: 1.5rem;
padding: 3rem 2.5rem;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
max-width: 800px;
}
.gap-consider-title {
font-size: clamp(1.5rem, 2.5vw, 2rem);
font-weight: var(--bold);
margin-bottom: 0.4rem;
}
.gap-consider-subtitle {
font-size: 1rem;
font-weight: var(--normal);
opacity: 0.75;
margin-bottom: 1.75rem;
}
.gap-checklist {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 1rem;
}
.gap-checklist li {
display: flex;
align-items: flex-start;
gap: 0.75rem;
font-size: 1rem;
line-height: 1.5;
opacity: 0;
transform: translateY(20px);
transition: opacity 0.5s ease, transform 0.5s ease;
}
.gap-checklist li.gap-anim-visible {
opacity: 1;
transform: translateY(0);
}
.gap-checklist li::before {
content: '✓';
display: inline-flex;
align-items: center;
justify-content: center;
width: 22px;
height: 22px;
min-width: 22px;
background: var(--gravity-green);
border-radius: 50%;
color: var(--gravity-darkblue);
font-weight: var(--bold);
font-size: 0.7rem;
margin-top: 1px;
} .gap-how-works {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 2.5rem;
}
.gap-how-works-text{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.gap-section-title {
font-size: clamp(1.75rem, 3vw, 2.5rem);
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 1rem;
}
.gap-section-body {
font-size: 1.05rem;
line-height: 1.75;
color: var(--gravity-darkblue);
max-width: 560px;
}
.gap-diagram-stub {
background: rgba(1, 11, 33, 0.04);
border: 2px dashed rgba(1, 11, 33, 0.15);
border-radius: 1rem;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 3rem 2rem;
color: rgba(1, 11, 33, 0.35);
font-size: 0.9rem;
font-weight: var(--bold);
text-transform: uppercase;
letter-spacing: 0.06em;
min-height: 220px;
flex: 1;
align-self: stretch;
}
.gap-diagram-stub svg {
opacity: 0.3;
} .gap-out-of-pocket { color: var(--gravity-blue);
border-radius: 1rem;
padding: 2.5rem 2.5rem;
}
.gap-warning-label {
font-size: 0.75rem;
font-weight: var(--bold);
letter-spacing: 0.09em;
text-transform: uppercase;
color: red;
margin-bottom: 0.75rem;
gap: 0.4rem;
}
.gap-out-of-pocket-title {
font-size: clamp(1.4rem, 2.5vw, 2rem);
font-weight: var(--bold);
margin-bottom: 1rem;
}
.gap-out-of-pocket-body {
font-size: 1.05rem;
line-height: 1.75;
margin-bottom: 1.25rem;
}
.gap-out-of-pocket-body + .gap-out-of-pocket-body {
margin-top: -0.5rem;
}
.gap-out-of-pocket-diagram {
margin-top: 2rem;
} @media (min-width: 769px) {
.gap-what-is {
flex-direction: row;
align-items: flex-start;
}
.gap-what-is-text {
flex: 1;
}
}
@media (max-width: 600px) {
.gap-consider {
padding: 2rem 1.25rem;
}
.gap-out-of-pocket {
padding: 1.75rem 1.25rem;
}
} .dpe-page {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
} .dpe-section {
width: 100%;
max-width: 720px;
margin: 0 auto;
padding: 4rem 1.5rem;
}
.dpe-divider {
width: 100%;
max-width: 720px;
margin: 0 auto;
border: none;
border-top: 1px solid rgba(1, 11, 33, 0.1);
} .dpe-eyebrow {
font-size: 0.75rem;
font-weight: var(--bold);
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--gravity-darkblue);
margin-bottom: 1rem;
display: block;
} .dpe-title {
font-size: clamp(2rem, 4vw, 3rem);
font-weight: var(--bold);
color: var(--gravity-darkblue);
line-height: 1.15;
margin-bottom: 1.5rem;
}
.dpe-body {
font-size: 1.1rem;
line-height: 1.8;
color: rgba(1, 11, 33, 0.75);
margin-bottom: 0;
} .dpe-stat {
display: inline-flex;
flex-direction: column;
align-items: center;
margin-top: 3rem;
padding: 2rem 3rem;
border-radius: 1.5rem;
background: var(--gravity-darkblue);
color: white;
}
.dpe-stat-number {
font-size: clamp(3.5rem, 8vw, 5.5rem);
font-weight: var(--bold);
color: var(--gravity-green);
line-height: 1;
}
.dpe-stat-label {
font-size: 0.95rem;
opacity: 0.7;
margin-top: 0.75rem;
line-height: 1.5;
} .dpe-checklist-wrap {
display: inline-flex;
flex-direction: column;
align-items: center;
text-align: center;
margin-top: 1rem;
gap: 1.1rem;
width: 100%;
max-width: 540px;
}
.dpe-checklist-item {
display: flex;
align-items: flex-start;
gap: 0.85rem;
font-size: 1.05rem;
line-height: 1.5;
color: var(--gravity-darkblue);
opacity: 0;
transform: translateY(16px);
transition: opacity 0.45s ease, transform 0.45s ease;
}
.dpe-checklist-item.dpe-anim-visible {
opacity: 1;
transform: translateY(0);
}
.dpe-check {
display: inline-flex;
align-items: center;
justify-content: center;
width: 22px;
height: 22px;
min-width: 22px;
background: var(--gravity-green);
border-radius: 50%;
color: var(--gravity-darkblue);
font-weight: var(--bold);
font-size: 0.65rem;
margin-top: 2px;
} .dpe-benefit {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.4rem;
padding: 2.5rem 0;
border-top: 1px solid rgba(1, 11, 33, 0.08);
width: 100%;
opacity: 0;
transform: translateY(20px);
transition: opacity 0.5s ease, transform 0.5s ease;
}
.dpe-benefit.dpe-anim-visible {
opacity: 1;
transform: translateY(0);
}
.dpe-benefit:last-child {
border-bottom: 1px solid rgba(1, 11, 33, 0.08);
}
.dpe-benefit-num {
font-size: 0.75rem;
font-weight: var(--bold);
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--gravity-darkblue);
margin-bottom: 0.25rem;
text-decoration: underline;
}
.dpe-benefit-title {
font-size: 1.3rem;
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 0.5rem;
}
.dpe-benefit-body {
font-size: 1rem;
line-height: 1.75;
color: rgba(1, 11, 33, 0.65);
max-width: 560px;
} .dpe-card-grid {
display: grid;
grid-template-columns: 1fr;
gap: 1.25rem;
width: 100%;
margin-top: 0.5rem;
text-align: left;
}
.dpe-card {
background: rgba(1, 11, 33, 0.04);
border-radius: 1rem;
padding: 1.75rem;
opacity: 0;
transform: translateY(16px);
transition: opacity 0.45s ease, transform 0.45s ease;
}
.dpe-card.dpe-anim-visible {
opacity: 1;
transform: translateY(0);
}
.dpe-card-icon {
font-size: 1.5rem;
margin-bottom: 0.75rem;
display: block;
}
.dpe-card-title {
font-size: 1rem;
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 0.5rem;
}
.dpe-card-body {
font-size: 0.95rem;
line-height: 1.7;
color: rgba(1, 11, 33, 0.65);
} .dpe-claims {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.25rem;
background: var(--gravity-darkblue);
border-radius: 1rem;
padding: 2rem;
margin-top: 2.5rem;
width: 100%;
text-align: center;
}
.dpe-claims-label {
font-size: 0.75rem;
font-weight: var(--bold);
letter-spacing: 0.1em;
text-transform: uppercase;
color: rgba(255,255,255,0.5);
}
.dpe-claims-number {
font-size: clamp(1.5rem, 4vw, 2.25rem);
font-weight: var(--bold);
color: var(--gravity-green);
text-decoration: none;
}
.dpe-claims-number:hover {
color: var(--gravity-green);
}
@media (min-width: 640px) {
.dpe-card-grid {
grid-template-columns: repeat(2, 1fr);
}
} .dpe-stats-row {
display: flex;
flex-direction: column;
gap: 1.5rem;
width: 100%;
margin-top: 2.5rem;
}
.dpe-stat-item {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
padding: 1.75rem 1rem;
border-radius: 1rem;
background: rgba(1, 11, 33, 0.04);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
opacity: 0;
transform: translateY(24px);
transition: opacity 0.5s ease, transform 0.5s ease;
}
.dpe-stat-item.dpe-anim-visible {
opacity: 1;
transform: translateY(0);
}
.dpe-stats-row .dpe-stat-item:nth-child(2) { transition-delay: 0.12s; }
.dpe-stats-row .dpe-stat-item:nth-child(3) { transition-delay: 0.24s; }
.dpe-stat-item-num {
font-size: clamp(2rem, 5vw, 3rem);
font-weight: var(--bold);
color: var(--gravity-darkblue);
line-height: 1;
}
.dpe-stat-item-label {
font-size: 0.9rem;
color: rgba(1, 11, 33, 0.6);
margin-top: 0.5rem;
line-height: 1.5;
text-align: center;
} .dpe-checklist-2col {
display: grid;
grid-template-columns: 1fr;
gap: 0.85rem;
width: 100%;
text-align: left;
margin-top: 1.25rem;
}
@media (min-width: 560px) {
.dpe-stats-row {
flex-direction: row;
}
.dpe-checklist-2col {
grid-template-columns: repeat(2, 1fr);
}
} .gl-promo-modal {
position: fixed;
inset: 0;
z-index: 1000;
display: none;
align-items: center;
justify-content: center;
padding: 20px;
}
.gl-promo-modal.active {
display: flex;
}
.gl-promo-modal-backdrop {
position: absolute;
inset: 0;
background: rgba(13, 27, 42, 0.55);
}
.gl-promo-modal-card {
position: relative;
background: var(--white);
border-radius: var(--radius-xl);
box-shadow: var(--shadow-md);
max-width: 420px;
width: 100%;
padding: 32px 28px;
text-align: center;
animation: gl-promo-modal-in 0.25s ease;
}
@keyframes gl-promo-modal-in {
from {
opacity: 0;
transform: translateY(12px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.gl-promo-modal-close {
position: absolute;
top: 14px;
right: 14px;
width: 28px;
height: 28px;
border: none;
background: none;
font-size: 1.4rem;
line-height: 1;
color: var(--muted);
cursor: pointer;
}
.gl-promo-modal-title {
font-size: 1.3rem;
color: var(--navy);
margin-bottom: 8px;
}
.gl-promo-modal-text {
font-size: 0.9rem;
color: var(--muted);
margin-bottom: 20px;
}
.gl-promo-modal-input-row {
display: flex;
gap: 8px;
margin-bottom: 12px;
}
.gl-promo-modal-input {
flex: 1;
min-width: 0;
padding: 12px 14px;
border: 1px solid var(--border);
border-radius: var(--radius-lg);
background: var(--input-bg);
font-size: 1rem;
text-transform: uppercase;
}
.gl-promo-modal-input:focus {
outline: none;
border-color: var(--lime);
box-shadow: 0 0 0 3px var(--lime-glow);
}
.gl-promo-modal-go {
padding: 12px 20px;
border: none;
border-radius: var(--radius-lg);
background: var(--lime);
color: var(--navy);
font-weight: 700;
cursor: pointer;
transition: background var(--transition);
}
.gl-promo-modal-go:hover {
background: var(--lime-dark);
}
.gl-promo-modal-go:disabled,
.gl-promo-modal-input:disabled {
opacity: 0.6;
cursor: not-allowed;
}
.gl-promo-modal-status {
font-size: 0.85rem;
color: var(--muted);
margin-bottom: 12px;
}
.gl-promo-modal-error {
font-size: 0.85rem;
color: var(--danger);
margin-bottom: 12px;
}
.gl-promo-modal-skip {
background: none;
border: none;
color: var(--muted);
font-size: 0.85rem;
text-decoration: underline;
cursor: pointer;
margin-top: 4px;
}
.gl-hidden {
display: none !important;
} #promo_intro:not(:empty) {
display: block;
text-align: center;
background: var(--off-white);
border: 1px solid var(--border);
border-radius: var(--radius-lg);
padding: 14px 18px;
margin-bottom: 24px;
color: var(--navy);
font-weight: 600;
}
.gl-promo-not-me {
margin-left: 8px;
background: none;
border: none;
color: var(--muted);
font-size: 0.8rem;
text-decoration: underline;
cursor: pointer;
} .gl-payment {
padding: 150px 0 80px;
}
.gl-payment .container {
width: 100%;
max-width: var(--container-max-lg);
margin-inline: auto;
padding-inline: var(--container-padding-x);
} .gl-payment-title {
font-size: clamp(1.75rem, 4vw, 2.5rem);
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 12px;
}
.gl-payment-content {
color: var(--gravity-gray);
line-height: 1.6;
margin-bottom: 8px;
}
.gl-payment-content p {
margin-bottom: 1rem;
} .gl-payment-transaction {
display: grid;
grid-template-columns: 1fr;
gap: 32px;
margin-top: 48px;
}
@media (min-width: 820px) {
.gl-payment-transaction {
grid-template-columns: 1.6fr 1fr;
align-items: start;
}
}
.gl-payment-form {
background: #fff;
border: 1px solid #e7eaf0;
border-radius: 14px;
padding: 28px;
box-shadow: 0 8px 28px rgba(1, 11, 33, 0.05);
} .gl-payment-meta {
display: flex;
flex-wrap: wrap;
gap: 8px 32px;
margin-bottom: 20px;
}
.gl-payment-meta-label {
font-weight: var(--demi-bold);
color: var(--gravity-darkblue);
margin-right: 6px;
}
.gl-payment-meta-value {
color: var(--gravity-gray);
} .gl-payment-card {
margin-bottom: 20px;
} .gl-payment-check {
display: flex;
align-items: flex-start;
gap: 10px;
margin-bottom: 14px;
color: var(--gravity-gray);
line-height: 1.4;
cursor: pointer;
}
.gl-payment-check input[type="checkbox"] {
margin-top: 3px;
width: 18px;
height: 18px;
accent-color: var(--gravity-blue);
flex-shrink: 0;
} .gl-payment-summary {
background: #f7f8fa;
border: 1px solid #e7eaf0;
border-radius: 14px;
padding: 24px;
box-shadow: 0 8px 28px rgba(1, 11, 33, 0.05);
}
@media (min-width: 820px) {
.gl-payment-summary {
position: sticky;
top: 110px;
}
}
.gl-payment-summary-row {
display: flex;
justify-content: space-between;
gap: 16px;
padding: 6px 0;
color: var(--gravity-gray);
}
.gl-payment-summary-label {
font-weight: var(--demi-bold);
color: var(--gravity-darkblue);
}
.gl-payment-summary-total {
margin-top: 8px;
padding-top: 14px;
border-top: 1px solid #e7eaf0;
font-size: 1.15rem;
}
.gl-payment-summary-total .gl-payment-summary-label,
.gl-payment-summary-total .gl-payment-summary-value {
font-weight: var(--bold);
color: var(--gravity-darkblue);
}
.gl-payment-disclaimer {
margin-top: 12px;
font-size: 0.8rem;
line-height: 1.5;
color: #667085;
} .gl-payment-error {
margin-top: 14px;
color: #b3261e;
font-weight: var(--demi-bold);
}
.gl-payment-error p {
margin: 0;
}
.gl-payment-submit {
all: unset;
display: inline-block;
margin-top: 18px;
width: 100%;
text-align: center;
box-sizing: border-box;
padding: 0.85rem 1.25rem;
border-radius: 12px;
font-weight: var(--demi-bold);
background-color: var(--gravity-green);
color: var(--gravity-blue);
cursor: pointer;
transition: opacity 0.2s ease;
}
.gl-payment-submit:hover {
opacity: 0.9;
} .gl-payment-success {
text-align: center;
padding: 32px 0;
}
.gl-payment-success h3 {
color: var(--gravity-darkblue);
font-weight: var(--bold);
margin-bottom: 10px;
}
.gl-payment-success p {
color: var(--gravity-gray);
}
.gl-payment-empty {
margin-top: 24px;
text-align: center;
padding: 40px 0;
}
.gl-payment-empty h2 {
font-size: 1.5rem;
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 10px;
}
.gl-payment-empty p {
color: var(--gravity-gray);
max-width: 480px;
margin-inline: auto;
line-height: 1.6;
} .wp-page-content {
max-width: var(--container-max-md);
padding-top: 150px;
padding-bottom: 80px;
text-align: left;
}
.wp-page-content-title {
font-size: clamp(1.75rem, 4vw, 2.5rem);
font-weight: var(--bold);
color: var(--gravity-darkblue);
margin-bottom: 24px;
}
.wp-page-content-body {
color: var(--gravity-gray);
line-height: 1.7;
}
.wp-page-content-body h2,
.wp-page-content-body h3,
.wp-page-content-body h4 {
color: var(--gravity-darkblue);
font-weight: var(--demi-bold);
margin: 2rem 0 0.75rem;
}
.wp-page-content-body p {
margin-bottom: 1.1rem;
}
.wp-page-content-body ul,
.wp-page-content-body ol {
margin: 0 0 1.1rem 1.5rem;
}
.wp-page-content-body li {
margin-bottom: 0.4rem;
}
.wp-page-content-body a {
color: var(--gravity-blue);
text-decoration: underline;
}