/**
 * QI Footer V3
 * READY365-inspired layout.
 */


/* =========================================================
   OLD FOOTERS OFF
   ========================================================= */

.footer-1,
.footer-2,
.absolute-footer,
#qi-footer,
#qi-footer-v2 {

    display:
        none !important;
}


/* =========================================================
   ROOT
   ========================================================= */

#qi-footer-v3 {

    --qi-footer-bg:
        #102f50;

    --qi-footer-bg-deep:
        #0d2947;

    --qi-footer-card:
        rgba(255,255,255,.035);

    --qi-footer-border:
        rgba(129,179,211,.18);

    --qi-footer-text:
        #b8cce0;

    --qi-footer-muted:
        #829bb2;

    --qi-footer-white:
        #ffffff;

    --qi-footer-teal:
        #28bbb7;

    width:
        100%;

    margin:
        56px 0 0;

    background:
        var(--qi-footer-bg);

    color:
        var(--qi-footer-text);

    font-family:
        "Noto Sans TC",
        sans-serif;

    box-sizing:
        border-box;
}


#qi-footer-v3 *,
#qi-footer-v3 *::before,
#qi-footer-v3 *::after {

    box-sizing:
        border-box;
}


#qi-footer-v3
.qif3-shell {

    width:
        calc(100% - 48px);

    max-width:
        1170px;

    margin:
        0 auto;
}


/* =========================================================
   MAIN
   ========================================================= */

#qi-footer-v3
.qif3-main {

    padding:
        58px 0 25px;
}


#qi-footer-v3
.qif3-grid {

    display:
        grid;

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

    gap:
        56px;

    align-items:
        start;
}


/* =========================================================
   BRAND
   ========================================================= */

#qi-footer-v3
.qif3-brand {

    min-width:
        0;
}


#qi-footer-v3
.qif3-logo {

    display:
        inline-flex;

    align-items:
        center;

    min-height:
        54px;

    margin:
        0 0 9px;

    text-decoration:
        none !important;
}


#qi-footer-v3
.qif3-logo-img {

    display:
        block;

    width:
        auto;

    max-width:
        195px;

    max-height:
        57px;

    margin:
        0;

    /*
     * Header logo becomes clean white footer logo.
     */
    filter:
        brightness(0)
        invert(1);

    opacity:
        .97;
}


#qi-footer-v3
.qif3-logo-text {

    color:
        #fff;

    font-size:
        27px;

    font-weight:
        800;
}


#qi-footer-v3
.qif3-slogan {

    margin:
        2px 0 15px;

    color:
        var(--qi-footer-teal);

    font-size:
        12px;

    font-weight:
        700;

    line-height:
        1.45;
}


#qi-footer-v3
.qif3-description {

    max-width:
        380px;

    margin:
        0 0 18px !important;

    color:
        var(--qi-footer-text);

    font-size:
        12px;

    font-weight:
        400;

    line-height:
        1.9;
}


/* =========================================================
   SMALL BADGES
   ========================================================= */

#qi-footer-v3
.qif3-badges {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        8px;
}


#qi-footer-v3
.qif3-badges
span {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        6px;

    min-height:
        30px;

    padding:
        5px 10px;

    border:
        1px solid
        rgba(87,165,218,.25);

    border-radius:
        999px;

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

    color:
        #d4e4ef;

    font-size:
        9px;

    font-weight:
        600;
}


