/* Partner plans (Website content > Partner plans). Uses the website's own tokens: white cards, orange accent, Manrope. */
@property --pang{syntax:"<angle>";initial-value:0deg;inherits:false}
.plans-intro{color:var(--mut);max-width:640px;margin:14px 0 0;font-size:16px;line-height:1.6}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,390px));justify-content:center;gap:22px;margin-top:48px;align-items:stretch;perspective:1200px}

/* card base (light) */
.plan{--pa:var(--ac,#FF7A1A);position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;padding:32px 30px;border-radius:28px;color:var(--ink,#111315);font-family:Inter,system-ui,sans-serif;
  background:#fff;border:1px solid #e3e6ea;
  box-shadow:0 1px 2px rgba(17,19,21,.04),0 20px 50px -12px rgba(17,19,21,.12);
  transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .3s}
.plan>*{position:relative;z-index:1}
/* cursor glow and hover sweep, the same as the service cards */
.plan::before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(17,19,21,.035),transparent 62%);opacity:0;transition:opacity .35s;pointer-events:none}
.plan::after{content:"";position:absolute;z-index:0;top:-40%;bottom:-40%;left:-70%;width:36%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,rgba(17,19,21,.04),transparent);opacity:0;pointer-events:none}
.plan:hover{transform:translateY(-10px);border-color:#d5d9de;box-shadow:0 1px 2px rgba(17,19,21,.05),0 34px 70px -14px rgba(17,19,21,.2)}
.plan:hover::before{opacity:1}
.plan:hover::after{opacity:1;animation:planScan 1.1s cubic-bezier(.2,.8,.2,1)}
@keyframes planScan{to{left:140%}}
/* orange line on top */
.plan .plan-top::before{content:"";position:absolute;left:-30px;right:-30px;top:-32px;height:3px;background:linear-gradient(90deg,transparent,var(--pa),transparent);background-size:200% 100%;opacity:0;transition:opacity .4s}
.plan:hover .plan-top::before{opacity:1;animation:planLine 2.4s linear infinite}
@keyframes planLine{to{background-position:-200% 0}}

.plan-top{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:24px}
.plan-name{display:inline-flex;align-items:center;gap:8px;font:800 13px Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ink,#111315)}
.plan-name::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--pa);box-shadow:0 0 0 4px rgba(255,122,26,.14)}
.plan-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;font:700 11.5px Manrope,sans-serif;color:#111315;background:#f3f4f6;border:1px solid #e3e6ea}
.plan-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--pa);animation:planPulse 1.8s ease-in-out infinite}
@keyframes planPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,122,26,.55)}50%{box-shadow:0 0 0 6px rgba(255,122,26,0)}}

