/* Shared inner-page blocks (hero, feature rows, tick lists, card grid). Page-owned copy. */
.phero { padding-bottom: clamp(48px, 6vw, 80px); }
.phero .hero__stage { margin-top: clamp(36px, 5vw, 56px); max-width: 1040px; }
.phero .hero__stage .frame { -webkit-mask-image: linear-gradient(180deg, #000 80%, transparent 99%); mask-image: linear-gradient(180deg, #000 80%, transparent 99%); }
.phero .hero__stage .frame__screen { aspect-ratio: 1.9 / 1; }
.phero .hero__stage .frame__screen > img { transform: none; }
.phero h1 { font-size: clamp(2.3rem, 5.6vw, 4.4rem); }
.feat { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.feat--rev .feat__copy { order: 2; }
.feat__copy { display: grid; gap: 18px; align-content: start; }
.feat__copy .lede { max-width: 34em; }
.feat__visual { position: relative; min-width: 0; }
.feat__visual .frame { transform: none; }
.ticks { display: grid; gap: 11px; margin-top: 6px; }
.ticks li { display: flex; gap: 11px; font-size: .98rem; line-height: 1.45; color: var(--fg); }
.ticks li svg { flex: none; width: 17px; height: 17px; margin-top: 3px; color: var(--teal); }
.note { font-size: .88rem; color: var(--fg-3); font-family: var(--font-mono); letter-spacing: .01em; }
.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 22px); }
.card { display: grid; gap: 12px; align-content: start; padding: clamp(22px, 2.6vw, 32px); border-radius: var(--r-xl); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--card-shadow); transition: transform .4s var(--ease-out), box-shadow .4s var(--ease-out); }
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.card__ic { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: linear-gradient(145deg, rgba(255,122,26,.16), rgba(109,74,255,.16)); border: 1px solid var(--line); color: var(--accent-text); }
.card__ic svg { width: 21px; height: 21px; }
.card p { color: var(--fg-2); font-size: .98rem; }
.card a.more { font-weight: 600; color: var(--accent-text); font-size: .94rem; }
.card a.more:hover { text-decoration: underline; text-underline-offset: 3px; }
.tag-row { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 900px) {
  .js .reveal--right:not(.is-in) { transform: translate3d(0, 26px, 0); }
  .feat { grid-template-columns: 1fr; }
  .feat--rev .feat__copy { order: 0; }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .cards { grid-template-columns: 1fr; }
  .phero .hero__stage { padding-inline: 12px; }
  .phero .hero__stage .frame__screen { aspect-ratio: 1.45 / 1; }
}

/* pricing */
.phero { padding-bottom: clamp(40px, 5vw, 64px); }
.phero .hero__note { margin-top: 0; }
.pr-plans { padding-top: clamp(48px, 6vw, 80px); }
.sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.plan ul { margin-bottom: 28px; }
.plan--pop .price__per, .plan--pop .price__note, .plan--pop .plan__for { color: #a9b1c3; }
.pr-table { border: 1px solid var(--line); border-radius: var(--r-xl); background: var(--surface); overflow-x: auto; box-shadow: var(--card-shadow); -webkit-overflow-scrolling: touch; }
.pr-table:focus-visible { outline-offset: 2px; }
.pr-table table { width: 100%; min-width: 680px; border-collapse: collapse; font-size: .96rem; }
.pr-table th, .pr-table td { padding: 15px 18px; text-align: center; border-bottom: 1px solid var(--line); vertical-align: middle; }
.pr-table thead th { position: sticky; top: 0; font-size: 1.02rem; font-weight: 650; letter-spacing: -.01em; background: var(--surface-2); }
.pr-table tbody th[scope='row'] { text-align: left; font-weight: 500; color: var(--fg); min-width: 220px; position: sticky; left: 0; background: var(--surface); z-index: 1; }
.pr-table .grp th { text-align: left; font-family: var(--font-mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-3); background: var(--surface-2); font-weight: 500; padding-block: 11px; position: static; }
.pr-table td { color: var(--fg-2); font-variant-numeric: tabular-nums; }
.pr-table tbody tr:last-child th, .pr-table tbody tr:last-child td { border-bottom: 0; }
.tb { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; font-weight: 700; font-size: .9rem; }
.tb--y { background: rgba(25,195,166,.16); color: #0b7a69; }
.tb--n { color: var(--fg-3); }
.pr-inc { overflow: hidden; }
.pr-inc::before { content: ''; position: absolute; inset: 0; background: radial-gradient(50% 50% at 50% 0%, rgba(109,74,255,.16), transparent 70%); pointer-events: none; }
.pr-inc .wrap { position: relative; }
.pr-inc__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.pr-inc__item { display: grid; gap: 14px; align-content: start; padding: 22px; border-radius: var(--r-lg); border: 1px solid var(--line); background: var(--surface); font-weight: 600; letter-spacing: -.01em; }
.pr-inc__item svg { width: 26px; height: 26px; color: var(--orange); }
.pr-inc .plans__note a:hover { color: var(--orange); }
@media (max-width: 900px) { .pr-inc__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .pr-inc__grid { grid-template-columns: 1fr; } }