#qi-footer-v3
.qif3-badges
svg {

    width:
        13px;

    height:
        13px;

    fill:
        none;

    stroke:
        #50b9ee;

    stroke-width:
        1.9;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


/* =========================================================
   STANDARD COLUMNS
   ========================================================= */

#qi-footer-v3
.qif3-column
h3,

#qi-footer-v3
.qif3-service
h3 {

    position:
        relative;

    margin:
        3px 0
        20px !important;

    padding:
        0 0
        12px;

    color:
        #ffffff !important;

    font-size:
        13px !important;

    font-weight:
        800 !important;

    line-height:
        1.3;
}


#qi-footer-v3
.qif3-column
h3::after,

#qi-footer-v3
.qif3-service
h3::after {

    content:
        "";

    position:
        absolute;

    left:
        0;

    bottom:
        0;

    width:
        28px;

    height:
        2px;

    border-radius:
        50px;

    background:
        var(--qi-footer-teal);
}


#qi-footer-v3
.qif3-column {

    display:
        flex;

    flex-direction:
        column;

    align-items:
        flex-start;
}


#qi-footer-v3
.qif3-column
a {

    margin:
        0 0 12px;

    color:
        var(--qi-footer-text)
        !important;

    font-size:
        10px;

    font-weight:
        400;

    line-height:
        1.45;

    text-decoration:
        none !important;

    transition:
        color .18s ease;
}


#qi-footer-v3
.qif3-column
a:hover {

    color:
        #ffffff !important;
}


/* =========================================================
   CUSTOMER SERVICE
   ========================================================= */

#qi-footer-v3
.qif3-service-grid {

    display:
        grid;

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

    gap:
        9px;
}


#qi-footer-v3
.qif3-service-card {

    display:
        flex !important;

    align-items:
        center;

    gap:
        8px;

    min-height:
        42px;

    margin:
        0 !important;

    padding:
        8px 10px;

    border:
        1px solid
        rgba(79,155,213,.18);

    border-radius:
        8px;

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

    color:
        #bad5eb !important;

    font-size:
        9px;

    font-weight:
        600;

    line-height:
        1.25;

    text-decoration:
        none !important;

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


#qi-footer-v3
.qif3-service-card:hover {

    border-color:
        rgba(40,187,183,.45);

    background:
        rgba(40,187,183,.08);

    transform:
        translateY(-1px);
}


#qi-footer-v3
.qif3-service-card
svg {

    flex:
        0 0 15px;

    width:
        15px;

    height:
        15px;

    fill:
        none;

    stroke:
        #45aef0;

    stroke-width:
        1.8;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


/* =========================================================
   BOTTOM
   ========================================================= */

#qi-footer-v3
.qif3-bottom {

    border-top:
        1px solid
        rgba(125,170,207,.15);

    background:
        var(--qi-footer-bg-deep);
}


#qi-footer-v3
.qif3-bottom-inner {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    min-height:
        56px;

    color:
        #718da7;

    font-size:
        9px;
}


#qi-footer-v3
.qif3-copyright
span {

    margin-left:
        3px;
}


#qi-footer-v3
.qif3-legal {

    display:
        flex;

    gap:
        20px;
}


#qi-footer-v3
.qif3-legal
a {

    color:
        #839db5 !important;

    text-decoration:
        none !important;
}


#qi-footer-v3
.qif3-legal
a:hover {

    color:
        #ffffff !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 849px) {

    #qi-footer-v3
    .qif3-grid {

        grid-template-columns:
            1.25fr 1fr;

        gap:
            36px 42px;
    }


    #qi-footer-v3
    .qif3-brand {

        grid-column:
            1 / -1;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 549px) {

    #qi-footer-v3 {

        margin-top:
            34px;
    }


    #qi-footer-v3
    .qif3-shell {

        width:
            calc(100% - 34px);
    }


    #qi-footer-v3
    .qif3-main {

        padding:
            34px 0 20px;
    }


    #qi-footer-v3
    .qif3-grid {

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

        gap:
            29px 25px;
    }


    #qi-footer-v3
    .qif3-brand,

    #qi-footer-v3
    .qif3-service {

        grid-column:
            1 / -1;
    }


    /* Logo */

    #qi-footer-v3
    .qif3-logo {

        min-height:
            47px;

        margin-bottom:
            7px;
    }


    #qi-footer-v3
    .qif3-logo-img {

        max-width:
            175px;

        max-height:
            49px;
    }


    #qi-footer-v3
    .qif3-slogan {

        margin-bottom:
            11px;

        font-size:
            11px;
    }


    #qi-footer-v3
    .qif3-description {

        max-width:
            none;

        margin-bottom:
            14px !important;

        font-size:
            10px;

        line-height:
            1.75;
    }


    /* Headings */

    #qi-footer-v3
    .qif3-column
    h3,

    #qi-footer-v3
    .qif3-service
    h3 {

        margin-bottom:
            15px !important;

        font-size:
            12px !important;
    }


    #qi-footer-v3
    .qif3-column
    a {

        margin-bottom:
            9px;

        font-size:
            10px;
    }


    /* Customer service */

    #qi-footer-v3
    .qif3-service-grid {

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

        gap:
            9px;
    }


    #qi-footer-v3
    .qif3-service-card {

        min-height:
            47px;

        padding:
            9px 11px;

        font-size:
            10px;
    }


    /* Notice */

    


    


    


    


    /* Bottom */

    #qi-footer-v3
    .qif3-bottom-inner {

        display:
            block;

        min-height:
            0;

        padding:
            15px 0;

        text-align:
            center;

        font-size:
            8px;

        line-height:
            1.7;
    }


    #qi-footer-v3
    .qif3-legal {

        justify-content:
            center;

        gap:
            17px;

        margin-top:
            5px;
    }


    /*
     * Keep clear of Flatsome sticky product bar.
     */

    body.single-product
    #qi-footer-v3
    .qif3-bottom {

        padding-bottom:
            65px;
    }

}

/* === QI FOOTER BACKGROUND FIX START === */

/*
 * Remove exposed background strip above QI Footer.
 */
#qi-footer-v3 {
    margin-top: 0 !important;
}


/*
 * Flatsome previously set:
 * html { background-color: #163a4a; }
 *
 * On short pages this color becomes visible below the custom footer.
 * Match it to the new Footer bottom area instead.
 */
html {
    background-color: #0d2947 !important;
}


/*
 * Keep the actual page/content canvas white.
 */
body {
    background-color: #ffffff;
}

/* === QI FOOTER BACKGROUND FIX END === */

/* === QI FOOTER FINAL POLISH START === */


/* =========================================================
   DESKTOP — BRAND
   ========================================================= */

@media (min-width: 850px) {

    #qi-footer-v3
    .qif3-logo-img {

        max-width:
            215px !important;

        max-height:
            62px !important;
    }


    #qi-footer-v3
    .qif3-slogan {

        font-size:
            13px !important;
    }


    #qi-footer-v3
    .qif3-description {

        max-width:
            400px;

        font-size:
            12.5px !important;

        line-height:
            1.85 !important;
    }


    /* Column headings */

    #qi-footer-v3
    .qif3-column
    h3,

    #qi-footer-v3
    .qif3-service
    h3 {

        font-size:
            14px !important;
    }


    /* Normal links */

    #qi-footer-v3
    .qif3-column
    a {

        margin-bottom:
            12px !important;

        font-size:
            11px !important;

        line-height:
            1.5 !important;
    }


    /* Customer service cards */

    #qi-footer-v3
    .qif3-service-card {

        min-height:
            46px !important;

        padding:
            9px 12px !important;

        font-size:
            10.5px !important;
    }


    #qi-footer-v3
    .qif3-service-card
    svg {

        flex-basis:
            16px;

        width:
            16px;

        height:
            16px;
    }


    /* Trust badges */

    #qi-footer-v3
    .qif3-badges
    span {

        min-height:
            32px;

        padding:
            6px 11px;

        font-size:
            10px;
    }


    #qi-footer-v3
    .qif3-badges
    svg {

        width:
            14px;

        height:
            14px;
    }


    /* Bottom copyright */

    #qi-footer-v3
    .qif3-bottom-inner {

        font-size:
            10px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 549px) {

    /*
     * Keep the existing compact layout.
     */

    #qi-footer-v3
    .qif3-description {

        font-size:
            10.5px !important;
    }


    #qi-footer-v3
    .qif3-column
    a {

        font-size:
            10.5px !important;
    }


    #qi-footer-v3
    .qif3-service-card {

        font-size:
            10.5px !important;
    }


    #qi-footer-v3
    .qif3-badges
    span {

        font-size:
            9px !important;
    }


    #qi-footer-v3
    .qif3-bottom-inner {

        font-size:
            9px !important;

        line-height:
            1.75 !important;
    }

}


/* === QI FOOTER FINAL POLISH END === */

/* === QI FOOTER BADGES ONE ROW START === */

/* 桌面端：四个标签一排 */
@media (min-width: 850px) {

    #qi-footer-v3 .qif3-badges {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 10px !important;
        align-items: stretch !important;
        width: 100% !important;
        max-width: 520px !important;
        margin-top: 18px !important;
    }

    #qi-footer-v3 .qif3-badges span {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap !important;
        padding: 8px 10px !important;
        font-size: 11px !important;
        line-height: 1 !important;
        border-radius: 999px !important;
    }

    #qi-footer-v3 .qif3-badges svg {
        width: 14px !important;
        height: 14px !important;
        margin-right: 6px !important;
        flex: 0 0 14px !important;
    }
}

