/*
|--------------------------------------------------------------------------
| 借貸導航網首頁
|--------------------------------------------------------------------------
*/

/*
|--------------------------------------------------------------------------
| 首頁 Header
|--------------------------------------------------------------------------
*/

.home-header-inner {
    display: grid;

    grid-template-columns:
        auto
        minmax(0, 1fr)
        auto;

    align-items: center;

    gap: 28px;
}


/*
|--------------------------------------------------------------------------
| 共用 Header 基本樣式（即使其他頁只載入本檔也能正常顯示）
|--------------------------------------------------------------------------
*/

.home-header-inner {
    width: min(1180px, calc(100% - 40px));
    min-height: 74px;
    margin: 0 auto;
}


.home-header-inner .brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;

    color: #172033;
    text-decoration: none;
    white-space: nowrap;
}


.home-header-inner .brand-mark {
    display: grid;
    place-items: center;

    width: 34px;
    height: 34px;

    border-radius: 10px;

    background: #14213d;
    color: #ffffff;

    font-size: 14px;
    font-weight: 800;
}


.home-header-inner .brand-name {
    color: #172033;

    font-size: 20px;
    font-weight: 800;
    letter-spacing: -.02em;
}


.home-header-inner .partner-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 10px 15px;

    border: 1px solid #d0d5dd;
    border-radius: 10px;

    background: #ffffff;
    color: #14213d;

    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}


/*
|--------------------------------------------------------------------------
| 跑馬燈
|--------------------------------------------------------------------------
*/

.loan-ticker {
    min-width: 0;

    overflow: hidden;
}


.loan-ticker-mask {
    position: relative;

    overflow: hidden;

    width: 100%;

    padding:
        9px 0;

    border-radius: 0;

    border: 0;

    background: transparent;
}


/*
| 左右淡出
*/

.loan-ticker-mask::before,
.loan-ticker-mask::after {
    content: "";

    position: absolute;

    top: 0;
    bottom: 0;

    z-index: 2;

    width: 42px;

    pointer-events: none;
}


.loan-ticker-mask::before {
    left: 0;

    background:
        linear-gradient(
            to right,
            #ffffff,
            rgba(255, 255, 255, 0)
        );
}


.loan-ticker-mask::after {
    right: 0;

    background:
        linear-gradient(
            to left,
            #ffffff,
            rgba(255, 255, 255, 0)
        );
}


.loan-ticker-track {
    display: flex;

    align-items: center;

    width: max-content;

    white-space: nowrap;

    animation:
        loanTickerMove
        64s
        linear
        infinite;
}


.loan-ticker-label {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 14px;
    color: #17375f;
    font-size: 14px;
    font-weight: 950;
    letter-spacing: .03em;
}


.loan-ticker-item {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 15px;
    font-size: 14px;
    font-weight: 850;
    line-height: 1.3;
}


