/* revotwo.com landing page: same world as the app, a bit more air. */
.lp-wrap { width: min(1180px, 100% - 2 * var(--rv-gutter)); margin-inline: auto; }
.lp-head { position: sticky; top: 0; z-index: 10; background: color-mix(in srgb, var(--rv-paper) 88%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--rv-line); }
.lp-head-row { display: flex; align-items: center; justify-content: space-between; min-height: 68px; }
.lp-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); grid-template-rows: auto auto auto 1fr; column-gap: 56px; row-gap: 18px; padding: 88px 0 72px; align-items: start; }
.lp-hero > :not(.lp-demo) { grid-column: 1; }
.lp-hero h1 { font-size: clamp(2.3rem, 5vw, 3.8rem); font-weight: 800; letter-spacing: -.04em; line-height: 1.03; }
.lp-lede { font-size: 1.15rem; color: var(--rv-ink-soft); max-width: 46ch; line-height: 1.6; }
.lp-demo { grid-column: 2; grid-row: 1 / span 4; align-self: center; }
.lp-card { display: grid; gap: 12px; margin: 0; box-shadow: var(--rv-shadow-md); }
.lp-card h3 { font-size: 1.1rem; }
.lp-diff { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: var(--rv-radius-md); background: var(--rv-surface-sunk); font-variant-numeric: tabular-nums; font-size: .9rem; }
.lp-diff span { color: var(--rv-ink-soft); margin-right: auto; }
.lp-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; padding: 0 0 96px; }
.lp-point { padding: 24px; background: var(--rv-surface); border: 1px solid var(--rv-line); border-radius: var(--rv-radius-lg); box-shadow: var(--rv-shadow-sm); }
.lp-point svg { color: var(--rv-accent); }
.lp-point h2 { margin: 12px 0 6px; font-size: 1.05rem; }
.lp-point p { color: var(--rv-ink-soft); font-size: .92rem; }
.lp-text { padding: 56px 0 88px; max-width: 70ch; }
.lp-foot { border-top: 1px solid var(--rv-line); padding: 24px 0 calc(24px + env(safe-area-inset-bottom)); color: var(--rv-ink-faint); font-size: .86rem; }
.lp-foot-row { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.lp-foot a { color: inherit; font-weight: 600; }
@media (max-width: 860px) {
    .lp-hero { grid-template-columns: minmax(0, 1fr); padding: 48px 0 48px; }
    .lp-demo { grid-column: 1; grid-row: auto; margin-top: 18px; }
    .lp-points { grid-template-columns: minmax(0, 1fr); }
}
