body {
    margin: 0;
    overflow-x: hidden;
}

.c-home-banner {
    padding: var(--space-m) var(--space-s);
    padding-block-start: var(--space-xl);
}

.c-home-banner__wrapper {
    width: min(var(--wrapper-max-width-l), 100%);
    box-sizing: border-box;
    max-width: 1400px;
    display: flex;
    justify-content: center;
}

.c-home-banner__image-container {
    position: relative;
    display: block;
    width: 100%;
}

.c-home-banner__img {
    max-width: 100%;
    width: 100%;
    aspect-ratio: 1126 / 551;
    max-height: 520px;
    object-fit: cover;
    object-position: center 25%;
    display: block;
    border-radius: 20px;
}

.c-home-banner__logo {
    position: absolute;
    top: clamp(70px, 16%, 140px);
    right: clamp(40px, 6%, 100px);
    width: clamp(240px, 44%, 500px);
    height: auto;
    display: block;
    pointer-events: none;
    opacity: 0;
    animation: slideUpIn 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s forwards;
}

.c-home-banner__overlay-buttons {
    position: absolute;
    bottom: clamp(10%, 3vw + 10%, 26%);
    right: clamp(60px, 9%, 140px);
    display: flex;
    flex-direction: row;
    gap: var(--space-s);
}

.c-home-banner__btn {
    display: inline-block;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: var(--step-0);
    text-decoration: none;
    text-align: center;
    padding: var(--space-xs) var(--space-l);
    border-radius: var(--border-radius);
    text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.65);
    transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
}

.c-home-banner__btn:hover {
    transform: scale(1.05);
}

.c-home-banner__btn--orange {
    background-color: var(--fire);
    color: var(--white);
    border: 2px solid var(--fire);
}

.c-home-banner__btn--orange:hover {
    background-color: var(--white);
    color: var(--fire);
}

.c-home-banner__btn--yellow {
    background-color: var(--medallion);
    color: var(--white);
    border: 2px solid var(--medallion);
}

.c-home-banner__btn--yellow:hover {
    background-color: var(--white);
    color: var(--medallion);
}

/* Section 2 */
.c-loan-process {
    padding-block: var(--space-2xl);
}
.c-loan-process__wrapper {
    text-align: center;
}
.c-loan-process__wrapper .c-loan-process__buttons {
    justify-content: center;
}
.c-loan-process__wrapper + .c-loan-process__wrapper {
    margin-block-start: var(--space-m);
}
.c-loan-process__columns {
    align-items: center;
}
.c-loan-process__column {
    text-align: left;
}
.c-reviews__phone-container {
    /* Sizes the container */
    aspect-ratio: 3.2/3;
    width:min(var(--wrapper-max-width-s), 100%);
    height: auto;
    overflow:hidden;
}
canvas {
    display: block;
    width:100% !important;
    height: 100% !important;
}

.c-loan-process__buttons {
    margin-block-start: var(--space-m);
    align-items: stretch;
    justify-content: center;
    gap: var(--space-m);
}
.c-loan-process__button {
    border-radius: var(--border-radius);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    filter: drop-shadow(2px 2px 7px rgba(0,0,0,.4)) brightness(1);
    max-width: calc(25% - (var(--space-m)));
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 1.2s ease;
}

.c-loan-process__button.is-visible {
    opacity: 1;
    transform: none;
}
.c-loan-process__img {
    max-width: 200px;
    width: 100%;
    height: auto;
    display: block;
    border-radius: 15px;
}
.c-loan-process__button .u-ff-shelby {
    display: block;
    text-shadow: 1px 2px 6px rgba(0, 0, 0, 0.7);
}

@media (hover: hover) {
    .c-loan-process__buttons a:hover {
        filter: drop-shadow(2px 2px 7px rgba(0,0,0,.4)) brightness(1.5);
        transform: scale(1.05);
        transform-origin: center;
    }
    /* .c-loan-process__buttons a:nth-of-type(even):hover {
        transform: scale(1.1);
        transform-origin: center;
    } */
}


.c-here-to-help {
    background-color: var(--powder);
    padding-block: var(--space-2xl);
    margin-block-end: 0;
}

.c-here-to-help__columns {
    display: flex;
    align-items: center;
    gap: var(--space-xl);
}

.c-here-to-help__column--image {
    flex: 0 0 55%;
}

.c-here-to-help__img {
    width: 100%;
    height: auto;
    display: block;
}

.c-here-to-help__column--content {
    flex: 1;
}

.c-here-to-help__heading {
    color: var(--corporategreen);
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-size: var(--step-3);
    margin-bottom: var(--space-m);
}

.c-here-to-help__body {
    color: var(--black);
    margin-bottom: var(--space-l);
    line-height: 1.6;
}

.c-here-to-help__button {
    display: inline-block;
    background-color: var(--medallion);
    color: var(--white);
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: var(--step-0);
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 0.08em;
    padding: var(--space-s) var(--space-2xl);
    border-radius: var(--border-radius);
    border: 2px solid var(--medallion);
    transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
    text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.65);
}

.c-here-to-help__button:hover {
    background-color: var(--white);
    color: var(--medallion);
    transform: scale(1.05);
}

@media (max-width: 768px) {
    .c-here-to-help__columns {
        flex-direction: column;
    }
    .c-here-to-help__column--image {
        flex: unset;
        width: 100%;
    }
    .c-home-banner__logo {
        top: var(--space-s);
        right: var(--space-s);
        width: clamp(90px, 28vw, 160px);
    }
    .c-home-banner__btn {
        font-size: 0.65rem;
        padding: var(--space-2xs) var(--space-s);
    }
    .c-home-banner__overlay-buttons {
        flex-direction: column;
        gap: var(--space-2xs);
        right: 50%;
        transform: translateX(50%);
        bottom: 10%;
    }
}

.c-loan-programs {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: var(--space-s);
    justify-content: flex-start;
}

/* =====================
   ANIMATIONS
   ===================== */

@keyframes bannerFadeIn {
    from { opacity: 0; transform: scale(1.03); }
    to   { opacity: 1; transform: scale(1); }
}

@keyframes slideUpIn {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

.c-home-banner__img {
    animation: bannerFadeIn 1.1s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

.c-home-banner__btn--orange {
    opacity: 0;
    animation: slideUpIn 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s forwards;
}

.c-home-banner__btn--yellow {
    opacity: 0;
    animation: slideUpIn 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.95s forwards;
}

@media (prefers-reduced-motion: reduce) {
    .c-home-banner__img,
    .c-home-banner__logo,
    .c-home-banner__btn--orange,
    .c-home-banner__btn--yellow { animation: none; opacity: 1; }
}