.loan-ticker-tone-info { color: #315f91; }

.loan-ticker-tone-compare { color: #b3651f; }

.loan-ticker-tone-member { color: #25804a; }

.loan-ticker-tone-fraud { color: #c13c3c; }


.loan-ticker-dot {
    padding: 0 10px;
    color: #c3ccd7;

    font-size: 10px;
}


@keyframes loanTickerMove {

    from {
        transform:
            translateX(0);
    }

    to {
        transform:
            translateX(-50%);
    }
}


/*
|--------------------------------------------------------------------------
| 滑鼠移到跑馬燈時暫停
|--------------------------------------------------------------------------
*/

.loan-ticker:hover
.loan-ticker-track {
    animation-play-state:
        paused;
}

.loan-ticker-link {
    text-decoration: none;
    transition: color .16s ease, opacity .16s ease;
}

.loan-ticker-link:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
    opacity: .82;
}


/*
|--------------------------------------------------------------------------
| 右側按鈕/*
|--------------------------------------------------------------------------
| 右側按鈕
|--------------------------------------------------------------------------
*/

.home-partner-link {
    flex: 0 0 auto;

    white-space: nowrap;
}



/*
|--------------------------------------------------------------------------
| 尊重使用者減少動畫設定
|--------------------------------------------------------------------------
*/

@media (
    prefers-reduced-motion:
    reduce
) {

    .loan-ticker-track {
        animation: none;
    }
}

/*
|--------------------------------------------------------------------------
| 首頁標題 + 瀏覽次數
|--------------------------------------------------------------------------
*/

.simple-hero-top {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto;

    align-items: start;

    gap: 40px;

    margin-bottom: 34px;
}


.hero-view-counter {
    display: flex;

    align-items: baseline;
    justify-content: flex-end;

    gap: 4px;

    margin-top: 8px;

    color: #98a2b3;

    font-size: 13px;
    font-weight: 700;

    white-space: nowrap;
}


.hero-view-counter strong {
    display: inline-block;

    color: #2f6fed;

    font-size: 20px;
    font-weight: 900;

    font-variant-numeric:
        tabular-nums;

    transition:
        transform .18s ease,
        opacity .18s ease;
}


.hero-view-counter strong.is-updating {
    transform:
        translateY(-2px);

    opacity: .78;
}


.simple-hero {
    padding: 62px 0 74px;

    background-color: #fbfaf6;

    background-image:
        linear-gradient(
            to right,
            rgba(251, 250, 246, 0.98) 0%,
            rgba(251, 250, 246, 0.94) 28%,
            rgba(251, 250, 246, 0.82) 45%,
            rgba(251, 250, 246, 0.58) 62%,
            rgba(251, 250, 246, 0.24) 80%,
            rgba(251, 250, 246, 0.08) 100%
        ),
        url('/assets/images/home-hero-bg.png?v=gold02');

    background-repeat: no-repeat;
    background-position: center right;
    background-size: cover;
}


.simple-hero-head {
    max-width: 760px;

    margin: 0;
}


.simple-kicker {
    margin-bottom: 10px;

    color: #2f6fed;

    font-size: 13px;
    font-weight: 900;

    letter-spacing: .04em;
}


.simple-hero-head h1 {
    margin: 0 0 18px;

    color: #101828;

    font-size: clamp(38px, 6vw, 62px);

    line-height: 1.13;

    letter-spacing: -.045em;
}


.simple-hero-head p {
    max-width: 680px;

    margin: 0;

    color: #667085;

    font-size: 17px;

    line-height: 1.8;
}



/*
|--------------------------------------------------------------------------
| 兩大入口
|--------------------------------------------------------------------------
*/

.simple-entry-grid {
    display: grid;

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

    gap: 18px;
}


.simple-entry-card {
    position: relative;

    display: flex;
    flex-direction: column;

    min-height: 245px;

    padding: 30px;

    border: 1px solid #dfe5ee;
    border-radius: 22px;

    background: #ffffff;

    color: #101828;

    text-decoration: none;

    box-shadow:
        0 8px 26px
        rgba(15, 23, 42, .04);

    transition:
        transform .16s ease,
        box-shadow .16s ease;
}


.simple-entry-card:hover {
    transform: translateY(-3px);

    box-shadow:
        0 14px 34px
        rgba(15, 23, 42, .08);
}


.simple-entry-card.personal::after,
.simple-entry-card.business::after {
    content: "";

    position: absolute;

    right: -45px;
    bottom: -65px;

    width: 190px;
    height: 190px;

    border-radius: 50%;

    background:
        rgba(47, 111, 237, .06);
}


.simple-entry-number {
    position: relative;
    z-index: 1;

    margin-bottom: 30px;

    color: #98a2b3;

    font-size: 13px;
    font-weight: 900;
}


.simple-entry-card h2 {
    position: relative;
    z-index: 1;

    margin: 0 0 12px;

    font-size: 30px;

    letter-spacing: -.025em;
}


.simple-entry-card p {
    position: relative;
    z-index: 1;

    margin: 0 0 25px;

    color: #667085;

    line-height: 1.7;
}


.simple-entry-card span {
    position: relative;
    z-index: 1;

    margin-top: auto;

    font-weight: 900;
}



/*
|--------------------------------------------------------------------------
| 業者
|--------------------------------------------------------------------------
*/

.home-providers {
    padding: 72px 0;

    background: #ffffff;
}


.home-section-head {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap: 30px;

    margin-bottom: 28px;
}


.home-section-head > div {
    max-width: 720px;
}


.home-section-head h2 {
    margin: 0 0 10px;

    color: #101828;

    font-size: 34px;

    letter-spacing: -.025em;
}


.home-section-head p {
    margin: 0;

    color: #667085;

    line-height: 1.75;
}


.home-more-button {
    flex: 0 0 auto;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-height: 46px;

    padding: 0 18px;

    border: 1px solid #d0d5dd;
    border-radius: 10px;

    background: #ffffff;

    color: #101828;

    font-size: 14px;
    font-weight: 900;

    text-decoration: none;
}


.home-provider-grid {
    display: grid;

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

    gap: 16px;
}


.home-provider-card {
    overflow: hidden;

    display: flex;
    flex-direction: column;

    border: 1px solid #e1e6ed;
    border-radius: 18px;

    background: #ffffff;

    color: inherit;

    text-decoration: none;

    transition:
        transform .16s ease,
        box-shadow .16s ease;
}


.home-provider-card:hover {
    transform: translateY(-3px);

    box-shadow:
        0 12px 28px
        rgba(15, 23, 42, .07);
}


.home-provider-image {
    aspect-ratio: 16 / 10;

    background: #edf1f6;
}


.home-provider-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


.home-provider-placeholder {
    display: flex;

    align-items: center;
    justify-content: center;

    height: 100%;

    padding: 20px;

    color: #667085;

    font-size: 18px;
    font-weight: 900;

    text-align: center;
}


.home-provider-body {
    padding: 20px;
}


.home-provider-status {
    display: inline-flex;

    margin-bottom: 12px;

    padding: 5px 8px;

    border-radius: 7px;

    background: #eef6ff;

    color: #3569a8;

    font-size: 11px;
    font-weight: 900;
}

.home-provider-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;

    margin:
        -3px 0
        12px;
}


.home-provider-tags span {
    display: inline-flex;

    align-items: center;

    min-height: 25px;

    padding:
        0 8px;

    border-radius: 7px;

    background: #f2f4f7;

    color: #667085;

    font-size: 11px;
    font-weight: 800;
}

.home-provider-company {
    margin-bottom: 7px;

    color: #667085;

    font-size: 13px;
    font-weight: 800;
}


.home-provider-body h3 {
    margin: 0 0 10px;

    color: #101828;

    font-size: 20px;

    line-height: 1.4;
}


.home-provider-body p {
    margin: 0;

    color: #667085;

    font-size: 14px;

    line-height: 1.7;
}


.home-provider-empty {
    padding: 28px;

    border: 1px solid #e1e6ed;
    border-radius: 16px;

    background: #f9fafb;

    color: #667085;
}

/*
|--------------------------------------------------------------------------
| 借款心得
|--------------------------------------------------------------------------
*/

.home-reviews {
    padding: 70px 0 80px;

    background: #f7f9fc;
}


.home-reviews-head {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap: 28px;

    margin-bottom: 28px;
}


.home-reviews-head > div {
    max-width: 700px;
}


.home-reviews-head h2 {
    margin: 0 0 12px;

    color: #101828;

    font-size: 34px;

    letter-spacing: -.025em;
}


.home-reviews-head p {
    margin: 0;

    color: #667085;

    font-size: 15px;

    line-height: 1.75;
}


.home-review-grid {
    display: grid;

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

    gap: 16px;
}


.home-review-card {
    display: flex;
    flex-direction: column;

    min-height: 300px;

    padding: 24px;

    border: 1px solid #e1e6ed;
    border-radius: 18px;

    background: #ffffff;
}


.home-review-top {
    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 18px;
}


.home-review-avatar {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 44px;
    height: 44px;

    flex: 0 0 44px;

    border-radius: 50%;

    background: #eef3f9;

    color: #475467;

    font-size: 16px;
    font-weight: 900;
}


.home-review-name {
    color: #101828;

    font-size: 15px;
    font-weight: 900;
}


.home-review-meta {
    margin-top: 3px;

    color: #667085;

    font-size: 12px;
}


.home-review-status {
    align-self: flex-start;

    margin-bottom: 18px;

    padding: 5px 9px;

    border-radius: 7px;

    background: #ecfdf3;

    color: #027a48;

    font-size: 11px;
    font-weight: 900;
}


.home-review-text {
    margin: 0;

    color: #344054;

    font-size: 15px;

    line-height: 1.85;
}


.home-review-date {
    margin-top: auto;

    padding-top: 22px;

    color: #98a2b3;

    font-size: 12px;
}


.home-review-note {
    margin-top: 18px;

    color: #98a2b3;

    font-size: 12px;

    line-height: 1.7;
}

/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    /*
    |--------------------------------------------------------------------------
    | Header
    |--------------------------------------------------------------------------
    */

    .home-header-inner {
        width: min(100% - 28px, 1180px);
        min-height: 66px;

        grid-template-columns:
            auto
            minmax(0, 1fr)
            auto;

        gap: 10px;
    }


    .home-header-inner .brand-name {
        display: none;
    }


    .loan-ticker-mask {
        padding: 9px 0;
    }


    .loan-ticker-item {
        padding: 0 12px;

        font-size: 12px;
    }


    .home-partner-link {
        padding: 10px 12px;

        font-size: 13px;
    }

    .simple-hero-top {
        grid-template-columns: 1fr;

        gap: 18px;
    }


    .hero-view-counter {
        justify-content: flex-start;

        margin-top: -4px;

        font-size: 12px;
    }


    .hero-view-counter strong {
        font-size: 18px;
    }

    /*
    |--------------------------------------------------------------------------
    | 首頁第一區
    |--------------------------------------------------------------------------
    */

    .simple-hero {
    padding: 38px 0 48px;

    background-position: 72% center;
    background-size: cover;
}

    .simple-hero-head {
        margin-bottom: 0;
    }


    .simple-hero-head h1 {
        font-size: 38px;
    }


    .simple-entry-grid {
        grid-template-columns: 1fr;
    }


    .simple-entry-card {
        min-height: 205px;

        padding: 24px 21px;
    }


    .simple-entry-card h2 {
        font-size: 26px;
    }


    /*
    |--------------------------------------------------------------------------
    | 精選業者
    |--------------------------------------------------------------------------
    */

    .home-providers {
        padding: 52px 0;
    }


    .home-section-head {
        display: block;
    }


    .home-section-head h2 {
        font-size: 29px;
    }


    .home-more-button {
        margin-top: 18px;
    }


    .home-provider-grid {
        grid-template-columns: 1fr;
    }


    /*
    |--------------------------------------------------------------------------
    | 借款心得
    |--------------------------------------------------------------------------
    */

    .home-reviews {
        padding: 52px 0;
    }


    .home-reviews-head {
        display: block;
    }


    .home-reviews-head h2 {
        font-size: 29px;
    }


    .home-reviews-head .home-more-button {
        margin-top: 18px;
    }


    .home-review-grid {
        grid-template-columns: 1fr;
    }


    .home-review-card {
        min-height: 0;

        padding: 21px;
    }

}


/*
|--------------------------------------------------------------------------
| Brand Visual v1 — 深海軍藍 × 香檳金 × 米白
|--------------------------------------------------------------------------
*/

:root {
    --brand-navy: #14213d;
    --brand-navy-deep: #0f172a;
    --brand-gold: #c9a04a;
    --brand-gold-deep: #9a7120;
    --brand-gold-soft: #f3e6bf;
    --brand-ivory: #fbfaf6;
}


/*
|--------------------------------------------------------------------------
| Logo / Header
|--------------------------------------------------------------------------
*/

.home-header-inner .brand-mark {
    position: relative;

    border: 1px solid rgba(201, 160, 74, .62);

    background:
        linear-gradient(
            145deg,
            #182748 0%,
            #101a31 100%
        );

    box-shadow:
        0 7px 18px
        rgba(15, 23, 42, .14);
}

.home-header-inner .brand-mark::after {
    content: "↗";

    position: absolute;

    top: 2px;
    right: 4px;

    color: #e6c875;

    font-size: 8px;
    font-weight: 900;
    line-height: 1;
}

.home-header-inner .brand-name {
    color: var(--brand-navy-deep);
}

.home-header-inner .partner-link {
    border-color: rgba(201, 160, 74, .58);

    background:
        rgba(255, 253, 248, .96);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

.home-header-inner .partner-link:hover {
    transform: translateY(-1px);

    border-color: var(--brand-gold);

    background: #ffffff;

    box-shadow:
        0 8px 22px
        rgba(154, 113, 32, .10);
}

.loan-ticker-mask {
    background:
        linear-gradient(
            90deg,
            #fbfaf6 0%,
            #fffefb 100%
        );

    border:
        1px solid
        rgba(201, 160, 74, .12);
}

.loan-ticker-mask::before {
    background:
        linear-gradient(
            to right,
            #fbfaf6,
            rgba(251, 250, 246, 0)
        );
}

.loan-ticker-mask::after {
    background:
        linear-gradient(
            to left,
            #fffefb,
            rgba(255, 254, 251, 0)
        );
}

.loan-ticker-item:first-child {
    color: var(--brand-gold-deep);
}

.loan-ticker-dot {
    color: #d8c79e;
}


/*
|--------------------------------------------------------------------------
| Hero
|--------------------------------------------------------------------------
*/

.simple-kicker {
    color: var(--brand-gold-deep);
}

.hero-view-counter {
    color: #7d7567;
}

.hero-view-counter strong {
    color: var(--brand-gold-deep);
}

.simple-hero {
    position: relative;

    isolation: isolate;
}

.simple-hero::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: -1;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.02),
            rgba(251,250,246,.08)
        );

    pointer-events: none;
}

.hero-title {
    overflow: visible;
}

.hero-title-line {
    display: block;

    opacity: 0;

    transform:
        translateY(14px);

    animation:
        heroTitleEnter
        .62s
        cubic-bezier(.22,.8,.3,1)
        forwards;
}

.hero-title-line:nth-child(1) {
    animation-delay: .08s;
}

.hero-title-line:nth-child(2) {
    animation-delay: .20s;
}

.hero-title-accent {
    position: relative;

    width: fit-content;
}

