.homepage__slider{max-width: 80.51VW; margin: 0 auto; position: relative; overflow: hidden;}
.wc-wrap{
    --border:#e7e3d9;
    --border-accent:#e6cf9b;
    --bg:#fff;
    --bg-hover:#fff8eb;
    --text:#2a2a28;
    --arrow-stroke:#4b4434;
    --title-col: #2a2a28;
}

.wc-carousel{ position:relative }
.wc-track{
    display:flex; gap:24px; overflow-x:auto; padding-top:60px; padding-bottom:40px; margin:0; list-style:none;
    scroll-behavior:smooth; scroll-snap-type:x mandatory; scrollbar-width: none;
    -ms-overflow-style: none;
}
.wc-track::-webkit-scrollbar{ display: none; }
.wc-track::-webkit-scrollbar-thumb{ background:#e5e7eb; border-radius:999px }

.wc-card{ width:300px; scroll-snap-align:start }
.wc-link{
    position:relative; display:grid;
    grid-template-columns: 110px 1fr;
    grid-template-rows: 1fr auto;
    column-gap:14px;
    padding:15px;
    height:130px;
    width: 170px;
    text-decoration:none; color:var(--text);
    border:1px solid var(--border);
    overflow:visible;
    transition:border-color .2s ease, background-color .2s ease;
}
.wc-link:hover{ background:transparent; border-color:var(--border-accent) }

.wc-ring{ position:absolute; inset:0; border-radius:10px; pointer-events:none; z-index:0 }

.wc-title{
    grid-column:1; grid-row:1;
    font-size:15px; line-height:1.25; color:var(--title-col);
    margin:0;
    width: 40px;
}

.wc-imgbox{
    grid-column:2; grid-row:1 / span 2;
    display:flex; align-items:flex-end; justify-content:center;
    height:180px; margin:0; position:absolute; top:-85%; right:65%; overflow:visible; z-index:2;
}
.wc-imgbox::after {
    content: "";
    position: absolute;
    right: -3px;
    bottom: 3px;
    transform: translateX(-50%);
    width: 60px;
    height: 1px;
    background: linear-gradient(
            to left,
            rgba(0,0,0,0.5) 0%,
            rgba(0,0,0,0) 100%
    );
    filter: blur(2px);
}
.wc-imgbox img{
    max-height:150px; object-fit:contain;
    position:relative;
    transition: transform .22s cubic-bezier(.2,.7,.2,1);
}

.wc-link:hover .wc-imgbox img,
.wc-card:focus-within .wc-imgbox img{
    transform: translateY(-2px) scale(1.05);
}

.wc-cta{
    grid-column:1; grid-row:2;
    align-self:end; justify-self:start;
}
.wc-cta .wc-arrowicon{
    display:block; stroke:var(--arrow-stroke); stroke-width:2; fill:none; width: 20px; height: 15px;
    stroke-linecap:round; stroke-linejoin:round; transition: width 0.3s ease, stroke 0.3s ease;
}
.wc-link:hover .wc-arrowicon{ width: 28px; stroke:var(--border-accent) }

.wc-nav--left{
    position:absolute; top:50%; left: 0%; transform:translateY(-50%);
    width:42px; height:42px; border-radius:999px; background:#fff;
    border:1px solid var(--border); box-shadow:0 4px 16px rgba(0,0,0,.08);
    display:inline-flex; align-items:center; justify-content:center; cursor:pointer; z-index:3;
    font-size:22px; line-height:1; color:var(--border-accent);
}
.wc-nav--right{
    position:absolute; top:50%; right: 0%; transform:translateY(-50%);
    width:42px; height:42px; border-radius:999px; background:#fff;
    border:1px solid var(--border); box-shadow:0 4px 16px rgba(0,0,0,.08);
    display:inline-flex; align-items:center; justify-content:center; cursor:pointer; z-index:3;
    font-size:22px; line-height:1; color:var(--border-accent);
}
.wc-nav:hover { transform:translateY(-60%); border: 1px solid var(--border-accent) }
.wc-nav:disabled {
    opacity: 0.4;
    pointer-events: none;
}