/* Pulse website: /pricing. Loaded after site.css + pages.css on the pricing page only.
   Two plan cards (Premium framed by the signal gradient), a plain comparison table, a taped
   "promises" pledge and the shared FAQ/CTA. Handwritten notes are decorative and aria-hidden. */

.page-pricing .faq { border-top: 0; }

/* ---------- head ---------- */
.pr-head { padding-bottom: clamp(24px, 4vw, 44px); }
.pr-head-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px clamp(24px, 4vw, 56px); align-items: end; }
.pr-head-top { grid-column: 1 / -1; }
.pr-title { font-size: clamp(2.2rem, 5.4vw, 4.2rem); line-height: 1.02; }
.pr-title > span { display: block; }
.pr-title-2 { color: var(--text-2); }
.pr-head .page-lede { max-width: 35em; }
.pr-meta { margin-top: 16px; font-size: .92rem; color: var(--text-2); }
.pr-meta span { color: var(--text); font-weight: 700; }
.pr-mascot { display: flex; flex-direction: column; align-items: center; padding: 0 12px 0 0; margin-top: -40px; }
.pr-blip, .pr-blip .blip { width: 116px; }
.pr-mascot .hand-note { margin-top: 6px; font-size: 21px; rotate: -5deg; }

/* ---------- plan cards ---------- */
.pr-plans { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.7fr); gap: clamp(16px, 2.4vw, 28px); align-items: start; padding-bottom: clamp(56px, 8vw, 96px); }
.plan { position: relative; display: flex; flex-direction: column; padding: clamp(22px, 2.6vw, 32px); border-radius: 22px; background: linear-gradient(180deg, rgba(255, 255, 255, .025), transparent 160px), var(--ink-850); border: 1px solid var(--line-strong); }
.plan-premium {
  border: 1px solid transparent;
  background: linear-gradient(180deg, rgba(124, 92, 255, .09), transparent 220px) padding-box, linear-gradient(var(--ink-850), var(--ink-850)) padding-box, linear-gradient(150deg, rgba(124, 92, 255, .85), rgba(76, 201, 255, .55) 50%, rgba(61, 245, 176, .6)) border-box;
  box-shadow: var(--shadow-craft), 0 30px 70px -40px rgba(124, 92, 255, .55);
}
.plan-free { align-self: stretch; }
.plan-name { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; font-family: var(--font-display); font-weight: 700; font-size: 1.35rem; letter-spacing: -.02em; }
.plan-name .sticker { font-size: 12px; }
.plan-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin-top: 14px; }
.plan-amount { font-family: var(--font-display); font-weight: 800; font-size: clamp(2.8rem, 5vw, 3.8rem); letter-spacing: -.05em; line-height: 1; font-variant-numeric: tabular-nums; }
.plan-premium .plan-amount { background: var(--grad-signal); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .04em; }
.plan-per { font-weight: 700; color: var(--text-2); font-size: 1rem; }
.plan-sub { margin-top: 10px; color: var(--text-2); max-width: 36ch; }
.plan-sub b { color: var(--text); }

.plan-trial { display: flex; gap: 12px; align-items: flex-start; margin-top: 20px; padding: 12px 14px; border-radius: 14px; background: rgba(61, 245, 176, .06); border: 1px solid rgba(61, 245, 176, .24); font-size: .94rem; color: var(--text-2); line-height: 1.5; }
.plan-trial b { color: var(--text); }
.plan-trial-ic { flex: none; position: relative; width: 20px; height: 20px; margin-top: 1px; border-radius: 50%; background: rgba(61, 245, 176, .16); }
.plan-trial-ic::after { content: ''; position: absolute; left: 7px; top: 4px; width: 5px; height: 9px; border: solid var(--mint); border-width: 0 2px 2px 0; transform: rotate(45deg); }