.hero-title-accent::after {
    content: "";

    position: absolute;

    left: 1px;
    right: 4px;
    bottom: -5px;

    height: 3px;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            rgba(201,160,74,.95),
            rgba(230,200,117,.42)
        );

    transform:
        scaleX(0);

    transform-origin:
        left center;

    animation:
        heroAccentDraw
        .62s
        ease
        .62s
        forwards;
}

@keyframes heroTitleEnter {
    to {
        opacity: 1;

        transform:
            translateY(0);
    }
}

@keyframes heroAccentDraw {
    to {
        transform:
            scaleX(1);
    }
}


/*
|--------------------------------------------------------------------------
| 首頁兩大入口卡片
|--------------------------------------------------------------------------
*/

.simple-entry-card {
    overflow: hidden;

    border-color:
        rgba(201, 160, 74, .27);

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

    box-shadow:
        0 10px 30px
        rgba(50, 42, 27, .055);

    backdrop-filter:
        blur(4px);

    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease,
        background .22s ease;
}

.simple-entry-card.personal::after,
.simple-entry-card.business::after {
    background:
        rgba(201, 160, 74, .095);

    transition:
        transform .28s ease,
        opacity .28s ease;
}

.simple-entry-card:hover {
    transform:
        translateY(-4px);

    border-color:
        rgba(201, 160, 74, .66);

    background: #ffffff;

    box-shadow:
        0 18px 42px
        rgba(50, 42, 27, .10);
}

.simple-entry-card:hover::after {
    transform:
        translate(-8px, -8px)
        scale(1.06);
}

.simple-entry-card > span {
    color: var(--brand-gold-deep);

    transition:
        transform .20s ease,
        color .20s ease;
}

.simple-entry-card:hover > span {
    transform:
        translateX(4px);

    color: #7f5a12;
}

.simple-entry-number {
    color: #b7a270;
}


/*
|--------------------------------------------------------------------------
| 業者卡片
|--------------------------------------------------------------------------
*/

.home-provider-card {
    border-color:
        rgba(201, 160, 74, .22);

    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}

.home-provider-image {
    overflow: hidden;

    background:
        #f4f0e7;
}

.home-provider-image img {
    transition:
        transform .32s
        cubic-bezier(.22,.8,.3,1);
}

.home-provider-card:hover {
    transform:
        translateY(-4px);

    border-color:
        rgba(201, 160, 74, .52);

    box-shadow:
        0 16px 38px
        rgba(50, 42, 27, .09);
}

.home-provider-card:hover
.home-provider-image img {
    transform:
        scale(1.025);
}

.home-provider-status {
    background:
        #fbf4e4;

    color:
        #7d5b17;
}


/*
|--------------------------------------------------------------------------
| 心得卡片
|--------------------------------------------------------------------------
*/

.home-reviews {
    background:
        linear-gradient(
            180deg,
            #f8f6f0 0%,
            #fbfaf6 100%
        );
}

.home-review-card {
    border-color:
        rgba(201, 160, 74, .22);

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

    box-shadow:
        0 8px 24px
        rgba(50, 42, 27, .045);

    opacity: 0;

    transform:
        translateY(12px);

    animation:
        reviewCardEnter
        .52s
        ease
        forwards;
}

.home-review-card:nth-child(1) {
    animation-delay: .10s;
}

.home-review-card:nth-child(2) {
    animation-delay: .20s;
}

.home-review-card:nth-child(3) {
    animation-delay: .30s;
}

.home-review-avatar {
    background:
        #f8f1df;

    color:
        #7d5b17;
}

.home-review-status {
    background:
        #f8f1df;

    color:
        #7d5b17;
}

@keyframes reviewCardEnter {
    to {
        opacity: 1;

        transform:
            translateY(0);
    }
}


/*
|--------------------------------------------------------------------------
| 動畫偏好
|--------------------------------------------------------------------------
*/

@media (
    prefers-reduced-motion:
    reduce
) {

    .hero-title-line,
    .hero-title-accent::after,
    .home-review-card {
        animation: none;

        opacity: 1;

        transform: none;
    }

    .simple-entry-card,
    .home-provider-card,
    .home-provider-image img {
        transition: none;
    }
}


/*
|--------------------------------------------------------------------------
| Brand Visual v1 Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    .hero-title-accent {
        width: auto;
    }

    .hero-title-accent::after {
        right: 18%;
    }

    .simple-entry-card {
        backdrop-filter: none;
    }

}
/*
|--------------------------------------------------------------------------
| Homepage Entry Cards v2 — 強化「我要借款 / 公司要週轉」視覺
|--------------------------------------------------------------------------
*/

.simple-entry-grid {
    gap: 22px;
}

.simple-entry-card {
    min-height: 300px;
    padding: 34px;

    border-width: 1.5px;
    border-style: solid;

    transform-origin: center bottom;

    transition:
        transform .28s cubic-bezier(.2,.8,.2,1),
        box-shadow .28s ease,
        border-color .28s ease,
        background-position .36s ease;
}

/* 右上角類型標籤 */
.simple-entry-card::before {
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 3;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 30px;
    padding: 0 11px;

    border-radius: 999px;

    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;

    white-space: nowrap;
}

/* 個人借款：米白 × 香檳金 */
.simple-entry-card.personal {
    border-color: rgba(201,160,74,.62);

    background:
        radial-gradient(
            circle at 92% 16%,
            rgba(230,200,117,.28) 0,
            rgba(230,200,117,.10) 22%,
            transparent 46%
        ),
        linear-gradient(
            135deg,
            rgba(255,255,255,.98) 0%,
            #fffaf0 54%,
            #f6ead0 100%
        );

    background-size: 120% 120%;

    box-shadow:
        inset 0 4px 0 rgba(201,160,74,.72),
        0 16px 38px rgba(96,71,24,.12);
}

.simple-entry-card.personal::before {
    content: "個人借款";

    border: 1px solid rgba(201,160,74,.40);

    background: rgba(255,250,240,.90);
    color: #8b6419;

    box-shadow:
        0 5px 14px rgba(154,113,32,.08);
}

/* 公司週轉：深海軍藍 × 香檳金 */
.simple-entry-card.business {
    border-color: rgba(230,200,117,.70);

    background:
        radial-gradient(
            circle at 92% 16%,
            rgba(230,200,117,.19) 0,
            rgba(230,200,117,.07) 24%,
            transparent 48%
        ),
        linear-gradient(
            135deg,
            #1b2b4f 0%,
            #14213d 55%,
            #0f192f 100%
        );

    background-size: 120% 120%;

    color: #ffffff;

    box-shadow:
        inset 0 4px 0 rgba(230,200,117,.74),
        0 18px 42px rgba(15,23,42,.20);
}

.simple-entry-card.business::before {
    content: "企業週轉";

    border: 1px solid rgba(230,200,117,.48);

    background: rgba(9,18,36,.52);
    color: #f0d98f;

    box-shadow:
        0 5px 16px rgba(0,0,0,.12);
}

/* 背景裝飾圓 */
.simple-entry-card.personal::after,
.simple-entry-card.business::after {
    right: -58px;
    bottom: -78px;

    width: 235px;
    height: 235px;

    opacity: .95;

    transition:
        transform .36s cubic-bezier(.2,.8,.2,1),
        opacity .28s ease;
}

.simple-entry-card.personal::after {
    background:
        radial-gradient(
            circle,
            rgba(230,200,117,.32) 0%,
            rgba(201,160,74,.12) 45%,
            rgba(201,160,74,.03) 68%,
            transparent 72%
        );
}

.simple-entry-card.business::after {
    background:
        radial-gradient(
            circle,
            rgba(230,200,117,.22) 0%,
            rgba(201,160,74,.08) 46%,
            transparent 72%
        );
}

/* 01 / 02 改成明顯徽章 */
.simple-entry-number {
    display: grid;
    place-items: center;

    width: 48px;
    height: 48px;

    margin-bottom: 42px;

    border-radius: 50%;

    font-size: 13px;
    font-weight: 900;
}

.simple-entry-card.personal .simple-entry-number {
    border: 1px solid rgba(201,160,74,.55);

    background: #f6e8c4;
    color: #7d5712;

    box-shadow:
        0 6px 16px rgba(154,113,32,.10);
}

.simple-entry-card.business .simple-entry-number {
    border: 1px solid rgba(230,200,117,.50);

    background: rgba(230,200,117,.12);
    color: #f0d98f;

    box-shadow:
        0 6px 16px rgba(0,0,0,.10);
}

/* 主標題 */
.simple-entry-card h2 {
    margin-bottom: 13px;

    font-size: clamp(30px, 3vw, 36px);
    line-height: 1.16;
}

.simple-entry-card.personal h2 {
    color: #14213d;
}

.simple-entry-card.business h2 {
    color: #ffffff;
}

/* 說明文字 */
.simple-entry-card p {
    max-width: 88%;
    margin-bottom: 30px;

    font-size: 15px;
    line-height: 1.8;
}

.simple-entry-card.personal p {
    color: #665f54;
}

.simple-entry-card.business p {
    color: #cdd5e2;
}

