
.shibi-vcp,
.shibi-vcp *{
    box-sizing:border-box;
    font-family:'Poppins',sans-serif;
}

.shibi-vcp{
    --yellow:#f5d238;
    --gold:#b79b15;
    --text:#252525;
    --muted:#707070;
    --border:#eae4d8;
    --soft:#fbf8ef;
    width:100%;
    color:var(--text);
}

.shibi-vcp a{
    text-decoration:none!important;
}

/* HERO */
.shibi-vcp-hero{
    position:relative;
    min-height:330px;
    display:grid;
    grid-template-columns:minmax(0,1fr) 360px;
    align-items:center;
    gap:40px;
    padding:58px 4%;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:26px;
    background:
        radial-gradient(circle at 91% 35%,rgba(245,210,56,.20),transparent 30%),
        linear-gradient(135deg,#fff 0%,#fffdf8 58%,#fff8dc 100%);
}

.shibi-vcp-kicker,
.shibi-vcp-section-head > div > span,
.shibi-vcp-results-head > div > span,
.shibi-vcp-help > div > span{
    display:block;
    margin-bottom:10px;
    color:#9f8617;
    font-size:12px;
    line-height:1.2;
    font-weight:600;
    letter-spacing:.3px;
}

.shibi-vcp-hero h1{
    max-width:820px;
    margin:0 0 16px;
    color:#222;
    font-size:46px;
    line-height:1.15;
    font-weight:600;
    letter-spacing:-1.5px;
}

.shibi-vcp-hero-copy > p{
    max-width:700px;
    margin:0 0 24px;
    color:#6f6f6f;
    font-size:15px;
    line-height:1.8;
}

.shibi-vcp-points{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px 18px;
}

.shibi-vcp-points span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#555;
    font-size:12px;
    line-height:1.3;
    font-weight:500;
}

.shibi-vcp-points i{
    width:23px;
    height:23px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(245,210,56,.18);
    color:#ad9419;
    font-style:normal;
    font-size:11px;
    font-weight:600;
}

/* HERO ART */
.shibi-vcp-hero-mark{
    position:relative;
    width:300px;
    height:230px;
    justify-self:end;
}

.shibi-vcp-ring{
    position:absolute;
    border-radius:50%;
    border:1px solid rgba(245,210,56,.34);
}

.shibi-vcp-ring-one{
    width:220px;
    height:220px;
    right:0;
    top:5px;
}

.shibi-vcp-ring-two{
    width:160px;
    height:160px;
    right:30px;
    top:35px;
}

.shibi-vcp-car{
    position:absolute;
    right:70px;
    top:68px;
    width:95px;
    height:95px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:28px;
    background:var(--yellow);
    color:#282828;
    box-shadow:0 14px 35px rgba(245,210,56,.24);
}

.shibi-vcp-car svg{
    width:58px;
    height:58px;
}

/* FINDER */
.shibi-vcp-finder-section{
    padding:62px 0 0;
}

.shibi-vcp-section-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
    margin-bottom:22px;
}

.shibi-vcp-section-head h2,
.shibi-vcp-results-head h2,
.shibi-vcp-help h2{
    margin:0;
    color:#252525;
    font-size:30px;
    line-height:1.25;
    font-weight:600;
    letter-spacing:-.6px;
}

.shibi-vcp-section-head > p{
    max-width:520px;
    margin:0;
    color:#747474;
    font-size:13px;
    line-height:1.75;
}

/* RESULTS */
.shibi-vcp-results-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:25px;
    margin:54px 0 20px;
}

.shibi-vcp-active-filters{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:8px;
}

.shibi-vcp-active-filters span{
    display:inline-flex;
    align-items:center;
    min-height:35px;
    padding:0 13px;
    border:1px solid #eadf9f;
    border-radius:999px;
    background:#fffdf3;
    color:#655514;
    font-size:11px;
    line-height:1;
    font-weight:600;
}

.shibi-vcp-results{
    width:100%;
}

/* START */
.shibi-vcp-start-card{
    margin-top:42px;
    min-height:125px;
    display:flex;
    align-items:center;
    gap:18px;
    padding:25px 28px;
    border:1px dashed #dfd7c8;
    border-radius:19px;
    background:#fcfaf5;
}

.shibi-vcp-start-icon{
    width:54px;
    min-width:54px;
    height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(245,210,56,.16);
    color:#b99d18;
}

.shibi-vcp-start-icon svg{
    width:27px;
    height:27px;
}

.shibi-vcp-start-card h3{
    margin:0 0 6px;
    color:#292929;
    font-size:17px;
    line-height:1.3;
    font-weight:600;
}

.shibi-vcp-start-card p{
    max-width:800px;
    margin:0;
    color:#777;
    font-size:13px;
    line-height:1.75;
}

/* HELP */
.shibi-vcp-help{
    margin-top:65px;
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:30px;
    padding:35px 40px;
    border-radius:22px;
    background:
        radial-gradient(circle at 92% 50%,rgba(245,210,56,.25),transparent 28%),
        #252525;
}

.shibi-vcp-help h2{
    color:#fff;
}

.shibi-vcp-help p{
    margin:9px 0 0;
    color:rgba(255,255,255,.65);
    font-size:13px;
    line-height:1.7;
}

.shibi-vcp-help a{
    min-height:48px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:0 20px;
    border-radius:12px;
    background:var(--yellow);
    color:#222!important;
    font-size:12px;
    line-height:1;
    font-weight:600;
}

.shibi-vcp-help a span{
    font-size:17px;
}

/* ERROR */
.shibi-vcp-warning{
    padding:22px;
    border:1px solid #eadb8c;
    border-radius:16px;
    background:#fff9d9;
    color:#5f531b;
    font-size:13px;
    line-height:1.7;
}

/* Existing finder sits naturally inside this page */
.shibi-vcp .shibi-finder{
    margin:0!important;
}

/* Existing product archive should not add top page spacing */
.shibi-vcp-results .shibi-pa-wrap,
.shibi-vcp-results .shibi-product-archive{
    margin-top:0!important;
}

@media(max-width:1050px){

    .shibi-vcp-hero{
        grid-template-columns:1fr 250px;
    }

    .shibi-vcp-hero-mark{
        width:230px;
    }

    .shibi-vcp-section-head{
        align-items:flex-start;
        flex-direction:column;
    }
}

@media(max-width:767px){

    .shibi-vcp-hero{
        min-height:auto;
        grid-template-columns:1fr;
        padding:42px 20px;
        border-radius:20px;
    }

    .shibi-vcp-hero h1{
        font-size:33px;
        letter-spacing:-1px;
    }

    .shibi-vcp-hero-copy > p{
        font-size:13px;
    }

    .shibi-vcp-hero-mark{
        display:none;
    }

    .shibi-vcp-finder-section{
        padding-top:42px;
    }

    .shibi-vcp-section-head h2,
    .shibi-vcp-results-head h2,
    .shibi-vcp-help h2{
        font-size:25px;
    }

    .shibi-vcp-results-head{
        align-items:flex-start;
        flex-direction:column;
        margin-top:42px;
    }

    .shibi-vcp-active-filters{
        justify-content:flex-start;
    }

    .shibi-vcp-start-card{
        align-items:flex-start;
        padding:20px;
    }

    .shibi-vcp-help{
        grid-template-columns:1fr;
        padding:27px 22px;
        margin-top:45px;
    }

    .shibi-vcp-help a{
        justify-self:start;
    }
}
