/* rpc-style.css - styles for Related Products Carousel */
.rpc-wrapper{
  background: transparent;
  color: #fff;
  max-width: 1200px;
  margin: 30px auto;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}
.rpc-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.rpc-label{
  color:#FDE68A;
  font-size:12px;
  letter-spacing:1px;
  font-weight:600;
  margin-right:auto;
}
.rpc-title{
  font-size:34px;
  margin:0;
  font-weight:800;
}
.rpc-nav{
  display:flex;
  gap:10px;
  align-items:center;
}
.rpc-arrow{
  background:transparent;
  border:1px solid rgba(255,255,255,0.06);
  color:#fff;
  width:-1px !important;
  height:40px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition: transform .18s ease, background .18s ease;
  backdrop-filter: blur(6px);
}


.rpc-track-viewport{
  overflow:hidden;
}
.rpc-track{
  display:flex;
  gap:18px;
  transition: transform .45s cubic-bezier(.2,.9,.3,1);
  will-change: transform;
  padding: 8px 0 24px 0;
}
.rpc-card{
  min-width: calc((100% / 3) - 12px);
  background: rgba(0,0,0,0.6);
  border-radius:12px;
  overflow:hidden;
  box-shadow: 0 6px 20px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.02);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition: transform .28s ease, box-shadow .28s ease;
  border: 1px solid rgba(255,255,255,0.04);
}
.rpc-card-link{ color:inherit; text-decoration:none; display:flex; flex-direction:column; height:100%; }
.rpc-card-media{ width:365px;height:344px;border-radius:15px;overflow:hidden; display:flex; align-items:center; justify-content:center; background:none; }
.rpc-card-media img{ width:100%; height:100%; object-fit:cover; display:block; transition: transform .6s cubic-bezier(.2,.9,.3,1); }
.rpc-card-footer{ padding:14px; display:flex; align-items:center; justify-content:space-between; gap:8px; background:none; }
.rpc-card-title{ font-size:18px; color:#fff; font-weight:700; font-family:"inter";line-height:21px; transition: color .18s ease; }
.rpc-card-action{ display:flex; align-items:center; gap:8px; }

.rpc-circle{
  width:36px; height:36px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center;
  background:#FBBF24; box-shadow:0 4px 10px rgba(0,0,0,0.35); transition: transform .18s ease, filter .18s ease;
}
.rpc-circle svg{ display:block; transform:translateX(2px); }

.rpc-card:hover{ transform: translateY(-6px); box-shadow: 0 12px 40px rgba(0,0,0,0.7); }
.rpc-card:hover img{ transform: scale(1.06) rotate(-0.2deg); }
.rpc-card:hover .rpc-card-title{ color:#FBBF24; }

.rpc-circle:hover{ transform: scale(1.06); filter: brightness(.92); cursor:pointer; }

/* Responsive */
@media (max-width: 980px){
  .rpc-card{ min-width: calc((100% / 2) - 12px); }
  .rpc-card-media{ height:200px; }
}
@media (max-width: 640px){
  .rpc-card{ min-width: calc(100% - 0px); }
  .rpc-card-media{ height:344px; width:365px }
  .rpc-title{ font-size:22px; }
}