/* CTA 做成真正的按鈕感 */
.simple-entry-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: fit-content;
    min-height: 44px;

    margin-top: auto;
    padding: 0 16px;

    border-radius: 999px;

    font-size: 14px;
    font-weight: 900;

    transition:
        transform .24s cubic-bezier(.2,.8,.2,1),
        box-shadow .24s ease,
        background .24s ease,
        color .24s ease;
}

.simple-entry-card.personal > span {
    background: #14213d;
    color: #ffffff;

    box-shadow:
        0 8px 18px rgba(20,33,61,.16);
}

.simple-entry-card.business > span {
    background:
        linear-gradient(
            135deg,
            #e5c66d,
            #c9a04a
        );

    color: #14213d;

    box-shadow:
        0 8px 20px rgba(201,160,74,.19);
}

/* 明顯 Hover */
.simple-entry-card:hover {
    transform:
        translateY(-8px)
        scale(1.012);
}

.simple-entry-card.personal:hover {
    border-color: #c9a04a;

    background-position: 96% 12%;

    box-shadow:
        inset 0 4px 0 #c9a04a,
        0 24px 52px rgba(96,71,24,.18);
}

.simple-entry-card.business:hover {
    border-color: #e5c66d;

    background-position: 96% 12%;

    box-shadow:
        inset 0 4px 0 #e5c66d,
        0 26px 56px rgba(15,23,42,.28);
}

.simple-entry-card:hover::after {
    transform:
        translate(-16px, -16px)
        scale(1.14);
}

.simple-entry-card:hover > span {
    transform: translateX(7px);
}

.simple-entry-card.personal:hover > span {
    background: #0f192f;

    box-shadow:
        0 11px 24px rgba(20,33,61,.23);
}

.simple-entry-card.business:hover > span {
    background:
        linear-gradient(
            135deg,
            #efd98f,
            #d6ad51
        );

    box-shadow:
        0 11px 25px rgba(201,160,74,.28);
}

/* 鍵盤操作也要有清楚焦點 */
.simple-entry-card:focus-visible {
    outline: 3px solid rgba(201,160,74,.42);
    outline-offset: 4px;
}

/* Mobile */
@media (max-width: 760px) {

    .simple-entry-grid {
        gap: 16px;
    }

    .simple-entry-card {
        min-height: 235px;
        padding: 24px 21px;
    }

    .simple-entry-card::before {
        top: 18px;
        right: 18px;

        min-height: 27px;
        padding: 0 9px;

        font-size: 11px;
    }

    .simple-entry-number {
        width: 42px;
        height: 42px;

        margin-bottom: 28px;

        font-size: 12px;
    }

    .simple-entry-card h2 {
        font-size: 28px;
    }

    .simple-entry-card p {
        max-width: 100%;

        margin-bottom: 24px;

        font-size: 14px;
    }

    .simple-entry-card > span {
        min-height: 40px;

        padding: 0 14px;

        font-size: 13px;
    }

    /* 觸控裝置不依賴 hover 才能辨識 */
    .simple-entry-card:hover {
        transform: none;
    }
}

/* Reduce Motion */
@media (
    prefers-reduced-motion:
    reduce
) {

    .simple-entry-card,
    .simple-entry-card::after,
    .simple-entry-card > span {
        transition: none;
    }

    .simple-entry-card:hover {
        transform: none;
    }
}
/*
|--------------------------------------------------------------------------
| Homepage Provider Carousel v1
|--------------------------------------------------------------------------
*/

.home-providers {
    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fffdf8 100%
        );
}

.home-section-head {
    align-items: flex-end;
}

.home-section-head > div:first-child {
    max-width: 790px;
}

.home-section-head h2 {
    max-width: 760px;
}

.home-section-head p {
    max-width: 760px;

    font-size: 15px;
}

.home-provider-controls {
    flex: 0 0 auto;

    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 8px;
}

.home-provider-controls-label {
    margin-right: 4px;

    color: #8a8172;

    font-size: 12px;
    font-weight: 800;

    white-space: nowrap;
}