/* 平板：两列 */
@media (min-width: 550px) and (max-width: 849px) {

    #qi-footer-v3 .qif3-badges {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 420px !important;
        margin-top: 18px !important;
    }

    #qi-footer-v3 .qif3-badges span {
        width: 100% !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap !important;
    }
}

/* 手机：两列，避免太挤 */
@media (max-width: 549px) {

    #qi-footer-v3 .qif3-badges {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
        margin-top: 16px !important;
    }

    #qi-footer-v3 .qif3-badges span {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap !important;
        padding: 8px 8px !important;
        font-size: 10px !important;
    }

    #qi-footer-v3 .qif3-badges svg {
        width: 13px !important;
        height: 13px !important;
        margin-right: 5px !important;
    }
}

/* === QI FOOTER BADGES ONE ROW END === */

/* === QI FOOTER BADGE GAP FIX START === */

#qi-footer-v3
.qif3-badges
span {
    gap: 4px !important;
}

#qi-footer-v3
.qif3-badges
svg {
    margin-right: 0 !important;
}

/* === QI FOOTER BADGE GAP FIX END === */

/* === QI FOOTER TOP EDGE FIX START === */

#qi-footer-v3,
#qi-footer {
    margin-top: 0 !important;
    border-top: 0 !important;
    box-shadow: none !important;
}

/* Footer 第一層容器不要自己再製造白邊 */
#qi-footer-v3 .qif3-top,
#qi-footer-v3 .qif3-main,
#qi-footer-v3 .qif3-bottom,
#qi-footer .qif3-top,
#qi-footer .qif3-main,
#qi-footer .qif3-bottom {
    border-top: 0 !important;
}

/* === QI FOOTER TOP EDGE FIX END === */
