/* ============================================================
   Sublime LMS — Pricing page
   Builds on site.css / platform-pages.css tokens.
   ============================================================ */
.pr-reveal { opacity:0; transform:translateY(16px); transition:opacity .7s var(--ease-out), transform .7s var(--ease-out); }
.pr-reveal.in { opacity:1; transform:none; }

/* hero */
.pr-hero { position:relative; padding:78px 0 48px; text-align:center; overflow:hidden; isolation:isolate; }
.pr-hero-field { position:absolute; inset:0; z-index:-3; background:var(--gradient-pulsefield); opacity:.9; }
.pr-hero-dots { position:absolute; inset:0; z-index:-2; background-image:radial-gradient(rgba(17,24,39,0.045) 1px,transparent 1px); background-size:26px 26px; mask-image:linear-gradient(to bottom,transparent,black 16%,black 70%,transparent); }

/* animated flowing-value visualization */
.pr-hero-viz { position:absolute; inset:0; z-index:-1; pointer-events:none; overflow:hidden; }
.pr-hero-viz svg { position:absolute; inset:0; width:100%; height:100%;
  -webkit-mask-image:radial-gradient(118% 92% at 50% 40%, transparent 0%, transparent 40%, #000 74%);
  mask-image:radial-gradient(118% 92% at 50% 40%, transparent 0%, transparent 40%, #000 74%); }
.pr-line-base { fill:none; stroke:rgba(109,40,217,.09); stroke-width:1.5; }
.pr-line { fill:none; stroke-width:2.2; stroke-linecap:round; opacity:.7; stroke-dasharray:2400; stroke-dashoffset:2400; animation:pr-draw 3.6s var(--ease-out) forwards; }
.pr-line.l2 { animation-duration:4.2s; animation-delay:.5s; }
@keyframes pr-draw { to { stroke-dashoffset:0; } }
.pr-comet { offset-path:path("M-60 190 C 360 130, 640 252, 1000 186 S 1500 122, 1560 150"); offset-rotate:0deg; filter:drop-shadow(0 0 6px rgba(139,92,246,.7)); animation:pr-comet-move 8s linear infinite; }
.pr-comet.c2 { offset-path:path("M-60 312 C 380 372, 720 256, 1060 326 S 1500 286, 1560 300"); filter:drop-shadow(0 0 6px rgba(20,184,166,.7)); animation-duration:10s; animation-delay:1.8s; }
@keyframes pr-comet-move { from { offset-distance:0%; } to { offset-distance:100%; } }
.pr-mile { animation:pr-mile-pulse 2.8s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
.pr-mile.m2 { animation-delay:1.2s; }
@keyframes pr-mile-pulse { 0%,100% { opacity:.55; r:4; } 50% { opacity:1; r:6; } }
@media (prefers-reduced-motion:reduce){ .pr-line,.pr-comet,.pr-mile { animation:none !important; stroke-dashoffset:0 !important; } }

.pr-hero .eyebrow { justify-content:center; }
.pr-hero h1 { font-family:var(--font-display); font-weight:800; font-size:clamp(40px,6vw,68px); line-height:1.02; letter-spacing:-0.03em; color:var(--fg); margin:14px 0 18px; text-wrap:balance; }
.pr-hero .lede { font-size:19px; line-height:1.6; color:var(--fg-body); max-width:600px; margin:0 auto; }

/* billing toggle */
.pr-toggle { display:inline-flex; align-items:center; gap:14px; margin:30px auto 0; }
.pr-toggle .lbl { font-size:14px; font-weight:600; color:var(--fg-muted); transition:color .2s; cursor:pointer; }
.pr-toggle .lbl.on { color:var(--fg); }
.pr-switch { width:56px; height:30px; border-radius:999px; background:var(--color-violet-600); border:none; position:relative; cursor:pointer; padding:0; box-shadow:var(--shadow-violet-soft); }
.pr-switch span { position:absolute; top:3px; left:3px; width:24px; height:24px; border-radius:999px; background:#fff; transition:transform .28s var(--ease-spring); }
.pr-switch.annual span { transform:translateX(26px); }
.pr-save { font-size:12px; font-weight:700; color:var(--color-emerald-700); background:var(--color-emerald-50); padding:4px 10px; border-radius:999px; }

/* plan grid */
.pr-plans { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px; align-items:stretch; }
.pr-plan { position:relative; background:#fff; border:1px solid var(--border); border-radius:var(--radius-2xl); padding:32px 28px; display:flex; flex-direction:column; transition:transform .3s var(--ease-out), box-shadow .3s var(--ease-out); }
.pr-plan:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.pr-plan.featured { border:1.5px solid var(--color-violet-300); box-shadow:0 36px 70px -34px rgba(109,40,217,.45), 0 8px 24px -12px rgba(15,23,42,.10); transform:scale(1.045); background:linear-gradient(180deg,#FEFCFF 0%,#FFFFFF 36%); }
.pr-plan.featured:hover { transform:scale(1.045) translateY(-4px); }
.pr-badge { position:absolute; top:-13px; left:50%; transform:translateX(-50%); font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#fff; background:var(--gradient-ai-primary); padding:6px 14px; border-radius:999px; box-shadow:var(--shadow-violet-soft); white-space:nowrap; }
.pr-plan-name { font-family:var(--font-display); font-weight:700; font-size:20px; letter-spacing:-0.01em; color:var(--fg); }
.pr-plan-desc { font-size:13.5px; line-height:1.5; color:var(--fg-muted); margin:6px 0 22px; min-height:40px; }
.pr-price { display:flex; align-items:baseline; gap:4px; }
.pr-price .cur { font-family:var(--font-display); font-weight:700; font-size:22px; color:var(--fg); align-self:flex-start; margin-top:8px; }
.pr-price .amt { font-family:var(--font-display); font-weight:800; font-size:54px; letter-spacing:-0.03em; color:var(--fg); line-height:1; }
.pr-price .per { font-size:14px; color:var(--fg-muted); }
.pr-price.custom .amt { font-size:40px; }
.pr-price .per br { display:none; }
.pr-from { align-self:flex-start; margin-top:10px; font-size:13px; font-weight:600; color:var(--fg-muted); }
.pr-price-sub { font-size:12.5px; color:var(--fg-muted); margin-top:8px; min-height:18px; }
.pr-commit { display:flex; align-items:center; justify-content:center; gap:9px; margin:26px auto 0; max-width:640px; text-align:center; font-size:13.5px; font-weight:600; color:var(--fg-body); }
.pr-commit i { width:17px; height:17px; color:var(--color-emerald-600); flex-shrink:0; }
.pr-plan .btn { margin:22px 0 24px; width:100%; justify-content:center; }
.pr-feat { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:11px; }
.pr-feat li { display:flex; align-items:flex-start; gap:10px; font-size:14px; line-height:1.45; color:var(--fg); }
.pr-feat li i { width:17px; height:17px; color:var(--color-violet-600); flex-shrink:0; margin-top:2px; }
.pr-feat li.muted { color:var(--fg-muted); }
.pr-feat li.muted i { color:var(--fg-faint); }
.pr-feat-head { font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--fg-muted); margin:4px 0 2px; }

/* value strip */
.pr-value { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.pr-value-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius-2xl); padding:30px; }
.pr-value-card .ic { width:46px; height:46px; border-radius:13px; display:grid; place-items:center; margin-bottom:18px; }
.pr-value-card .ic i { width:23px; height:23px; }
.pr-value-card.violet .ic { background:var(--color-violet-100); color:var(--color-violet-700); }
.pr-value-card.emerald .ic { background:var(--color-emerald-100); color:var(--color-emerald-700); }
.pr-value-card.teal .ic { background:var(--color-teal-100); color:var(--color-teal-700); }
.pr-value-card h3 { font-family:var(--font-display); font-weight:700; font-size:19px; letter-spacing:-0.015em; color:var(--fg); margin:0 0 8px; }
.pr-value-card p { font-size:14px; line-height:1.6; color:var(--fg-body); margin:0; }
.pr-value-card .big { font-family:var(--font-display); font-weight:800; font-size:38px; letter-spacing:-0.03em; line-height:1; margin-bottom:6px;
  background:linear-gradient(135deg,#6D28D9,#8B5CF6); -webkit-background-clip:text; background-clip:text; color:transparent; }
.pr-value-card.emerald .big { background:linear-gradient(135deg,#047857,#10B981); -webkit-background-clip:text; background-clip:text; }
.pr-value-card.teal .big { background:linear-gradient(135deg,#0F766E,#14B8A6); -webkit-background-clip:text; background-clip:text; }

/* comparison table */
.pr-compare { overflow-x:auto; }
.pr-table { width:100%; border-collapse:collapse; min-width:680px; }
.pr-table th, .pr-table td { padding:16px 18px; text-align:center; border-bottom:1px solid var(--border); }
.pr-table th:first-child, .pr-table td:first-child { text-align:left; }
.pr-table thead th { position:sticky; top:72px; background:var(--bg); z-index:2; }
.pr-table thead .pname { font-family:var(--font-display); font-weight:700; font-size:17px; color:var(--fg); }
.pr-table thead .pprice { font-size:12px; color:var(--fg-muted); font-weight:500; margin-top:2px; }
.pr-table thead th.feat-col .chip { display:inline-block; font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--color-violet-700); background:var(--color-violet-50); padding:3px 9px; border-radius:999px; margin-top:6px; }
.pr-table .grp td { background:var(--color-mist); font-family:var(--font-display); font-weight:700; font-size:13px; letter-spacing:.02em; color:var(--fg); text-transform:none; text-align:left; }
.pr-table td.feat { font-size:14px; color:var(--fg-body); font-weight:500; }
.pr-table .yes { color:var(--color-emerald-600); }
.pr-table .no { color:var(--color-slate-300); }
.pr-table .val { font-size:13.5px; font-weight:600; color:var(--fg); }
.pr-table .col-feat { background:rgba(167,139,250,.05); }
.pr-table i { width:18px; height:18px; }

/* trust */
.pr-trust { text-align:center; }
.pr-trust .logos { display:flex; align-items:center; justify-content:center; gap:42px; flex-wrap:wrap; margin-top:8px; }
.pr-trust .logos span { font-family:var(--font-display); font-weight:700; font-size:18px; color:var(--color-slate-400); letter-spacing:-0.01em; }
.pr-trust .badges { display:flex; align-items:center; justify-content:center; gap:28px; flex-wrap:wrap; margin-top:28px; }
.pr-trust .badge { display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--fg-body); }
.pr-trust .badge i { width:17px; height:17px; color:var(--color-emerald-600); }

/* FAQ */
.pr-faq { max-width:760px; margin:0 auto; }
.pr-faq-item { border-bottom:1px solid var(--border); }
.pr-faq-q { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 4px; background:none; border:none; cursor:pointer; text-align:left; font-family:var(--font-display); font-weight:650; font-size:17px; letter-spacing:-0.01em; color:var(--fg); }
.pr-faq-q i { width:20px; height:20px; color:var(--color-violet-600); flex-shrink:0; }
.pr-faq-a { max-height:0; overflow:hidden; transition:max-height .35s var(--ease-out); }
.pr-faq-item.open .pr-faq-a { max-height:260px; }
.pr-faq-a p { font-size:15px; line-height:1.65; color:var(--fg-body); margin:0; padding:0 4px 24px; }

/* learner calculator */
.pr-calc { display:grid; grid-template-columns:1fr 1fr; gap:0; margin-top:40px; background:#fff; border:1px solid var(--border); border-radius:var(--radius-2xl); overflow:hidden; box-shadow:var(--shadow-md); }
.pr-calc-controls { padding:34px 34px 30px; border-right:1px solid var(--border); display:flex; flex-direction:column; gap:26px; }
.pr-calc-field { display:flex; flex-direction:column; gap:12px; }
.pr-calc-label { font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--fg-muted); display:flex; align-items:center; justify-content:space-between; }
.pr-calc-count { font-family:var(--font-display); font-weight:800; font-size:20px; letter-spacing:-0.02em; color:var(--color-violet-700); text-transform:none; }
.pr-seg { display:flex; gap:6px; background:var(--color-mist); border-radius:12px; padding:5px; }
.pr-seg-btn { flex:1; border:none; background:none; padding:11px 14px; border-radius:9px; font-family:var(--font-display); font-weight:650; font-size:15px; color:var(--fg-muted); cursor:pointer; transition:background .2s, color .2s, box-shadow .2s; }
.pr-seg-btn.on { background:#fff; color:var(--color-violet-700); box-shadow:var(--shadow-sm); }
.pr-calc input[type=range] { -webkit-appearance:none; appearance:none; width:100%; height:8px; border-radius:999px; background:linear-gradient(90deg,var(--color-violet-300),var(--color-violet-100)); outline:none; }
.pr-calc input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:26px; height:26px; border-radius:999px; background:var(--color-violet-600); border:4px solid #fff; box-shadow:var(--shadow-violet-soft); cursor:pointer; }
.pr-calc input[type=range]::-moz-range-thumb { width:22px; height:22px; border-radius:999px; background:var(--color-violet-600); border:4px solid #fff; box-shadow:var(--shadow-violet-soft); cursor:pointer; }
.pr-calc-ends { display:flex; justify-content:space-between; font-size:12px; font-weight:600; color:var(--fg-muted); }
.pr-calc-billing { font-size:13px; color:var(--fg-muted); margin:0; }
.pr-calc-billing strong { color:var(--color-violet-700); }
.pr-calc-out { padding:34px; display:flex; flex-direction:column; background:linear-gradient(180deg,#FEFCFF 0%,#FFFFFF 40%); }
.pr-calc-figs { display:flex; gap:34px; flex-wrap:wrap; }
.pr-calc-fig { display:flex; flex-direction:column; gap:4px; }
.pr-calc-fig .lbl { font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--fg-muted); }
.pr-calc-fig .fig { display:flex; align-items:baseline; gap:4px; }
.pr-calc-fig .val { font-family:var(--font-display); font-weight:800; font-size:44px; letter-spacing:-0.03em; line-height:1; color:var(--fg); }
.pr-calc-fig.sub .val { font-size:30px; color:var(--fg-body); }
.pr-calc-fig .unit { font-size:14px; color:var(--fg-muted); font-weight:500; }
.pr-calc-note { font-size:13.5px; line-height:1.5; color:var(--fg-body); background:var(--color-violet-50); border-radius:11px; padding:11px 14px; margin:18px 0 20px; }
.pr-calc-out .pr-feat-head { margin-bottom:10px; }
.pr-calc-feat { list-style:none; padding:0; margin:0 0 22px; display:flex; flex-direction:column; gap:9px; }
.pr-calc-feat li { display:flex; align-items:flex-start; gap:9px; font-size:14px; line-height:1.45; color:var(--fg); }
.pr-calc-feat li i { width:16px; height:16px; color:var(--color-emerald-600); flex-shrink:0; margin-top:2px; }
.pr-calc-out .btn { width:100%; justify-content:center; }
.pr-calc-fine { font-size:12px; color:var(--fg-muted); text-align:center; margin:12px 0 0; }

@media (max-width:980px){
  .pr-plans { grid-template-columns:1fr; max-width:440px; margin-left:auto; margin-right:auto; }
  .pr-plan.featured { transform:none; }
  .pr-plan.featured:hover { transform:translateY(-4px); }
  .pr-value { grid-template-columns:1fr; }
  .pr-calc { grid-template-columns:1fr; max-width:520px; margin-left:auto; margin-right:auto; }
  .pr-calc-controls { border-right:none; border-bottom:1px solid var(--border); }
}
@media (max-width:560px){
  .pr-calc-figs { gap:22px; }
  .pr-calc-fig .val { font-size:38px; }
  .pr-calc-fig.sub .val { font-size:26px; }
  .pr-price .amt { font-size:46px; }
}
@media (prefers-reduced-motion:reduce){ .pr-switch span { transition:none; } }
