.hero-with-carousel,.market-paths.market-carousel{--market-card-height:187.2px;--market-reserve:72px;--market-overlap:calc(var(--market-card-height) - var(--market-reserve))}
.hero.hero-map.hero-with-carousel{height:calc(clamp(440px,43vw,580px) + var(--market-reserve))}
.hero-with-carousel .hero-map-scene{height:100%;bottom:0}
.market-paths.market-carousel{position:relative;z-index:3;display:block;width:90%;max-width:1440px;padding:0;margin:calc(0px - var(--market-overlap)) auto 0;isolation:isolate}
.market-carousel__viewport{width:94%;margin:auto;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:16px}
.market-carousel__viewport::-webkit-scrollbar{display:none}
.market-carousel__track{display:flex;align-items:stretch}
.market-carousel__slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always}
.market-carousel .market-card{position:relative;display:block;isolation:isolate;overflow:hidden;min-height:var(--market-card-height);height:100%;padding:0;border:1px solid #ffffff70;border-radius:16px;background:#164e35;color:white;text-decoration:none;-webkit-user-drag:none;transform:scale(var(--market-scale,1));transform-origin:center bottom;will-change:transform}
.market-carousel .market-card__background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;user-select:none}
.market-carousel .market-card::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(100deg,#073b2bd9 0%,#12432e8c 52%,#153e2859 100%)}
.market-carousel .market-card__entrance{position:absolute;left:18px;bottom:13px;z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;width:min(340px,calc(100% - 36px));padding:11px 13px 10px;border:1px solid #ffffffe0;border-radius:18px;background:#ffffff0d;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.market-carousel .market-card__thumbnail{display:block;flex:none;width:112px;height:64px;object-fit:cover;border:1px solid #ffffffa3;border-radius:10px;box-shadow:0 4px 12px #001c2233;pointer-events:none;user-select:none}
.market-carousel .market-card__pill{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;gap:10px;width:100%;min-height:42px;padding:6px 7px 6px 15px;border:1px solid #ffffffbd;border-radius:999px;background:#164e36e8;color:white}
.market-carousel .market-card__name{display:block;min-width:0;margin:0;color:white;font-size:20px;font-weight:600;line-height:1.25;overflow-wrap:anywhere;text-align:center}
.market-carousel .market-card__arrow{display:grid;place-items:center;width:44px;height:31px;border-radius:999px;background:#fff;color:#164e35}
.market-card__arrow svg{width:23px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.market-carousel .market-card:hover{border-color:white}
.market-carousel .market-card:focus-visible{outline:3px solid var(--orange);outline-offset:-5px}
.market-carousel__controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:6px}
.market-carousel__controls button{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--green)}
.market-carousel__controls button:hover{background:#edf5ef}
.market-carousel__controls>button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.market-carousel__position{display:flex;align-items:center;gap:12px}
.market-carousel__rail{position:relative;display:block;flex:none;width:clamp(54px,12vw,120px);height:4px;overflow:hidden;border-radius:999px;background:#c4d6ca}
.market-carousel__rail::after{content:"";position:absolute;inset:0 auto 0 0;width:16px;border-radius:999px;background:var(--green);left:calc(var(--market-fraction,0) * (100% - 16px));will-change:left}
.market-carousel .market-carousel__count{display:flex;align-items:center;justify-content:center;gap:5px;min-width:52px;color:var(--green);font-size:13px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.market-carousel .market-carousel__count span{color:inherit;font:inherit;line-height:inherit}
.market-carousel .market-carousel__count [data-market-total]{color:#768c7f;font-weight:400}
@media(max-width:600px){.hero-with-carousel,.market-paths.market-carousel{--market-card-height:197.6px;--market-reserve:76px}.hero.hero-map.hero-with-carousel{height:calc(460px + var(--market-reserve))}.market-carousel__viewport,.market-carousel .market-card{border-radius:12px}.market-carousel .market-card__entrance{left:12px;bottom:12px;width:calc(100% - 24px);padding:10px 10px 9px;gap:8px;border-radius:16px}.market-carousel .market-card__thumbnail{width:106px;height:62px}.market-carousel .market-card__pill{grid-template-columns:minmax(0,1fr) 36px;gap:6px;min-height:43px;padding:6px 6px 6px 10px}.market-carousel .market-card__name{font-size:17px;line-height:1.3}.market-carousel .market-card__arrow{width:36px;height:29px}.market-card__arrow svg{width:20px;height:18px}.market-carousel__controls{margin-top:4px;gap:8px}.market-carousel__position{gap:9px}}
@media(prefers-reduced-motion:reduce){.market-carousel__viewport{scroll-behavior:auto}.market-carousel .market-card{transform:none;will-change:auto}.market-carousel__rail::after{will-change:auto}}

#market-slide-deli-meat img{object-position:25% center}
#market-slide-beverages img{object-position:20% center}
#market-slide-cooking img{object-position:85% center}

#market-slide-lifestyle .market-card__thumbnail{object-position:50% 0%}
#market-slide-beauty .market-card__thumbnail{object-position:50% 80%}
#market-slide-mother-baby .market-card__thumbnail{object-position:50% 70%}
#market-slide-tong-shop .market-card__thumbnail{object-position:50% 40%}
#market-slide-dairy-eggs .market-card__thumbnail{object-position:50% 65%}
#market-slide-bakery .market-card__thumbnail{object-position:50% 75%}
#market-slide-spices .market-card__thumbnail{object-position:50% 40%}