/* Datalyst Africa — Agent plan pages (Part 7).
   Signature effect: plan cards tilt slightly on hover; the Starter card's
   trial badge pulses once on load. Reuses the .tier card system already
   built for the old pricing page. */

.plan-bar{
  padding-top:calc(var(--nav-h) + 28px);padding-bottom:28px;
  background:var(--bg-2);border-bottom:1px solid var(--line);
}
.plan-bar-in{display:flex;flex-direction:column;gap:16px}
.plan-bar-head{display:flex;align-items:center;gap:16px}
.plan-bar-ico{
  width:52px;height:52px;border-radius:14px;flex:none;
  background:var(--g-blue);color:#fff;display:flex;align-items:center;justify-content:center;
}
.plan-bar-ico svg{width:26px;height:26px}
.h-md{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;letter-spacing:-.02em;color:var(--navy-900)}

.tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media (max-width:900px){.tier-grid{grid-template-columns:1fr}}

/* Signature effect: gentle 3D tilt on hover, disabled for reduced motion */
.tier[data-tilt]{transition:transform .3s var(--ease),box-shadow .3s var(--ease);transform-style:preserve-3d}
.tier[data-tilt]:hover{transform:perspective(800px) rotateX(2deg) rotateY(-2deg) translateY(-6px)}
.tier.pop[data-tilt]:hover{transform:perspective(800px) rotateX(2deg) rotateY(-2deg) translateY(-6px)}
@media (prefers-reduced-motion:reduce){
  .tier[data-tilt],.tier[data-tilt]:hover{transform:none;transition:none}
}

/* Signature effect: Starter's trial badge pulses once on load */
@keyframes plan-pulse-once{
  0%{box-shadow:0 0 0 0 rgba(228,48,60,.5)}
  70%{box-shadow:0 0 0 10px rgba(228,48,60,0)}
  100%{box-shadow:0 0 0 0 rgba(228,48,60,0)}
}
.pulse-once{animation:plan-pulse-once 1.6s var(--ease) .4s 1}
@media (prefers-reduced-motion:reduce){.pulse-once{animation:none}}

.plan-pay{margin-top:44px;padding-top:28px;border-top:1px solid var(--line)}
.plan-pay .f-pay-h{color:var(--ink-3)}
.plan-pay .pay-logo{border:1px solid var(--line)}

.plan-faq{margin-top:36px;max-width:760px}