/* Votrix — product landing pages built by content-build/build_product.py
   (design comps: videos/blogs/designs/<slug>/). */
body { --vp-green:#1f4331; --vp-green-2:#2d5c44; --vp-mint:#e3efe7; --vp-mint-line:#c9dfd1; --vp-line:#e4dfd8; --vp-card:#fbf9f5; --vp-ink:#17201b; --vp-ink-2:#3d4742; --vp-muted:#5f6762; --vp-bad:#a0452a; --vp-bad-bg:#fbeee9; --vp-amber:#8a5a00; }
.vp-wrap { max-width:1180px; margin:0 auto; padding:0 32px; }
.vp-narrow { max-width:860px; }
.vp-sec { padding:96px 0; }
.vp-white { background:#fff; border-top:1px solid var(--vp-line); border-bottom:1px solid var(--vp-line); }
.vp-eyebrow { font-family:var(--mono, 'Geist Mono', monospace); font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--vp-green-2); margin:0 0 14px; }
.vp-mono { font-family:var(--mono, 'Geist Mono', monospace); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--vp-muted); }
.vp-h1 { font-family:var(--serif, 'Newsreader', Georgia, serif); font-weight:400; font-size:clamp(40px, 5vw, 64px); line-height:1.04; letter-spacing:-.03em; color:var(--vp-ink); margin:0 0 22px; }
.vp-h2 { font-family:var(--serif, 'Newsreader', Georgia, serif); font-weight:400; font-size:clamp(32px, 3.4vw, 46px); line-height:1.1; letter-spacing:-.02em; color:var(--vp-ink); margin:0 0 14px; }
.vp-lead { font-size:19px; line-height:1.6; color:var(--vp-ink-2); margin:0 0 30px; max-width:560px; }
.vp-sub { font-size:18px; line-height:1.6; color:var(--vp-ink-2); margin:0; max-width:680px; }
.vp-head { margin-bottom:44px; max-width:780px; }
.vp-note { font-size:12px; color:var(--vp-muted); margin:12px 0 0; }

