/* ===== Pricing page: plans (reused from Home) + comparison table ===== */
.nav__item.is-current span{color:var(--content-brand)}
.pricing--page{padding-top:40px}
.pricing--page .sec-head__title{font-size:48px;line-height:1.05;letter-spacing:-1px}
.compare{width:100%;max-width:calc(var(--container) + var(--gutter)*2);padding:64px var(--gutter);display:flex;flex-direction:column;align-items:center;gap:40px}
.compare__head{align-items:center;text-align:center}
.ct__wrap{width:100%;overflow:visible;border-radius:16px;box-shadow:0 0 0 1px rgba(154,201,255,.1);scrollbar-width:thin}
.ct{width:100%;min-width:760px;border-collapse:separate;border-spacing:0;font-family:"Inter",sans-serif;font-size:14px;color:#DEDEE5}
.ct th,.ct td{padding:14px 20px;text-align:center;border-bottom:1px solid rgba(154,201,255,.07)}
.ct tbody th[scope=row]{text-align:left;font-weight:400;color:#fff}
.ct thead th{position:sticky;top:var(--ct-top,84px);z-index:3;background:rgba(11,11,21,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);vertical-align:top;padding:20px;border-bottom:1px solid rgba(154,201,255,.12)}
.ct__corner{text-align:left!important;vertical-align:bottom!important}
.ct__corner span{font:700 16px "Geist",sans-serif;color:var(--content-secondary)}
.ct__plan{display:flex;flex-direction:column;align-items:center;gap:6px}
.ct__plan b{font:700 20px/1.1 "Geist",sans-serif;color:#fff}
.ct__plan span{font-size:13px;color:var(--content-secondary)}
.ct__plan em{font:700 16px "Geist",sans-serif;font-style:normal;color:var(--content-brand)}
.ct__plan .btn{width:100%;max-width:180px;margin-top:6px;font-size:14px}
.ct__group th{padding:22px 20px 10px;text-align:left;font:700 12px "Geist",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--content-brand);background:transparent}
.ct__row:hover th,.ct__row:hover td{background:rgba(16,16,79,.35)}
/* Growth column: tinted, with the brand gradient on its edges */
.ct .ct__hl{background:rgba(16,16,79,.45);box-shadow:inset 1px 0 0 rgba(230,255,42,.25),inset -1px 0 0 rgba(230,255,42,.25)}
.ct thead .ct__hl{background:linear-gradient(180deg,rgba(230,255,42,.12),rgba(16,16,79,.9) 60%);box-shadow:inset 1px 0 0 rgba(230,255,42,.35),inset -1px 0 0 rgba(230,255,42,.35),inset 0 2px 0 #E6FF2A}
.ct__row:hover .ct__hl{background:rgba(16,16,79,.7)}
.ct__group th{border-bottom:0}
.ct__y{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:4px;background:var(--content-brand);color:#0B0B15}
.ct__y svg{width:14px;height:14px}
.ct__n{display:inline-grid;place-items:center;color:#9D9DA1}
.ct__n svg{width:20px;height:20px}
.ct__t{color:#fff;font-weight:500}
.compare__note{margin:0;font-family:"Inter",sans-serif;font-size:14px;color:var(--content-secondary)}
.compare__note a,.compare__more{color:var(--content-brand);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .3s var(--ease-out)}
.compare__note a:hover,.compare__more:hover{background-size:100% 1px}
/* entrance: rows slide up one after another, ticks pop */
.compare__head,.ct__wrap{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .8s var(--ease-out)}
.ct__wrap{transition-delay:.15s}
.compare.in-view .compare__head,.compare.in-view .ct__wrap{opacity:1;transform:none}
.ct__row{opacity:0;transform:translateY(8px);transition:opacity .45s ease,transform .5s var(--ease-out);transition-delay:calc(.25s + var(--k) * 35ms)}
.compare.in-view .ct__row{opacity:1;transform:none}
.ct__y{transform:scale(.4);transition:transform .45s cubic-bezier(.34,1.56,.64,1);transition-delay:calc(.4s + var(--k) * 35ms)}
.compare.in-view .ct__y{transform:none}
@media (max-width:860px){ .ct__wrap{overflow-x:auto} }
@media (max-width:760px){
  .pricing--page .sec-head__title{font-size:32px}
  .compare{padding:48px 16px;gap:24px}
  .ct th,.ct td{padding:12px 12px}
  .ct thead th{padding:14px 10px;top:var(--ct-top,68px)}
  .ct tbody th[scope=row],.ct__corner{position:sticky;left:0;z-index:2;background:#0B0B15;min-width:150px}
  .ct__corner{z-index:4}
  .ct__plan b{font-size:16px}
  .ct{min-width:540px;font-size:13px}
  .ct__plan .btn{display:none}
  .ct tbody th[scope=row],.ct__corner{min-width:140px;max-width:160px}
}
@media (prefers-reduced-motion: reduce){
  .compare__head,.ct__wrap,.ct__row,.ct__y{transition:none;opacity:1;transform:none}
}
