/* The plan stays one accessible card; its surfaces sit at different depths. */
.pricing-section .price-card.depth-panel{
  --depth-roll:-.5deg;--depth-range:1.15deg;--depth-sway:2.1deg;--depth-lift:4px;
  min-width:0;transform:perspective(1100px) rotateX(-1.15deg) rotateY(2.1deg) rotateZ(-.5deg);
  border-color:#9c83b9a6;border-radius:15px;
  background:radial-gradient(ellipse at 12% 0,#7853ac25,transparent 60%),linear-gradient(135deg,#241d34,#11141f 75%);
  box-shadow:inset 1px 1px 0 #eadbff30,inset -1px -1px 0 #090b14,0 3px 0 #51405f,0 7px 0 #2a2336,0 11px 0 #17141f,0 28px 45px -12px #000b,0 35px 75px -20px #8b55ce30;
}
.pricing-section .price-card.depth-panel:before{
  inset:3px -4px -5px 3px;transform:translateZ(-18px);
  border-color:#8d72a97a;background:linear-gradient(135deg,#4e3b60,#171923 70%);
  box-shadow:0 18px 30px #0008;
}
.pricing-section .price-card.depth-panel:after{
  background:radial-gradient(ellipse at var(--shine-x) var(--shine-y),#e1ceff1a,transparent 65%),linear-gradient(120deg,#ffffff09,transparent 48%);
}
.price-card.depth-panel>.price-top{transform:translateZ(14px);transform-style:preserve-3d}
.price-card.depth-panel .price-top>.tag{transform:translateZ(6px);background:#1b1729;box-shadow:inset 0 1px 0 #f3e5ff18,0 3px 0 #100e1b,0 7px 12px #0004}
.price-card.depth-panel>.billing{transform:translateZ(21px);border-color:#76618b8f;background:#0b0d16;box-shadow:inset 0 2px 5px #0008,0 1px 0 #d8c0ff1c}
.price-card.depth-panel .billing button{min-height:40px}
.price-card.depth-panel .billing [aria-pressed=true]{background:linear-gradient(135deg,#625079,#3a2c53);box-shadow:inset 0 1px 0 #e9d8ff35,0 2px 0 #1d172a,0 4px 8px #0005}
.price-card.depth-panel>.price{transform:translateZ(34px);text-shadow:0 2px 0 #77648b40,0 7px 14px #0007}
.price-card.depth-panel>#price-note{transform:translateZ(18px)}
.price-card.depth-panel>.checks{transform:translateZ(15px);border-top-color:#a17bc043;text-shadow:0 2px 5px #0005}
.price-card.depth-panel>.button{position:relative;transform:translateZ(27px);box-shadow:inset 0 1px 0 #f3eaff8c,0 3px 0 #7960af,0 7px 0 #322341,0 15px 24px -5px #0008}
.price-card.depth-panel>.fine{transform:translateZ(10px)}
.price-card.depth-panel :is(button,a):focus-visible{outline:2px solid #e0ff86;outline-offset:5px}
@media(max-width:760px){
  .pricing-section .price-card.depth-panel{--depth-roll:0deg;--depth-range:.45deg;--depth-sway:.65deg;--depth-lift:2px;transform:perspective(1100px) rotateX(-.45deg) rotateY(.65deg)}
  .price-card.depth-panel>.price{transform:translateZ(20px)}
  .price-card.depth-panel>.billing,.price-card.depth-panel>.button{transform:translateZ(14px)}
}
@media(prefers-reduced-motion:reduce){
  .pricing-section .price-card.depth-panel{transform:none}
  .price-card.depth-panel>*,.price-card.depth-panel .price-top>.tag{transform:none}
}