.vp-acts { display:flex; flex-wrap:wrap; gap:12px; }
.vp-center { justify-content:center; }
.vp-btn { display:inline-flex; align-items:center; gap:8px; min-height:48px; box-sizing:border-box; padding:13px 24px; border-radius:999px; font-size:16px; font-weight:600; transition:background .2s, border-color .2s, transform .2s; }
.vp-btn:hover { transform:translateY(-1px); }
.vp-btn-primary { background:var(--vp-green); color:#fff; box-shadow:0 12px 26px -16px rgba(31,67,49,.9); }
.vp-btn-primary:hover { background:#173426; color:#fff; }
.vp-btn-ghost { background:#fff; color:var(--vp-ink); border:1px solid #d9d2c7; }
.vp-btn-ghost:hover { border-color:var(--vp-green-2); color:var(--vp-ink); }
.vp-btn-light { background:#fff; color:var(--vp-green); }
.vp-btn-light:hover { color:var(--vp-green); background:#f2ede4; }
.vp-trust { list-style:none; margin:26px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:10px 22px; }
.vp-trust li { position:relative; padding-left:26px; font-size:14px; color:var(--vp-ink-2); }
.vp-trust li::before { content:''; position:absolute; left:0; top:1px; width:18px; height:18px; border-radius:50%; background:var(--vp-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/11px no-repeat; }

/* hero */
.vp-hero { padding:128px 0 88px; }
.vp-hero-grid { display:grid; grid-template-columns:1.08fr .92fr; gap:56px; align-items:center; }
.vp-check-wrap { position:relative; }
.vp-check { background:#fff; border:1px solid var(--vp-line); border-radius:24px; padding:24px; box-shadow:0 40px 80px -50px rgba(23,32,27,.55); }
.vp-check-top { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:18px; }
.vp-check-top .vp-mono { color:var(--vp-green-2); }
.vp-pill-bad { font-size:12px; font-weight:600; color:var(--vp-bad); background:var(--vp-bad-bg); padding:4px 10px; border-radius:999px; white-space:nowrap; }
.vp-q { background:#f4f0ea; border-radius:14px; padding:14px 16px; font-size:15px; color:var(--vp-ink); margin:0 0 14px auto; max-width:88%; }
.vp-a { display:flex; gap:12px; align-items:flex-start; border:1px solid #ece7df; border-radius:14px; padding:14px; margin-bottom:14px; }
.vp-ai { width:30px; height:30px; border-radius:8px; background:var(--vp-ink); color:#fff; font-size:12px; font-weight:600; display:grid; place-items:center; flex:none; }
.vp-a p { margin:0; font-size:14.5px; line-height:1.55; color:var(--vp-ink-2); }
.vp-a b { color:var(--vp-ink); }
.vp-tiles { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }
.vp-tile { border:1px solid #ece7df; border-radius:12px; padding:12px; text-align:center; }
.vp-tile span { display:block; font-size:12.5px; color:var(--vp-muted); }
.vp-tile b { display:block; font-size:14px; }
.vp-bad b { color:var(--vp-bad); } .vp-mid b { color:var(--vp-amber); } .vp-ok b { color:var(--vp-green); }
.vp-fixes { margin-top:16px; padding-top:14px; border-top:1px solid #ece7df; font-size:14px; line-height:1.55; color:var(--vp-ink-2); }
.vp-fixes b { color:var(--vp-ink); }
.vp-agent-chip { position:absolute; left:-22px; bottom:-30px; display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--vp-line); border-radius:16px; padding:10px 16px 10px 10px; box-shadow:0 18px 40px -24px rgba(23,32,27,.5); }
.vp-agent-chip img { width:42px; height:42px; border-radius:50%; object-fit:cover; object-position:center top; }
.vp-agent-chip b { display:block; font-size:14px; color:var(--vp-ink); }
.vp-agent-chip small { font-size:12px; color:var(--vp-muted); }
.vp-check-wrap > .vp-note { text-align:right; margin-top:14px; min-height:20px; }
.vp-check-wrap { margin-bottom:24px; }

/* deliverables */
.vp-grid3 { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px; }
.vp-card { background:var(--vp-card); border:1px solid var(--vp-line); border-radius:20px; padding:26px; display:flex; flex-direction:column; gap:10px; }
.vp-card h3 { font-family:var(--serif, 'Newsreader', Georgia, serif); font-weight:400; font-size:26px; line-height:1.15; letter-spacing:-.01em; color:var(--vp-ink); margin:0; }
.vp-card p { margin:0; font-size:15px; line-height:1.6; color:var(--vp-ink-2); }
.vp-n { align-self:flex-start; font-family:var(--mono, 'Geist Mono', monospace); font-size:13px; color:#fff; background:var(--vp-green); border-radius:8px; padding:4px 9px; }
.vp-card .vp-see { margin-top:auto; padding-top:14px; border-top:1px solid #e3ddd3; color:var(--vp-green); font-size:14.5px; }
.vp-card-hi { background:var(--vp-mint); border-color:var(--vp-mint-line); }
.vp-card-hi .vp-see { border-top-color:var(--vp-mint-line); }
.vp-tag { align-self:flex-start; font-size:12.5px; font-weight:500; color:var(--vp-green); background:rgba(255,255,255,.7); border:1px solid var(--vp-mint-line); border-radius:999px; padding:3px 10px; }
.vp-card-dark { background:var(--vp-ink); border-color:var(--vp-ink); color:#f2ede4; transition:transform .3s; }
.vp-card-dark:hover { transform:translateY(-3px); color:#f2ede4; }
.vp-card-dark img { width:88px; height:88px; border-radius:50%; object-fit:cover; object-position:center top; border:3px solid rgba(255,255,255,.12); }
.vp-card-dark h3 { color:#fff; }
.vp-card-dark p { color:#cfd6d1; }
.vp-more { margin-top:auto; padding-top:14px; border-top:1px solid rgba(255,255,255,.14); font-weight:600; color:#9fd9b6; }

/* proof */
.vp-two { display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:center; }
.vp-two-copy .vp-sub { margin-bottom:22px; }
.vp-link { font-weight:600; color:var(--vp-green); border-bottom:1px solid var(--vp-mint-line); }
.vp-link:hover { color:var(--vp-green); border-bottom-color:var(--vp-green); }
.vp-report { background:#fff; border:1px solid var(--vp-line); border-radius:24px; padding:26px; box-shadow:0 40px 80px -56px rgba(23,32,27,.55); }
.vp-report-top { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:18px; }
.vp-report-top h3 { font-family:var(--serif, 'Newsreader', Georgia, serif); font-weight:400; font-size:28px; margin:0; color:var(--vp-ink); }
.vp-outline { border:1px solid #cfc8bd; border-radius:8px; padding:3px 10px; color:var(--vp-ink-2); }
.vp-stats { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.vp-stat { background:#f6f3ee; border-radius:12px; padding:14px; }
.vp-stat span { display:block; font-size:13px; color:var(--vp-muted); }
.vp-stat b { display:block; margin-top:4px; font-size:14px; font-weight:600; color:var(--vp-ink); }
.vp-stat-hi { background:var(--vp-mint); } .vp-stat-hi b { color:var(--vp-green); }
.vp-rows { list-style:none; margin:0; padding:0; border:1px solid #ece7df; border-radius:14px; }
.vp-rows li { display:flex; justify-content:space-between; gap:14px; padding:14px 16px; font-size:14.5px; color:var(--vp-ink); }
.vp-rows li + li { border-top:1px solid #ece7df; }
.vp-rows b { white-space:nowrap; font-weight:600; }
.vp-st-ok { color:var(--vp-green); } .vp-st-wait { color:var(--vp-amber); }

/* how */
.vp-how-img { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:24px; background:#f2ede4; margin-bottom:28px; display:block; }
.vp-steps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px; }
.vp-steps li { position:relative; background:var(--vp-card); border:1px solid var(--vp-line); border-radius:20px; padding:24px; }
.vp-steps li:not(:last-child)::after { content:'→'; position:absolute; right:-15px; top:26px; z-index:1; width:28px; height:28px; border-radius:50%; background:#fff; border:1px solid var(--vp-line); display:grid; place-items:center; font-size:13px; color:var(--vp-muted); }
.vp-day { display:inline-block; font-family:var(--mono, 'Geist Mono', monospace); font-size:12px; color:#fff; background:var(--vp-green); border-radius:8px; padding:4px 10px; margin-bottom:12px; }
.vp-steps h3 { font-family:var(--serif, 'Newsreader', Georgia, serif); font-weight:400; font-size:24px; margin:0 0 6px; color:var(--vp-ink); }
.vp-steps p { margin:0; font-size:15px; line-height:1.6; color:var(--vp-ink-2); }

/* pricing + fit */
.vp-price-head { display:grid; grid-template-columns:1fr 420px; gap:32px 56px; align-items:center; margin-bottom:28px; }
.vp-price { background:var(--vp-ink); color:#f2ede4; border-radius:22px; padding:26px 28px; }
.vp-price span { font-family:var(--serif, 'Newsreader', Georgia, serif); font-size:20px; color:#cfd6d1; }
.vp-price b { display:block; font-family:var(--serif, 'Newsreader', Georgia, serif); font-weight:400; font-size:46px; line-height:1.1; color:#fff; margin:4px 0 8px; }
.vp-price small { display:block; font-size:14px; color:#cfd6d1; margin-bottom:14px; }
.vp-price a { font-weight:600; color:#9fd9b6; }
.vp-table-wrap { overflow-x:auto; background:#fff; border:1px solid var(--vp-line); border-radius:22px; -webkit-overflow-scrolling:touch; }
.vp-table { width:100%; min-width:760px; border-collapse:collapse; font-size:15px; }
.vp-table thead th { text-align:left; padding:18px 20px; font-weight:600; color:var(--vp-ink); border-bottom:1px solid var(--vp-line); }
.vp-table thead td { border-bottom:1px solid var(--vp-line); }
.vp-table tbody th { text-align:left; padding:16px 20px; font-weight:600; color:var(--vp-ink); width:22%; }
.vp-table td { padding:16px 20px; color:var(--vp-ink-2); }
.vp-table tbody tr + tr > * { border-top:1px solid #ece7df; }
.vp-table th.vp-us { background:var(--vp-green); color:#fff; font-family:var(--serif, 'Newsreader', Georgia, serif); font-weight:400; font-size:20px; }
.vp-table td.vp-us { background:var(--vp-mint); color:var(--vp-green); font-weight:600; }
.vp-fit { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:16px; }
.vp-fit > div { border-radius:22px; padding:28px 30px; }
.vp-fit-yes { background:#fff; border:1px solid var(--vp-line); }
.vp-fit-no { background:var(--vp-card); border:1px dashed #cfc8bd; }
.vp-fit h3 { font-family:var(--serif, 'Newsreader', Georgia, serif); font-weight:400; font-size:28px; margin:0 0 14px; color:var(--vp-ink); }
.vp-fit ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.vp-fit li { position:relative; padding-left:26px; font-size:15.5px; color:var(--vp-ink-2); }
.vp-fit-yes li::before { content:'✓'; position:absolute; left:2px; color:var(--vp-green); font-weight:700; }
.vp-fit-no li::before { content:''; position:absolute; left:5px; top:10px; width:7px; height:7px; border-radius:50%; background:#c8a882; }

/* faq: accordion behaviour and base styles come from site.css + the page script */
.vp-faq { margin-top:8px; }
.vp-faq .faq-q { font-size:18px; }
.vp-faq .faq-a p { font-size:16px; line-height:1.7; color:var(--vp-ink-2); padding-right:48px; }
.vp-faq .faq-a a { color:var(--vp-green); text-decoration:underline; }

/* closing */
.vp-sec-cta { padding-bottom:110px; }
.vp-cta { position:relative; overflow:hidden; background:var(--vp-green); border-radius:32px; padding:68px 40px; text-align:center; color:#fff; }
.vp-cta::before { content:''; position:absolute; right:-120px; top:-160px; width:460px; height:460px; border-radius:50%; background:radial-gradient(circle, rgba(159,217,182,.22), transparent 70%); }
.vp-cta h2 { position:relative; font-family:var(--serif, 'Newsreader', Georgia, serif); font-weight:400; font-size:clamp(34px, 3.8vw, 52px); line-height:1.08; margin:0 0 12px; }
.vp-cta p { position:relative; font-size:18px; color:#d8e6dd; margin:0 auto 28px; max-width:600px; }
.vp-cta small { position:relative; display:block; margin-top:18px; font-size:14px; color:#c3d6ca; }
.vp-cta small a { color:#fff; text-decoration:underline; }

@media (max-width: 1000px) {
  .vp-hero-grid, .vp-two, .vp-price-head { grid-template-columns:1fr; gap:40px; }
  .vp-grid3 { grid-template-columns:1fr 1fr; }
  .vp-agent-chip { left:12px; }
}
@media (max-width: 640px) {
  .vp-wrap { padding:0 20px; }
  .vp-sec { padding:64px 0; }
  .vp-hero { padding:100px 0 56px; }
  .vp-grid3, .vp-steps, .vp-fit, .vp-stats { grid-template-columns:1fr; }
  .vp-tiles { grid-template-columns:1fr 1fr 1fr; gap:6px; }
  .vp-tile { padding:10px 6px; }
  .vp-steps li:not(:last-child)::after { right:50%; top:auto; bottom:-15px; transform:translateX(50%) rotate(90deg); }
  .vp-agent-chip { position:static; margin-top:12px; display:inline-flex; }
  .vp-check-wrap > .vp-note { text-align:left; }
  .vp-cta { padding:48px 22px; border-radius:24px; }
  .vp-btn { width:100%; justify-content:center; }
}