.plan-price{display:flex;align-items:baseline;gap:6px;margin-top:24px}
.plan-price strong{font:800 clamp(46px,5vw,60px)/1 Manrope,sans-serif;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.plan-price span{font-size:14px;color:var(--mut,#6b727a)}
.plan-note{font-size:12.5px;color:var(--mut,#6b727a);margin:10px 0 0}
.plan-desc{font-size:15px;line-height:1.55;margin:20px 0 0;color:#3a3f45}

.plan-btn{position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:10px;margin-top:26px;height:50px;border-radius:999px;background:var(--ink,#111315);color:#fff;font:700 15px Manrope,sans-serif;text-decoration:none;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .3s,background .3s}
.plan-btn::after{content:"→";transition:transform .3s}
.plan-btn::before{content:"";position:absolute;top:-60%;bottom:-60%;left:-60%;width:34%;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);pointer-events:none}
.plan-btn:hover{background:var(--pa);transform:translateY(-2px);box-shadow:0 14px 34px rgba(255,122,26,.42)}
.plan-btn:hover::after{transform:translateX(4px)}
.plan-btn:hover::before{animation:planSweep .8s ease}
@keyframes planSweep{to{left:130%}}
.plan-bnote{display:block;text-align:center;font-size:12.5px;color:var(--mut,#6b727a);margin-top:11px}

.plan-rows{margin:26px 0 0;border-top:1px solid #eceef1}
.plan-rows div{display:flex;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid #eceef1;font-size:13.5px;transition:background .25s,padding .25s}
.plan-rows div:hover{padding-inline:8px;background:linear-gradient(90deg,rgba(17,19,21,.035),transparent)}
.plan-rows dt{color:var(--mut,#6b727a);margin:0}
.plan-rows dd{margin:0;font-weight:700;text-align:right}
.plan-feats{margin-top:24px}
.plan-feats small{display:block;font:700 11px Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--mut,#6b727a);margin-bottom:12px}
.plan-feats ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.plan-feats li{position:relative;padding-left:30px;font-size:14.5px;line-height:1.45}
.plan-feats li::before{content:"";position:absolute;left:0;top:-1px;width:20px;height:20px;border-radius:50%;background:#111315}
.plan-feats li::after{content:"";position:absolute;left:7px;top:3px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}

/* dark card: deep black with a fine silver border that moves */
.plan.dark{color:#f3f4f6;border:1px solid transparent;
  background:linear-gradient(165deg,#141518,#08090a) padding-box,
    conic-gradient(from var(--pang),rgba(255,255,255,.07),rgba(255,255,255,.45),rgba(255,255,255,.07) 30%,rgba(255,255,255,.07)) border-box;
  box-shadow:0 1px 2px rgba(0,0,0,.2),0 30px 60px -18px rgba(0,0,0,.5);animation:planSpin 8s linear infinite}
@keyframes planSpin{to{--pang:360deg}}
.plan.dark::before{background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.06),transparent 62%)}
.plan.dark::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent)}
.plan.dark:hover{border-color:transparent;box-shadow:0 1px 2px rgba(0,0,0,.2),0 40px 80px -18px rgba(0,0,0,.6)}
.plan.dark .plan-name{color:#fff}
.plan.dark .plan-name::before{background:var(--pa);box-shadow:0 0 0 4px rgba(255,122,26,.2)}
.plan.dark .plan-badge{color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16)}
.plan.dark .plan-price strong{color:#fff}
.plan.dark .plan-price span,.plan.dark .plan-note,.plan.dark .plan-bnote,.plan.dark .plan-rows dt,.plan.dark .plan-feats small{color:#9aa0a8}
.plan.dark .plan-desc{color:#e4e6e9}
.plan.dark .plan-btn{background:#fff;color:#111315}
.plan.dark .plan-btn:hover{background:var(--pa);color:#fff;box-shadow:0 14px 34px rgba(255,122,26,.35)}
.plan.dark .plan-btn::before{background:linear-gradient(90deg,transparent,rgba(17,19,21,.12),transparent)}
.plan.dark .plan-rows,.plan.dark .plan-rows div{border-color:rgba(255,255,255,.09)}
.plan.dark .plan-rows div:hover{background:linear-gradient(90deg,rgba(255,255,255,.05),transparent)}
.plan.dark .plan-feats li::before{background:#fff}
.plan.dark .plan-feats li::after{border-color:#111315}

/* entrance: cards rise one after another, then the feature list slides in */
.plans.rv{opacity:1;transform:none}
.plans.rv .plan{opacity:0;transform:translateY(46px) rotateX(8deg);transition:opacity .9s,transform 1s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .3s}
.plans.rv .plan:nth-child(2){transition-delay:.14s}
.plans.rv .plan:nth-child(3){transition-delay:.28s}
.plans.rv.in .plan{opacity:1;transform:none}
.plans.rv.in .plan:hover{transform:translateY(-10px);transition-delay:0s}
.plans.rv .plan-feats li{opacity:0;transform:translateX(-12px);transition:opacity .5s,transform .5s}
.plans.rv.in .plan-feats li{opacity:1;transform:none}
.plans.rv.in .plan-feats li:nth-child(1){transition-delay:.45s}.plans.rv.in .plan-feats li:nth-child(2){transition-delay:.53s}
.plans.rv.in .plan-feats li:nth-child(3){transition-delay:.61s}.plans.rv.in .plan-feats li:nth-child(4){transition-delay:.69s}
.plans.rv.in .plan-feats li:nth-child(5){transition-delay:.77s}.plans.rv.in .plan-feats li:nth-child(n+6){transition-delay:.85s}

@media (max-width:640px){.plans{grid-template-columns:1fr}.plan{padding:28px 22px}}

/* compact size (v1.24) */
.plans{grid-template-columns:repeat(auto-fit,minmax(260px,330px));gap:18px;margin-top:40px}
.plan{padding:24px 22px;border-radius:22px}
.plan .plan-top::before{left:-22px;right:-22px;top:-24px}
.plan-name{font-size:11.5px}
.plan-badge{font-size:10.5px;padding:4px 10px}
.plan-price{margin-top:16px}
.plan-price strong{font-size:clamp(34px,3.6vw,42px)}
.plan-price span{font-size:13px}
.plan-note{font-size:11.5px;margin-top:6px}
.plan-desc{font-size:13.5px;margin-top:14px}
.plan-btn{height:42px;margin-top:18px;font-size:14px}
.plan-bnote{font-size:11.5px;margin-top:8px}
.plan-rows{margin-top:18px}
.plan-rows div{padding:9px 0;font-size:12.5px}
.plan-feats{margin-top:16px}
.plan-feats small{font-size:10px;margin-bottom:9px}
.plan-feats ul{gap:8px}
.plan-feats li{font-size:13px;padding-left:26px}
.plan-feats li::before{width:17px;height:17px}
.plan-feats li::after{left:6px;top:2px;width:4px;height:8px}
.plan:hover,.plans.rv.in .plan:hover{transform:translateY(-6px)}
@media (max-width:640px){.plans{grid-template-columns:minmax(0,360px)}.plan{padding:22px 20px}}
@media (prefers-reduced-motion:reduce){.plan,.plan *,.plan::before,.plan::after{animation:none!important;transition:none!important}.plans.rv .plan,.plans.rv .plan-feats li{opacity:1;transform:none}}