.recently-added{padding:2.5rem 0;background:#f8fafc}.recently-added__inner{max-width:1200px;margin:0 auto;padding:0 1rem}.recently-added__heading{font-size:1.25rem;font-weight:700;margin:0 0 1.25rem;color:#0f172a}.recently-added__viewport{position:relative}.recently-added__viewport:after,.recently-added__viewport:before{content:"";position:absolute;top:0;bottom:0;width:2.5rem;pointer-events:none;z-index:1}.recently-added__viewport:before{left:0;background:linear-gradient(90deg,#f8fafc,rgba(248,250,252,0))}.recently-added__viewport:after{right:0;background:linear-gradient(270deg,#f8fafc,rgba(248,250,252,0))}.recently-added__track{display:flex;gap:14px;list-style:none;margin:0;padding:4px 2px;overflow-x:auto;scroll-snap-type:x proximity;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}.recently-added__track::-webkit-scrollbar{display:none}.recently-added__item{flex:0 0 220px;scroll-snap-align:start}.recently-added__card{display:flex;flex-direction:column;justify-content:center;gap:.25rem;box-sizing:border-box;width:220px;height:92px;padding:0 1rem;background:#fff;border:1px solid #e2e8f0;border-radius:12px;text-decoration:none;color:inherit;overflow:hidden;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}.recently-added__card:focus-visible,.recently-added__card:hover{border-color:#cbd5e1;box-shadow:0 4px 14px rgba(15,23,42,.1);transform:translateY(-2px);outline:none}.recently-added__name{font-weight:600;color:#0f172a;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.recently-added__area{font-size:.85rem;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recently-added__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:32px;height:32px;display:none;align-items:center;justify-content:center;padding:0;font-size:1.25rem;line-height:1;color:#0f172a;background:#fff;border:1px solid #e2e8f0;border-radius:50%;box-shadow:0 2px 8px rgba(15,23,42,.12);cursor:pointer}.recently-added__nav:hover{border-color:#cbd5e1}.recently-added__nav--prev{left:-6px}.recently-added__nav--next{right:-6px}@media (hover:hover) and (pointer:fine){.recently-added__nav{display:flex}}@media (prefers-reduced-motion:reduce){.recently-added__track{scroll-behavior:auto}.recently-added__card{transition:none}}