.plan-buy { margin-top: 16px; }
.plan-buy .btn { width: 100%; }
.plan-buy-fine { margin-top: 10px; font-size: .86rem; color: var(--text-2); text-align: center; }
.plan-soon-note { padding: 14px 16px; border-radius: 14px; border: 1px dashed rgba(255, 210, 122, .45); background: rgba(255, 210, 122, .05); color: var(--text); font-weight: 600; line-height: 1.5; }
.plan-soon-note .link { text-decoration-color: rgba(255, 210, 122, .6); }
.plan-soon-note .link:hover { text-decoration-color: var(--hand-ink); }

.plan-list-title { margin: 26px 0 0; font-size: .95rem; font-weight: 800; color: var(--text); }
.plan-list { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 10px; }
.plan-list li { position: relative; padding-left: 30px; line-height: 1.55; color: var(--text); }
.plan-list.is-yes li::before { content: ''; position: absolute; left: 0; top: .2em; width: 20px; height: 20px; border-radius: 50%; background: rgba(61, 245, 176, .14); }
.plan-list.is-yes li::after { content: ''; position: absolute; left: 7px; top: calc(.2em + 4px); width: 5px; height: 9px; border: solid var(--mint); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.plan-free .plan-list li:first-child { font-weight: 700; }
.plan-foot { margin-top: auto; padding-top: 26px; }
.plan-foot .btn { width: 100%; }

/* coming soon: visibly a different kind of list (dashed, hollow markers, muted text) */
.plan-later { position: relative; margin-top: 26px; padding: 18px 18px 18px; border-radius: 16px; border: 1.5px dashed var(--line-strong); background: repeating-linear-gradient(-45deg, rgba(160, 170, 255, .018) 0 10px, transparent 10px 20px); }
.plan-later .plan-list-title { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.plan-later-sub { flex-basis: 100%; font-weight: 500; font-size: .88rem; color: var(--text-2); line-height: 1.5; }
.sticker-soon { background: var(--hand-ink); color: #2a1c05; font-size: 12px; }
.plan-list.is-soon li { color: var(--text-2); font-size: .95rem; }
.plan-list.is-soon li::before { content: ''; position: absolute; left: 3px; top: .3em; width: 14px; height: 14px; border-radius: 50%; border: 1.5px dashed rgba(255, 210, 122, .7); }
/* Premium: two columns inside the card on wide screens (price + trial | what's in it) */
.plan-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 clamp(24px, 3vw, 40px); }
.plan-col { display: flex; flex-direction: column; min-width: 0; }
.plan-cols > .plan-col:last-child > .plan-list-title:first-child { margin-top: 4px; }
.pr-note-soon { align-self: flex-end; margin: auto -6px 34px 0; padding-top: 30px; font-size: 21px; white-space: nowrap; }
.pr-note-soon .hand-arrow { width: 44px; height: 34px; margin-top: 14px; }

/* ---------- sections ---------- */
.pr-sec { padding: clamp(56px, 8vw, 104px) 0; }
.pr-sec-head { max-width: 680px; margin-bottom: clamp(24px, 3.5vw, 40px); }
.pr-sec-head .section-title, .pr-pledge .section-title, .pr-faq-title { font-size: clamp(1.75rem, 3.6vw, 2.7rem); }

/* comparison table */
.pr-table-wrap { border-radius: 20px; border: 1px solid var(--line); background: rgba(14, 17, 32, .7); overflow: hidden; box-shadow: var(--shadow-site); }
.pr-table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.pr-table th, .pr-table td { padding: 15px 22px; text-align: left; vertical-align: middle; border-bottom: 1px solid var(--line); line-height: 1.45; }
.pr-table thead th { font-family: var(--font-display); font-weight: 700; font-size: 1rem; color: var(--text); padding-block: 18px; }
.pr-table thead th:first-child { font-family: var(--font-body); font-size: .9rem; font-weight: 700; color: var(--text-2); }
.pr-table tbody th { font-weight: 600; color: var(--text); width: 46%; }
.pr-table td { color: var(--text-2); font-weight: 600; width: 27%; }
.pr-table td.num { font-family: var(--font-mono); font-size: 1.02rem; }
.pr-table .is-prem { background: rgba(124, 92, 255, .07); box-shadow: inset 2px 0 0 rgba(124, 92, 255, .55); color: var(--text); }
.pr-table thead .is-prem { background: rgba(124, 92, 255, .13); }
.pr-table td.is-prem.num { color: var(--text); font-weight: 600; }
.pr-price-row td { font-weight: 700; }
.pr-both tr:first-child > * { border-top: 1px dashed var(--line-strong); }
.pr-both tr:last-child > * { border-bottom: 0; }
.pr-both th { color: var(--text-2); font-weight: 600; }
.yes { display: inline-block; position: relative; width: 22px; height: 22px; border-radius: 50%; background: rgba(61, 245, 176, .14); vertical-align: middle; }
.yes::after { content: ''; position: absolute; left: 8px; top: 4px; width: 5px; height: 10px; border: solid var(--mint); border-width: 0 2px 2px 0; transform: rotate(45deg); }

/* promises pledge */
.pr-pledge { position: relative; padding: clamp(26px, 4vw, 48px); border-radius: 8px 26px 26px 26px; background: linear-gradient(180deg, rgba(255, 210, 122, .045), transparent 50%), var(--ink-850); border: 1px solid rgba(255, 210, 122, .2); }
.pr-pledge-head { max-width: 640px; }
.pr-promise-list { list-style: none; margin: clamp(22px, 3vw, 34px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px clamp(24px, 4vw, 56px); }
.pr-promise-list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 4px 14px; align-content: start; }
.pr-ic { grid-row: span 2; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; color: var(--hand-ink); background: rgba(255, 210, 122, .09); box-shadow: inset 0 0 0 1px rgba(255, 210, 122, .22); rotate: -3deg; }
.pr-promise-list li:nth-child(even) .pr-ic { rotate: 2deg; }
.pr-ic .hi { width: 20px; height: 20px; }
.pr-promise-list b { font-size: 1.04rem; color: var(--text); line-height: 1.4; }
.pr-promise-list li > span:last-child { color: var(--text-2); line-height: 1.6; }
.pr-sign { display: flex; align-items: flex-end; justify-content: flex-end; gap: 6px; margin-top: 26px; font: 700 25px/1 var(--font-hand); color: var(--hand-ink); }
.pr-sign-text { display: inline-block; padding-bottom: 10px; transform: rotate(-3deg); }

/* FAQ heading */
.pr-faq-title { line-height: 1.08; }

/* ---------- responsive ---------- */
@media (max-width: 1179px) {
  .pr-plans { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); }
  .plan-cols { grid-template-columns: minmax(0, 1fr); }
  .plan-cols > .plan-col:last-child > .plan-list-title:first-child { margin-top: 26px; }
  .pr-note-soon { display: none; }
  .plan-free { align-self: start; position: sticky; top: calc(var(--nav-h) + 24px); }
}
@media (max-width: 880px) {
  .pr-plans { grid-template-columns: minmax(0, 1fr); }
  .plan-free { position: static; }
  .pr-promise-list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
  .pr-head-grid { grid-template-columns: minmax(0, 1fr); }
  .pr-mascot { position: absolute; right: var(--gutter); top: -14px; padding: 0; margin: 0; }
  .pr-head .page-trace { margin-right: 80px; }
  .pr-mascot .hand-note { display: none; }
  .pr-blip, .pr-blip .blip { width: 70px; }
  .pr-head .page-trace { width: 140px; }
  .pr-table th, .pr-table td { padding: 12px 12px; font-size: .9rem; }
  .pr-table thead th { font-size: .9rem; }
  .pr-table tbody th { width: auto; }
  .pr-table td { width: 24%; }
  .pr-table td.num { font-size: .92rem; }
  .pr-sign { justify-content: flex-start; font-size: 22px; }
}
@media (max-width: 400px) {
  .pr-table th, .pr-table td { padding: 11px 9px; }
  .plan { padding: 20px 18px; }
  .plan-later { padding: 16px 14px; }
}
@media print {
  .nav, .footer, .pr-mascot, .hand-note, .cta { display: none !important; }
  body { background: #fff; color: #000; }
}
.nw { white-space: nowrap; }
.pr-promises { padding-bottom: clamp(16px, 3vw, 40px); }