.home-provider-arrow {
    display: grid;
    place-items: center;

    width: 44px;
    height: 44px;

    padding: 0;

    border:
        1px solid
        rgba(201, 160, 74, .46);

    border-radius: 50%;

    background:
        #ffffff;

    color:
        var(--brand-navy, #14213d);

    font-size: 18px;
    font-weight: 900;
    line-height: 1;

    cursor: pointer;

    box-shadow:
        0 7px 18px
        rgba(50, 42, 27, .065);

    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease,
        color .18s ease,
        box-shadow .18s ease,
        opacity .18s ease;
}

.home-provider-arrow:not(:disabled):hover {
    transform:
        translateY(-2px);

    border-color:
        var(--brand-gold, #c9a04a);

    background:
        var(--brand-navy, #14213d);

    color:
        #f2d98d;

    box-shadow:
        0 10px 24px
        rgba(20, 33, 61, .16);
}

.home-provider-arrow:disabled {
    opacity: .30;

    cursor: default;

    box-shadow: none;
}

.home-provider-carousel {
    position: relative;

    width:
        calc(
            100vw
            -
            max(
                0px,
                (
                    100vw - 1180px
                )
                / 2
            )
        );

    max-width:
        calc(
            1180px
            +
            (
                100vw - 1180px
            )
            / 2
        );

    overflow: hidden;
}

/*
| Track 使用原生橫向捲動。
| 桌機約 3 張完整卡 + 第 4 張局部露出，
| 讓使用者不用看說明也知道右邊還有內容。
*/
.home-provider-track {
    display: flex;

    gap: 18px;

    overflow-x: auto;
    overflow-y: hidden;

    padding:
        6px
        44px
        24px
        2px;

    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;

    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;
}

.home-provider-track::-webkit-scrollbar {
    display: none;
}

.home-provider-track .home-provider-card {
    flex:
        0 0
        calc(
            (
                min(
                    1180px,
                    calc(100vw - 40px)
                )
                - 36px
            )
            / 3.18
        );

    min-width: 0;

    scroll-snap-align: start;
    scroll-snap-stop: normal;

    border-color:
        rgba(201, 160, 74, .28);

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

    box-shadow:
        0 10px 28px
        rgba(50, 42, 27, .06);

    transition:
        transform .24s
        cubic-bezier(.2,.8,.2,1),
        border-color .24s ease,
        box-shadow .24s ease;
}

.home-provider-track
.home-provider-card:hover {
    transform:
        translateY(-5px);

    border-color:
        rgba(201, 160, 74, .66);

    box-shadow:
        0 20px 44px
        rgba(50, 42, 27, .12);
}

.home-provider-track
.home-provider-body {
    display: flex;
    flex-direction: column;

    flex: 1;

    min-height: 220px;
}

.home-provider-track
.home-provider-company {
    color:
        #796d5b;
}

.home-provider-track
.home-provider-body h3 {
    font-size: 21px;
}

.home-provider-track
.home-provider-body p {
    display: -webkit-box;

    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;

    margin-bottom: 18px;
}

.home-provider-action {
    position: relative;
    z-index: 1;

    display: inline-flex;
    align-items: center;

    width: fit-content;

    margin-top: auto;
    padding-top: 18px;

    color:
        var(--brand-gold-deep, #9a7120);

    font-size: 13px;
    font-weight: 900;

    transition:
        transform .20s ease,
        color .20s ease;
}

.home-provider-card:hover
.home-provider-action {
    transform:
        translateX(4px);

    color:
        #74500e;
}

.home-provider-swipe-hint {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    margin-top: 2px;

    color:
        #9a9182;

    font-size: 12px;
    font-weight: 800;

    letter-spacing: .02em;
}

.home-provider-swipe-hint span {
    color:
        var(--brand-gold, #c9a04a);
}

/* Tablet */
@media (max-width: 980px) {

    .home-provider-controls-label {
        display: none;
    }

    .home-provider-carousel {
        width:
            calc(
                100vw
                -
                20px
            );

        max-width: none;
    }

    .home-provider-track
    .home-provider-card {
        flex-basis:
            calc(
                (
                    min(
                        100vw - 28px,
                        1180px
                    )
                    - 18px
                )
                / 2.25
            );
    }
}

/* Mobile */
@media (max-width: 760px) {

    .home-section-head {
        display: grid;

        grid-template-columns:
            minmax(0, 1fr)
            auto;

        align-items: end;

        gap: 16px;
    }

    .home-section-head > div:first-child {
        grid-column:
            1 / -1;
    }

    .home-provider-controls {
        grid-column: 2;

        justify-self: end;
    }

    .home-provider-arrow {
        width: 40px;
        height: 40px;

        font-size: 16px;
    }

    .home-provider-carousel {
        width:
            calc(
                100vw
                - 14px
            );

        margin-right:
            -14px;
    }

    .home-provider-track {
        gap: 14px;

        padding:
            6px
            32px
            18px
            0;
    }

    .home-provider-track
    .home-provider-card {
        flex-basis:
            84%;
    }

    .home-provider-track
    .home-provider-body {
        min-height: 200px;
    }

    .home-provider-swipe-hint {
        justify-content: flex-start;

        margin-top: 5px;
    }
}

/* Reduce Motion */
@media (
    prefers-reduced-motion:
    reduce
) {

    .home-provider-track {
        scroll-behavior: auto;
    }

    .home-provider-arrow,
    .home-provider-track
    .home-provider-card,
    .home-provider-action {
        transition: none;
    }
}
/*
|--------------------------------------------------------------------------
| Homepage DEMO Provider Cards
|--------------------------------------------------------------------------
*/

.home-provider-card.is-demo {
    cursor: default;
}

.home-provider-status.demo {
    border:
        1px solid
        rgba(201, 160, 74, .30);

    background:
        #fff8e7;

    color:
        #8a6418;
}

.home-provider-card.is-demo
.home-provider-placeholder {
    background:
        linear-gradient(
            145deg,
            #f8f1df 0%,
            #fffdf7 58%,
            #efe0b8 100%
        );

    color:
        #6e5420;
}

.home-provider-card.is-demo
.home-provider-action {
    color:
        #9b8f79;
}
/*
|--------------------------------------------------------------------------
| Homepage Reviews v2 — 借款經驗分享
|--------------------------------------------------------------------------
*/

.home-reviews {
    position: relative;

    overflow: hidden;

    padding:
        82px 0
        88px;

    background:
        linear-gradient(
            180deg,
            #f8f4e9 0%,
            #fbfaf6 46%,
            #ffffff 100%
        );
}

.home-reviews::before {
    content: "";

    position: absolute;

    top: -120px;
    right: -110px;

    width: 360px;
    height: 360px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(230, 200, 117, .14) 0%,
            rgba(201, 160, 74, .055) 48%,
            transparent 72%
        );

    pointer-events: none;
}

.home-reviews-head {
    position: relative;
    z-index: 1;

    margin-bottom: 34px;
}

.home-reviews-head > div {
    max-width: 790px;
}

.home-reviews-head h2 {
    max-width: 760px;

    margin-bottom: 14px;

    color:
        var(--brand-navy-deep, #0f172a);

    font-size:
        clamp(
            30px,
            4vw,
            40px
        );

    line-height: 1.28;

    letter-spacing: -.035em;
}

.home-reviews-head p {
    max-width: 730px;

    color: #70695e;

    font-size: 16px;

    line-height: 1.85;
}

.home-review-grid {
    position: relative;
    z-index: 1;

    gap: 18px;
}

.home-review-card {
    position: relative;

    overflow: hidden;

    min-height: 320px;

    padding: 26px;

    border:
        1px solid
        rgba(201, 160, 74, .32);

    border-radius: 22px;

    background:
        linear-gradient(
            160deg,
            rgba(255,255,255,.99) 0%,
            rgba(255,253,248,.97) 100%
        );

    box-shadow:
        0 12px 30px
        rgba(50, 42, 27, .065);

    transition:
        transform .24s
        cubic-bezier(.2,.8,.2,1),
        border-color .24s ease,
        box-shadow .24s ease;
}

/* 上方香檳金細線 */
.home-review-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 26px;
    right: 26px;

    height: 3px;

    border-radius:
        0 0
        999px 999px;

    background:
        linear-gradient(
            90deg,
            rgba(201,160,74,.95),
            rgba(230,200,117,.34)
        );
}

/* 淡淡的引號裝飾 */
.home-review-card::after {
    content: "“";

    position: absolute;

    right: 20px;
    bottom: -32px;

    color:
        rgba(201, 160, 74, .08);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 150px;
    font-weight: 700;
    line-height: 1;

    pointer-events: none;
}

.home-review-card:hover {
    transform:
        translateY(-5px);

    border-color:
        rgba(201, 160, 74, .62);

    box-shadow:
        0 20px 44px
        rgba(50, 42, 27, .105);
}

.home-review-top {
    position: relative;
    z-index: 1;

    margin-bottom: 20px;
}

.home-review-avatar {
    width: 48px;
    height: 48px;

    flex-basis: 48px;

    border:
        1px solid
        rgba(201, 160, 74, .38);

    background:
        linear-gradient(
            145deg,
            #f7e9c8,
            #fff9ea
        );

    color:
        #765413;

    box-shadow:
        0 6px 16px
        rgba(154, 113, 32, .08);
}

.home-review-name {
    color:
        var(--brand-navy-deep, #0f172a);

    font-size: 16px;
}

.home-review-meta {
    margin-top: 4px;

    color: #7b7469;

    font-size: 12px;
    font-weight: 700;
}

.home-review-status {
    position: relative;
    z-index: 1;

    display: inline-flex;
    align-items: center;

    gap: 6px;

    margin-bottom: 19px;

    padding:
        6px 10px;

    border:
        1px solid
        rgba(201, 160, 74, .28);

    border-radius: 999px;

    background:
        #fbf4df;

    color:
        #7b5813;

    font-size: 11px;
    font-weight: 900;
}

.home-review-status::before {
    content: "✓";

    display: grid;
    place-items: center;

    width: 17px;
    height: 17px;

    border-radius: 50%;

    background:
        var(--brand-navy, #14213d);

    color: #f0d98f;

    font-size: 10px;
    line-height: 1;
}

.home-review-text {
    position: relative;
    z-index: 1;

    color: #343b49;

    font-size: 15px;

    line-height: 1.95;
}

.home-review-date {
    position: relative;
    z-index: 1;

    padding-top: 24px;

    color: #a09788;

    font-size: 12px;
    font-weight: 700;
}

.home-review-note {
    position: relative;
    z-index: 1;

    display: inline-flex;

    margin-top: 22px;

    padding:
        10px 14px;

    border:
        1px solid
        rgba(201, 160, 74, .18);

    border-radius: 10px;

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

    color: #8a8173;

    font-size: 12px;

    line-height: 1.7;
}


/* Mobile */
@media (max-width: 760px) {

    .home-reviews {
        padding:
            58px 0
            62px;
    }

    .home-reviews-head {
        margin-bottom: 24px;
    }

    .home-reviews-head h2 {
        font-size: 30px;
    }

    .home-reviews-head p {
        font-size: 15px;
    }

    .home-review-grid {
        gap: 14px;
    }

    .home-review-card {
        min-height: 0;

        padding: 23px 21px;

        border-radius: 18px;
    }

    .home-review-card::before {
        left: 21px;
        right: 21px;
    }

    .home-review-card::after {
        right: 12px;

        font-size: 120px;
    }

    .home-review-note {
        display: block;
    }
}


/* Reduce Motion */
@media (
    prefers-reduced-motion:
    reduce
) {

    .home-review-card {
        transition: none;
    }

    .home-review-card:hover {
        transform: none;
    }
}
/*
|--------------------------------------------------------------------------
| Homepage Provider Stacked Carousel v1
|--------------------------------------------------------------------------
*/

.home-providers {
    overflow: hidden;
}

.home-providers .home-section-head {
    display: block;

    margin-bottom: 34px;
}

.home-providers
.home-section-head > div:first-child {
    max-width: 790px;
}

.home-provider-stack {
    position: relative;

    width: 100%;

    touch-action: pan-y;
}

.home-provider-stack-track {
    position: relative;

    width:
        min(
            760px,
            calc(100% - 130px)
        );

    height: 385px;

    margin:
        48px auto
        0;

    perspective: 1200px;
}


/*
|--------------------------------------------------------------------------
| 疊卡共同設定
|--------------------------------------------------------------------------
*/

.home-provider-stack-card {
    position: absolute;

    top: 0;
    left: 50%;

    z-index: 0;

    display: grid;

    grid-template-columns:
        minmax(0, .88fr)
        minmax(0, 1.12fr);

    width: 100%;
    min-height: 330px;

    overflow: hidden;

    opacity: 0;

    pointer-events: none;

    transform-origin:
        center center;

    will-change:
        transform,
        opacity;

    transition:
        transform .38s
        cubic-bezier(.2,.82,.24,1),
        opacity .30s ease,
        box-shadow .30s ease,
        border-color .30s ease;
}


/*
|--------------------------------------------------------------------------
| 主卡
|--------------------------------------------------------------------------
*/

.home-provider-stack-card.is-active {
    z-index: 4;

    opacity: 1;

    pointer-events: auto;

    transform:
        translateX(-54%)
        translateY(0)
        scale(1);

    box-shadow:
        0 24px 58px
        rgba(33, 30, 25, .15);
}


/*
|--------------------------------------------------------------------------
| 第二層
|--------------------------------------------------------------------------
*/

.home-provider-stack-card.is-next {
    z-index: 3;

    opacity: .92;

    transform:
        translateX(
            calc(
                -54% + 46px
            )
        )
        translateY(-18px)
        scale(.965);

    box-shadow:
        0 17px 38px
        rgba(33, 30, 25, .10);
}


/*
|--------------------------------------------------------------------------
| 第三層
|--------------------------------------------------------------------------
*/

.home-provider-stack-card.is-after {
    z-index: 2;

    opacity: .68;

    transform:
        translateX(
            calc(
                -54% + 86px
            )
        )
        translateY(-34px)
        scale(.925);

    box-shadow:
        0 12px 28px
        rgba(33, 30, 25, .07);
}


/*
|--------------------------------------------------------------------------
| 已看過的卡片：往左滑出
|--------------------------------------------------------------------------
*/

.home-provider-stack-card.is-before {
    z-index: 1;

    opacity: 0;

    transform:
        translateX(
            calc(
                -54% - 150px
            )
        )
        translateY(12px)
        scale(.94);

    pointer-events: none;
}


/*
|--------------------------------------------------------------------------
| 第四張以後不顯示
|--------------------------------------------------------------------------
*/

.home-provider-stack-card.is-hidden {
    z-index: 0;

    opacity: 0;

    transform:
        translateX(
            calc(
                -54% + 110px
            )
        )
        translateY(-44px)
        scale(.90);

    pointer-events: none;
}


/*
|--------------------------------------------------------------------------
| 主卡改成橫式資訊卡
|--------------------------------------------------------------------------
*/

.home-provider-stack-card
.home-provider-image {
    min-height: 330px;

    aspect-ratio: auto;
}

.home-provider-stack-card
.home-provider-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.home-provider-stack-card
.home-provider-placeholder {
    min-height: 330px;

    background:
        linear-gradient(
            145deg,
            #f5ead0 0%,
            #fffdf7 48%,
            #e9d49d 100%
        );

    color:
        #674d1c;

    font-size: 22px;
}

.home-provider-stack-card
.home-provider-body {
    display: flex;
    flex-direction: column;

    min-height: 330px;

    padding: 30px 30px 27px;
}

.home-provider-stack-card
.home-provider-status {
    align-self: flex-start;
}

.home-provider-stack-card
.home-provider-company {
    margin-top: 3px;

    font-size: 13px;
}

.home-provider-stack-card
.home-provider-body h3 {
    margin-top: 2px;

    font-size: 25px;

    line-height: 1.32;
}

.home-provider-stack-card
.home-provider-body p {
    display: -webkit-box;

    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;

    margin-bottom: 22px;

    font-size: 14px;

    line-height: 1.8;
}

.home-provider-stack-card
.home-provider-action {
    margin-top: auto;

    padding-top: 18px;
}


/*
|--------------------------------------------------------------------------
| 後方卡片降低內容存在感，讓主卡更清楚
|--------------------------------------------------------------------------
*/

.home-provider-stack-card.is-next
.home-provider-body,
.home-provider-stack-card.is-after
.home-provider-body {
    filter:
        saturate(.88);
}

.home-provider-stack-card.is-next::after,
.home-provider-stack-card.is-after::after {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 6;

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.07),
            rgba(251,246,234,.18)
        );

    pointer-events: none;
}


/*
|--------------------------------------------------------------------------
| 控制列
|--------------------------------------------------------------------------
*/

.home-provider-stack-controls {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 18px;

    margin-top: 14px;
}

.home-provider-stack-controls
.home-provider-arrow {
    width: 48px;
    height: 48px;

    border-width: 1.5px;
}

.home-provider-stack-counter {
    display: inline-flex;

    align-items: baseline;
    justify-content: center;

    gap: 6px;

    min-width: 82px;

    color: #9b9182;

    font-variant-numeric:
        tabular-nums;
}

.home-provider-stack-counter strong {
    color:
        var(--brand-navy, #14213d);

    font-size: 22px;
    font-weight: 900;
}

.home-provider-stack-counter span {
    font-size: 13px;
    font-weight: 800;
}

.home-provider-stack
.home-provider-swipe-hint {
    justify-content: center;

    margin-top: 12px;
}


/*
|--------------------------------------------------------------------------
| 主卡 Hover
|--------------------------------------------------------------------------
*/

.home-provider-stack-card.is-active:hover {
    transform:
        translateX(-54%)
        translateY(-5px)
        scale(1.006);

    border-color:
        rgba(201, 160, 74, .72);

    box-shadow:
        0 28px 64px
        rgba(33, 30, 25, .17);
}


/*
|--------------------------------------------------------------------------
| Tablet
|--------------------------------------------------------------------------
*/

@media (max-width: 900px) {

    .home-provider-stack-track {
        width:
            min(
                690px,
                calc(100% - 92px)
            );

        height: 375px;
    }

    .home-provider-stack-card.is-active {
        transform:
            translateX(-53%)
            scale(1);
    }

    .home-provider-stack-card.is-next {
        transform:
            translateX(
                calc(
                    -53% + 34px
                )
            )
            translateY(-16px)
            scale(.965);
    }

    .home-provider-stack-card.is-after {
        transform:
            translateX(
                calc(
                    -53% + 62px
                )
            )
            translateY(-29px)
            scale(.93);
    }

    .home-provider-stack-card.is-before {
        transform:
            translateX(
                calc(
                    -53% - 120px
                )
            )
            translateY(10px)
            scale(.94);
    }

    .home-provider-stack-card.is-hidden {
        transform:
            translateX(
                calc(
                    -53% + 80px
                )
            )
            translateY(-38px)
            scale(.90);
    }

    .home-provider-stack-card.is-active:hover {
        transform:
            translateX(-53%)
            translateY(-4px)
            scale(1.004);
    }
}


/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    .home-providers
    .home-section-head {
        margin-bottom: 26px;
    }

    .home-provider-stack-track {
        width:
            calc(
                100% - 34px
            );

        height: 515px;

        margin-top: 42px;
    }

    .home-provider-stack-card {
        display: flex;
        flex-direction: column;

        min-height: 456px;

        border-radius: 20px;
    }

    .home-provider-stack-card.is-active {
        transform:
            translateX(-52%)
            translateY(0)
            scale(1);
    }

    .home-provider-stack-card.is-next {
        transform:
            translateX(
                calc(
                    -52% + 17px
                )
            )
            translateY(-14px)
            scale(.975);
    }

    .home-provider-stack-card.is-after {
        transform:
            translateX(
                calc(
                    -52% + 31px
                )
            )
            translateY(-27px)
            scale(.95);
    }

    .home-provider-stack-card.is-before {
        transform:
            translateX(
                calc(
                    -52% - 92px
                )
            )
            translateY(7px)
            scale(.95);
    }

    .home-provider-stack-card.is-hidden {
        transform:
            translateX(
                calc(
                    -52% + 42px
                )
            )
            translateY(-34px)
            scale(.93);
    }

    .home-provider-stack-card.is-active:hover {
        transform:
            translateX(-52%)
            translateY(0)
            scale(1);
    }

    .home-provider-stack-card
    .home-provider-image {
        min-height: 205px;
        height: 205px;

        aspect-ratio: auto;
    }

    .home-provider-stack-card
    .home-provider-placeholder {
        min-height: 205px;

        font-size: 19px;
    }

    .home-provider-stack-card
    .home-provider-body {
        min-height: 251px;

        padding: 21px;
    }

    .home-provider-stack-card
    .home-provider-body h3 {
        font-size: 21px;
    }

    .home-provider-stack-card
    .home-provider-body p {
        -webkit-line-clamp: 2;

        font-size: 13px;
    }

    .home-provider-stack-controls {
        gap: 15px;

        margin-top: 8px;
    }

    .home-provider-stack-controls
    .home-provider-arrow {
        width: 44px;
        height: 44px;
    }

    .home-provider-stack-counter strong {
        font-size: 20px;
    }

}


/*
|--------------------------------------------------------------------------
| Reduce Motion
|--------------------------------------------------------------------------
*/

@media (
    prefers-reduced-motion:
    reduce
) {

    .home-provider-stack-card {
        transition: none;
    }

    .home-provider-stack-card.is-active:hover {
        transform:
            translateX(-54%);
    }

}
/*
|--------------------------------------------------------------------------
| Homepage Hero v2 — 只保留主標題 + 卡片上移
|--------------------------------------------------------------------------
*/

.simple-hero {
    padding:
        42px 0
        54px;
}

.simple-hero-top {
    align-items: start;

    margin-bottom: 18px;
}

.simple-hero-head {
    max-width: 900px;
}

.hero-title-link {
    display: inline-block;

    color: inherit;

    text-decoration: none;

    cursor: pointer;
}

.hero-title-link .hero-title {
    margin: 0;
}

.hero-title-link:hover
.hero-title-line:first-child {
    color:
        var(--brand-navy, #14213d);
}

.hero-title-link:hover
.hero-title-accent {
    color:
        #7c5814;
}

.hero-title-link:focus-visible {
    outline:
        3px solid
        rgba(201, 160, 74, .36);

    outline-offset: 8px;

    border-radius: 8px;
}

.hero-title-line:first-child {
    transition:
        color .20s ease;
}

.hero-title-accent {
    transition:
        color .20s ease;
}

/*
| 點標題跳到業者區時，避免區塊頂端貼太近瀏覽器上方。
*/
.home-providers {
    scroll-margin-top: 88px;
}


/*
|--------------------------------------------------------------------------
| Mobile — 讓兩張主入口更靠近標題
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    .simple-hero {
        padding:
            22px 0
            32px;
    }

    .simple-hero-top {
        gap: 10px;

        margin-bottom: 10px;
    }

    .simple-hero-head {
        max-width: none;
    }

    .simple-hero-head h1 {
        font-size: 34px;

        line-height: 1.16;
    }

    .hero-title-accent::after {
        bottom: -3px;
    }

    .simple-entry-grid {
        margin-top: 0;
    }

}


/*
|--------------------------------------------------------------------------
| Smaller phones
|--------------------------------------------------------------------------
*/

@media (max-width: 420px) {

    .simple-hero {
        padding-top: 18px;
    }

    .simple-hero-head h1 {
        font-size: 31px;
    }

}
/*
|--------------------------------------------------------------------------
| Homepage Header / Logo Polish v1
|--------------------------------------------------------------------------
*/

.site-header {
    border-bottom:
        1px solid
        rgba(201, 160, 74, .20);

    background:
        rgba(255, 254, 251, .96);

    box-shadow:
        0 6px 22px
        rgba(20, 33, 61, .035);
}

.home-header-inner {
    min-height: 72px;
}

.home-header-inner .brand {
    gap: 12px;
}

.home-header-inner .brand-mark {
    width: 39px;
    height: 39px;

    border-radius: 11px;

    border:
        1px solid
        rgba(230, 200, 117, .72);

    background:
        linear-gradient(
            145deg,
            #1d2e52 0%,
            #14213d 55%,
            #0e172a 100%
        );

    color: #ffffff;

    font-size: 15px;
    font-weight: 900;

    box-shadow:
        inset 0 0 0 1px
        rgba(255,255,255,.025),
        0 8px 20px
        rgba(15,23,42,.14);

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.home-header-inner .brand-mark::after {
    top: 3px;
    right: 4px;

    color: #efd98f;

    font-size: 9px;
}

.home-header-inner .brand:hover
.brand-mark {
    transform:
        translateY(-1px);

    box-shadow:
        inset 0 0 0 1px
        rgba(255,255,255,.035),
        0 11px 24px
        rgba(15,23,42,.18);
}

.home-header-inner .brand-name {
    color:
        var(--brand-navy-deep, #0f172a);

    font-size: 20px;
    font-weight: 900;

    letter-spacing: -.025em;
}

.loan-ticker-mask {
    border-color:
        rgba(201, 160, 74, .18);

    background:
        linear-gradient(
            90deg,
            #fbf8ef 0%,
            #fffefb 55%,
            #fbf8ef 100%
        );
}

.home-header-inner
.partner-link {
    min-height: 42px;

    padding:
        0 17px;

    border:
        1px solid
        rgba(230, 200, 117, .70);

    background:
        linear-gradient(
            145deg,
            #1c2c4e 0%,
            #14213d 100%
        );

    color:
        #f1d98d !important;

    box-shadow:
        0 8px 18px
        rgba(20,33,61,.12);
}

.home-header-inner
.partner-link:hover {
    transform:
        translateY(-2px);

    border-color:
        #e5c66d;

    background:
        #0f192f;

    color:
        #f6e4aa !important;

    box-shadow:
        0 12px 25px
        rgba(20,33,61,.18);
}


/*
|--------------------------------------------------------------------------
| Homepage SEO / visible heading alignment
|--------------------------------------------------------------------------
*/

.hero-title-link
.hero-title {
    max-width: 900px;
}


/*
|--------------------------------------------------------------------------
| Mobile Header
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    .home-header-inner {
        min-height: 62px;
    }

    .home-header-inner
    .brand-mark {
        width: 36px;
        height: 36px;

        border-radius: 10px;
    }

    .home-header-inner
    .partner-link {
        min-height: 38px;

        padding:
            0 12px;

        font-size: 12px;
    }

}


/*
|--------------------------------------------------------------------------
| Reduce Motion
|--------------------------------------------------------------------------
*/

@media (
    prefers-reduced-motion:
    reduce
) {

    .home-header-inner
    .brand-mark,
    .home-header-inner
    .partner-link {
        transition: none;
    }

}
/*
|--------------------------------------------------------------------------
| 台灣借貸導航網 Brand Name v1
|--------------------------------------------------------------------------
*/

.home-header-inner .brand-name {
    font-size: 19px;
    letter-spacing: -.03em;
}

@media (max-width: 860px) and (min-width: 761px) {

    .home-header-inner {
        gap: 16px;
    }

    .home-header-inner .brand-name {
        font-size: 17px;
    }

}
/*
|--------------------------------------------------------------------------
| Homepage Hero Brand Title v3
| 與「我要借款 / 公司要週轉」兩張主卡統一視覺
|--------------------------------------------------------------------------
*/

.simple-hero-head {
    max-width: 920px;
}

.hero-title-link {
    position: relative;

    display: inline-block;

    transform: translateY(0);

    transition:
        transform .22s
        cubic-bezier(.2,.8,.2,1);
}

.hero-title-link:hover {
    transform:
        translateY(-2px);
}

.hero-title-link .hero-title {
    display: flex;
    flex-direction: column;

    align-items: flex-start;

    gap: 10px;

    margin: 0;

    font-family:
        "Noto Sans TC",
        "PingFang TC",
        "Microsoft JhengHei",
        sans-serif;
}


/*
|--------------------------------------------------------------------------
| 第一行：主品牌訊息
|--------------------------------------------------------------------------
*/

.hero-title-main {
    color:
        var(--brand-navy-deep, #0f172a);

    font-size:
        clamp(
            43px,
            5.2vw,
            66px
        );

    font-weight: 900;

    line-height: 1.08;

    letter-spacing: -.055em;

    text-wrap: balance;

    text-shadow:
        0 1px 0
        rgba(255,255,255,.62);

    transition:
        color .20s ease;
}


/*
|--------------------------------------------------------------------------
| 第二行：四大借款方向
|--------------------------------------------------------------------------
*/

.hero-title-categories {
    position: relative;

    width: fit-content;

    padding-bottom: 12px;

    color:
        var(--brand-gold-deep, #9a7120);

    font-size:
        clamp(
            17px,
            2vw,
            22px
        );

    font-weight: 850;

    line-height: 1.4;

    letter-spacing: .075em;

    white-space: nowrap;

    transition:
        color .20s ease;
}


/*
|--------------------------------------------------------------------------
| 香檳金短底線
|--------------------------------------------------------------------------
*/

.hero-title-categories::after {
    left: 1px;
    right: auto;
    bottom: 0;

    width: 82px;
    height: 4px;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            #c9a04a 0%,
            #e5c66d 60%,
            rgba(229,198,109,.16) 100%
        );

    box-shadow:
        0 3px 10px
        rgba(201,160,74,.13);
}


/*
|--------------------------------------------------------------------------
| Hover：保持金融平台感，不做浮誇動畫
|--------------------------------------------------------------------------
*/

.hero-title-link:hover
.hero-title-main {
    color:
        #14213d;
}

.hero-title-link:hover
.hero-title-categories {
    color:
        #795611;
}

.hero-title-link:hover
.hero-title-categories::after {
    width: 108px;
}


/*
|--------------------------------------------------------------------------
| 讓標題與兩張入口卡更靠近
|--------------------------------------------------------------------------
*/

.simple-hero-top {
    margin-bottom: 12px;
}

.simple-entry-grid {
    margin-top: 0;
}


/*
|--------------------------------------------------------------------------
| Tablet
|--------------------------------------------------------------------------
*/

@media (max-width: 980px) {

    .hero-title-main {
        font-size:
            clamp(
                40px,
                6vw,
                56px
            );
    }

    .hero-title-categories {
        font-size: 18px;
    }

}


/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    .simple-hero {
        padding:
            18px 0
            28px;
    }

    .simple-hero-top {
        gap: 7px;

        margin-bottom: 7px;
    }

    .hero-title-link .hero-title {
        gap: 7px;
    }

    .hero-title-main {
        font-size: 32px;

        line-height: 1.10;

        letter-spacing: -.045em;
    }

    .hero-title-categories {
        padding-bottom: 9px;

        font-size: 14px;

        font-weight: 850;

        letter-spacing: .055em;
    }

    .hero-title-categories::after {
        width: 60px;
        height: 3px;
    }

    .hero-title-link:hover {
        transform: none;
    }

    /*
    | 再把兩張卡往上收一點
    */
    .simple-entry-grid {
        gap: 13px;

        margin-top: -2px;
    }

}


/*
|--------------------------------------------------------------------------
| Small phones
|--------------------------------------------------------------------------
*/

@media (max-width: 390px) {

    .hero-title-main {
        font-size: 29px;
    }

    .hero-title-categories {
        font-size: 13px;

        letter-spacing: .035em;
    }

}


/*
|--------------------------------------------------------------------------
| Reduce Motion
|--------------------------------------------------------------------------
*/

@media (
    prefers-reduced-motion:
    reduce
) {

    .hero-title-link {
        transition: none;
    }

    .hero-title-link:hover {
        transform: none;
    }

}

/*
|--------------------------------------------------------------------------
| Homepage Featured Image-First v3
|--------------------------------------------------------------------------
|
| 目的：
| - 首頁精選「圖片多、文字少」
| - 上傳 1200×900（4:3）時完整顯示，不再被 cover 裁切
|--------------------------------------------------------------------------
*/

.home-provider-stack-track {
    width:
        min(
            800px,
            calc(100% - 110px)
        );

    height: 420px;
}

.home-provider-stack-card {
    grid-template-columns:
        minmax(0, 64%)
        minmax(240px, 36%);

    min-height: 365px;
}


/*
|--------------------------------------------------------------------------
| 圖片：4:3 完整顯示
|--------------------------------------------------------------------------
*/

.home-provider-stack-card
.home-provider-image {
    width: 100%;
    min-height: 0;
    height: auto;

    aspect-ratio:
        4 / 3;

    background:
        #f4f0e7;
}

.home-provider-stack-card
.home-provider-image img {
    width: 100%;
    height: 100%;

    object-fit: contain;
    object-position: center;

    transform: none !important;
}


/*
|--------------------------------------------------------------------------
| 文字：縮小資訊量
|--------------------------------------------------------------------------
*/

.home-provider-stack-card
.home-provider-body {
    min-height: 0;

    padding:
        24px
        23px
        22px;
}

.home-provider-stack-card
.home-provider-status {
    margin-bottom: 12px;

    padding:
        5px 8px;

    font-size: 10px;
}

.home-provider-stack-card
.home-provider-company {
    margin-top: 0;
    margin-bottom: 8px;

    font-size: 12px;
}

.home-provider-stack-card
.home-provider-body h3 {
    margin:
        0 0
        10px;

    font-size: 20px;

    line-height: 1.38;
}


/*
| 首頁精選不再顯示簡介；
| 後台仍可保留資料，不影響其他用途。
*/
.home-provider-stack-card
.home-provider-body p {
    display: none;
}

.home-provider-stack-card
.home-provider-action {
    margin-top: auto;

    padding-top: 14px;

    font-size: 13px;
}


/*
|--------------------------------------------------------------------------
| 後方疊卡
|--------------------------------------------------------------------------
*/

.home-provider-stack-card.is-next::after,
.home-provider-stack-card.is-after::after {
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.025),
            rgba(251,246,234,.12)
        );
}


/*
|--------------------------------------------------------------------------
| Tablet
|--------------------------------------------------------------------------
*/

@media (max-width: 900px) {

    .home-provider-stack-track {
        width:
            min(
                740px,
                calc(100% - 76px)
            );

        height: 405px;
    }

    .home-provider-stack-card {
        grid-template-columns:
            minmax(0, 62%)
            minmax(220px, 38%);

        min-height: 350px;
    }

    .home-provider-stack-card
    .home-provider-body {
        padding:
            21px
            19px;
    }

}


/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    .home-provider-stack-track {
        width:
            calc(
                100% - 30px
            );

        height: 535px;

        margin-top: 38px;
    }

    .home-provider-stack-card {
        display: flex;
        flex-direction: column;

        min-height: 0;
    }

    .home-provider-stack-card
    .home-provider-image {
        width: 100%;
        min-height: 0;
        height: auto;

        aspect-ratio:
            4 / 3;

        flex:
            0 0 auto;
    }

    .home-provider-stack-card
    .home-provider-body {
        min-height: 145px;

        padding:
            17px
            18px
            16px;
    }

    .home-provider-stack-card
    .home-provider-status {
        margin-bottom: 8px;
    }

    .home-provider-stack-card
    .home-provider-company {
        margin-bottom: 5px;
    }

    .home-provider-stack-card
    .home-provider-body h3 {
        margin-bottom: 5px;

        font-size: 18px;
    }

    .home-provider-stack-card
    .home-provider-action {
        padding-top: 8px;
    }

}


/*
|--------------------------------------------------------------------------
| Small phones
|--------------------------------------------------------------------------
*/

@media (max-width: 390px) {

    .home-provider-stack-track {
        height: 505px;
    }

    .home-provider-stack-card
    .home-provider-body {
        min-height: 135px;

        padding:
            15px
            16px;
    }

    .home-provider-stack-card
    .home-provider-body h3 {
        font-size: 17px;
    }

}

/*
|--------------------------------------------------------------------------
| Homepage Entry Image Cards v4
|--------------------------------------------------------------------------
| 兩張入口改成完整圖片卡。
| 圖片本身已含人物、標題、說明與按鈕視覺，因此 HTML 不再重複顯示文字。
|--------------------------------------------------------------------------
*/

.simple-entry-grid {
    gap: 22px;
}

.simple-entry-card.entry-image-card {
    position: relative;

    display: block;

    width: 100%;
    min-height: 0;

    padding: 0;

    aspect-ratio: 1002 / 785;

    overflow: hidden;

    border: 1px solid rgba(201, 160, 74, .60);
    border-radius: 26px;

    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;

    box-shadow:
        0 16px 38px rgba(34, 33, 31, .12);

    transform: translateY(0) scale(1);

    transition:
        transform .26s cubic-bezier(.2,.8,.2,1),
        box-shadow .26s ease,
        border-color .26s ease;
}

.simple-entry-card.entry-image-card.personal {
    background-image:
        url('/assets/images/home-entry-personal.webp?v=20260818-1');
}

.simple-entry-card.entry-image-card.business {
    background-image:
        url('/assets/images/home-entry-business.webp?v=20260818-1');
}

/*
| 移除舊版卡片的文字、編號、右上標籤、裝飾圓。
*/
.simple-entry-card.entry-image-card::before,
.simple-entry-card.entry-image-card::after {
    content: none !important;
    display: none !important;
}

.simple-entry-card.entry-image-card
.simple-entry-number,
.simple-entry-card.entry-image-card h2,
.simple-entry-card.entry-image-card p,
.simple-entry-card.entry-image-card > span {
    display: none !important;
}

/*
| Hover：整張卡就是可點擊入口。
*/
.simple-entry-card.entry-image-card:hover {
    transform:
        translateY(-7px)
        scale(1.008);

    border-color:
        rgba(229, 198, 109, .94);

    box-shadow:
        0 24px 52px
        rgba(24, 29, 42, .19);
}

.simple-entry-card.entry-image-card:focus-visible {
    outline:
        3px solid
        rgba(201, 160, 74, .46);

    outline-offset: 4px;
}

/*
|--------------------------------------------------------------------------
| Tablet
|--------------------------------------------------------------------------
*/

@media (max-width: 900px) {

    .simple-entry-grid {
        gap: 16px;
    }

    .simple-entry-card.entry-image-card {
        border-radius: 22px;
    }

}

/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    .simple-entry-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .simple-entry-card.entry-image-card {
        width: 100%;

        min-height: 0;

        aspect-ratio: 1002 / 785;

        border-radius: 20px;

        background-size: cover;
        background-position: center;
    }

    .simple-entry-card.entry-image-card:hover {
        transform: none;
    }

}

/*
|--------------------------------------------------------------------------
| Reduce motion
|--------------------------------------------------------------------------
*/

@media (prefers-reduced-motion: reduce) {

    .simple-entry-card.entry-image-card {
        transition: none;
    }

    .simple-entry-card.entry-image-card:hover {
        transform: none;
    }

}

/*
|--------------------------------------------------------------------------
| Mobile Provider Stack Controls v5
|--------------------------------------------------------------------------
| 手機版縮短精選業者卡片與左右箭頭之間的空白。
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    /*
    | 卡片目前約為：
    | 圖片 4:3 + 約 145px 文字區。
    | 原本 track 高度 515~535px 過高，因此箭頭被推得太下面。
    */
    .home-provider-stack-track {
        height:
            clamp(
                390px,
                calc(75vw + 132px),
                455px
            );

        margin-top: 30px;
    }

    .home-provider-stack-controls {
        margin-top: 2px;

        gap: 12px;
    }

    .home-provider-stack
    .home-provider-swipe-hint {
        margin-top: 7px;
    }

}


/*
|--------------------------------------------------------------------------
| Very small phones
|--------------------------------------------------------------------------
*/

@media (max-width: 390px) {

    .home-provider-stack-track {
        height:
            clamp(
                370px,
                calc(75vw + 128px),
                420px
            );

        margin-top: 26px;
    }

}


/*
|--------------------------------------------------------------------------
| R21 貸你通品牌 / 會員入口
|--------------------------------------------------------------------------
*/
.home-header-inner .brand-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    line-height: 1.05;
    white-space: nowrap;
}
.home-header-inner .brand-copy .brand-name {
    display: block !important;
    color: #0f172a;
    font-size: 19px;
    font-weight: 950;
    letter-spacing: -.035em;
}
.home-header-inner .brand-tagline {
    display: block;
    color: #68748a;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: .02em;
}
.home-header-inner .member-entry-link {
    gap: 5px;
}
@media (max-width: 860px) and (min-width: 761px) {
    .home-header-inner .brand-copy .brand-name { font-size: 17px; }
    .home-header-inner .brand-tagline { font-size: 9px; }
}
@media (max-width: 760px) {
    .home-header-inner .brand-copy .brand-name {
        display: block !important;
        font-size: 15px;
    }
    .home-header-inner .brand-tagline { display: none; }
    .home-header-inner .member-entry-link {
        padding-left: 10px;
        padding-right: 10px;
        font-size: 11px;
    }
}

/* R78 clickable ticker: keep plain-text appearance */
.loan-ticker-link{text-decoration:none;transition:opacity .16s ease,color .16s ease}
.loan-ticker-link:hover{opacity:.72;text-decoration:underline;text-underline-offset:3px}

@media(max-width:640px){
    .loan-ticker-mask{padding:8px 0;border-radius:0;background:transparent;border:0}
    .loan-ticker-label{min-height:30px;padding:0 12px;font-size:13px}
    .loan-ticker-item{min-height:30px;padding:0 12px;font-size:13px}
    .loan-ticker-dot{padding:0 7px}
}