.usd-services{
  --usd-columns:3;
  display:grid;
  grid-template-columns:repeat(var(--usd-columns),minmax(0,1fr));
  gap:30px;
  width:100%;
  margin:0 auto;
}
.usd-service-card{
  position:relative;
  overflow:hidden;
  border-radius:22px;
  background:#fff;
  border:1px solid rgba(20,34,55,.06);
  box-shadow:0 18px 55px rgba(34,42,76,.10);
  transform:translateY(18px);
  opacity:0;
  transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;
  animation:usdCardIn .65s ease forwards;
  animation-delay:var(--usd-delay,0ms);
}
.usd-service-card:hover{
  transform:translateY(-8px);
  box-shadow:0 24px 70px rgba(34,42,76,.16);
  border-color:rgba(244,167,0,.28);
}
.usd-service-image-wrap{
  position:relative;
  margin:22px 22px 0;
  overflow:hidden;
  border-radius:16px;
  aspect-ratio:16/10;
  background:#f3f4f7;
}
.usd-service-image{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.001);
  transition:transform .65s cubic-bezier(.2,.75,.25,1),filter .35s ease;
}
.usd-service-card:hover .usd-service-image{
  transform:scale(1.065);
  filter:saturate(1.05);
}
.usd-service-image-wrap:after{
  content:"";
  position:absolute;
  inset:-45% -65%;
  background:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.33) 49%,transparent 58%);
  transform:translateX(-40%);
  transition:transform .8s ease;
  pointer-events:none;
}
.usd-service-card:hover .usd-service-image-wrap:after{transform:translateX(40%)}
.usd-service-badge{
  position:absolute;
  top:16px;
  left:16px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:8px 14px;
  border-radius:999px;
  background:#6655e8;
  color:#fff;
  font-weight:700;
  font-size:13px;
  letter-spacing:.2px;
  box-shadow:0 8px 24px rgba(80,67,207,.25);
}
.usd-service-body{padding:26px 28px 28px}
.usd-service-body h3{
  margin:0 0 14px;
  color:#171722;
  font-size:clamp(22px,2vw,28px);
  line-height:1.2;
  font-weight:800;
}
.usd-service-body p{
  margin:0;
  color:#657084;
  font-size:15px;
  line-height:1.8;
}
.usd-service-separator{
  margin:24px 0 22px;
  border-top:2px dotted rgba(255,98,55,.55);
}
.usd-service-footer{display:flex;align-items:center;justify-content:flex-start}
.usd-enroll-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  min-height:50px;
  padding:0 26px;
  border:2px solid #ff6337;
  border-radius:999px;
  color:#ff6337;
  text-decoration:none!important;
  font-weight:800;
  font-size:15px;
  background:#fff;
  transition:all .28s ease;
  box-shadow:0 8px 22px rgba(255,99,55,.08);
}
.usd-enroll-btn:hover{
  color:#fff;
  background:#ff6337;
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(255,99,55,.24);
}
.usd-arrow{font-size:22px;line-height:1;transition:transform .28s ease}
.usd-enroll-btn:hover .usd-arrow{transform:translateX(5px)}
.usd-enroll-btn.usd-disabled{opacity:.5;cursor:not-allowed}
.usd-enroll-btn.usd-disabled:hover{color:#ff6337;background:#fff;transform:none;box-shadow:0 8px 22px rgba(255,99,55,.08)}
.usd-service-placeholder{
  width:100%;height:100%;display:grid;place-items:center;
  background:linear-gradient(135deg,#f1efff,#fff3ec);
  color:#6655e8;font-size:44px;
}
.usd-services-empty{
  padding:30px;border-radius:16px;background:#f7f8fb;color:#5c6678;text-align:center;
}
@keyframes usdCardIn{to{opacity:1;transform:translateY(0)}}
@media (max-width:1024px){.usd-services{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){
  .usd-services{grid-template-columns:1fr;gap:20px}
  .usd-service-image-wrap{margin:14px 14px 0}
  .usd-service-body{padding:22px 20px 24px}
  .usd-enroll-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .usd-service-card,.usd-service-image,.usd-enroll-btn,.usd-arrow{animation:none!important;transition:none!important}
  .usd-service-card{opacity:1;transform:none}
}