/* GoRiver — goriver.com.br · tokens do GoRiver Design System */
:root {
  --bg:#0D0F12; --surface:#171A1F; --surface-2:#1F242B; --border:#2A2F36;
  --text:#FAFAFA; --body:#B4BCC4; --muted:#7C8792;
  --acc:#3ECF8E; --acc-ink:#0D0F12; --acc-soft:rgba(62,207,142,.12); --red:#FF6B6B;
  --mono:'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;
  --sans:'Instrument Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --wrap:1120px; --gutter:clamp(20px, 4vw, 40px);
  color-scheme:dark;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--text); font:400 16px/1.55 var(--sans); overflow-x:hidden; text-rendering:optimizeLegibility; }
a { color:var(--text); text-decoration:none; }
a:hover { color:var(--acc); }
:focus-visible { outline:2px solid var(--acc); outline-offset:3px; border-radius:4px; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.wrap { position:relative; width:100%; max-width:calc(var(--wrap) + 2 * var(--gutter)); margin:0 auto; padding-inline:var(--gutter); }
.mono { font-family:var(--mono); }
.a { color:var(--acc); } .m { color:var(--muted); }

/* o rio */
#page { position:relative; }
#river { position:absolute; left:0; top:0; width:100%; pointer-events:none; z-index:0; overflow:visible; }
#river path { fill:none; stroke-linecap:round; stroke-linejoin:round; }
#river .flow { stroke:var(--text); stroke-width:10; }
#river .glow { stroke:var(--acc); stroke-width:14; opacity:.18; }
.content { position:relative; z-index:1; }

/* menu */
.nav { position:sticky; top:0; z-index:20; background:rgba(13,15,18,.82); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border-bottom:1px solid var(--border); }
.nav .wrap { display:flex; align-items:center; justify-content:space-between; gap:24px; height:64px; }
.logo { display:inline-flex; align-items:center; color:var(--text); }
.logo svg { height:36px; width:calc(36px * 702 / 172); display:block; }
.nav ul { display:flex; gap:28px; list-style:none; margin:0; padding:0; font:400 14px var(--mono); }
.nav ul a { color:var(--body); white-space:nowrap; }
.nav ul a:hover { color:var(--text); }
@media (max-width:860px) { .nav ul { display:none; } .logo svg { height:30px; width:calc(30px * 702 / 172); } }

/* botões */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font:500 15px/1 var(--mono); padding:0 20px; min-height:46px; border-radius:8px; border:1px solid transparent; cursor:pointer; white-space:nowrap; transition:background-color .15s, border-color .15s, color .15s; }
.btn-p { background:var(--acc); color:var(--acc-ink); }
.btn-p:hover { background:#5BD9A0; color:var(--acc-ink); }
.btn-s { background:transparent; color:var(--text); border-color:var(--border); }
.btn-s:hover { border-color:var(--muted); color:var(--text); }
.btn-sm { min-height:40px; padding:0 16px; font-size:14px; }

/* tipografia de bloco */
.eyebrow { display:flex; align-items:flex-start; gap:10px; font:500 12px/1.6 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:0; }
.eyebrow::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--acc); flex:none; margin-top:.45em; }
h1, h2, h3 { font-family:var(--mono); margin:0; text-wrap:balance; }
h1 { font-weight:700; font-size:clamp(42px, 6.2vw, 76px); line-height:1; letter-spacing:-.045em; }
h2 { font-weight:700; font-size:clamp(30px, 4vw, 44px); line-height:1.1; letter-spacing:-.04em; }
h3 { font-weight:700; font-size:20px; line-height:1.3; letter-spacing:-.02em; }
.lead { font-size:clamp(17px, 1.5vw, 20px); line-height:1.55; color:var(--body); max-width:54ch; margin:0; text-wrap:pretty; }
.body { color:var(--body); margin:0; text-wrap:pretty; }
.note { font:400 13px/1.6 var(--mono); color:var(--muted); margin:0; }

/* hero */
.hero { padding-block:clamp(40px, 7vw, 88px) clamp(72px, 9vw, 128px); display:grid; grid-template-columns:minmax(0, 1.05fr) minmax(0, 1fr); gap:clamp(32px, 5vw, 72px); align-items:center; }
.hero-copy { display:flex; flex-direction:column; gap:28px; }
.hero-copy .lead { margin-top:-4px; }
.ctas { display:flex; flex-wrap:wrap; gap:12px; }
@media (max-width:900px) { .hero { grid-template-columns:1fr; } .hero-copy { gap:22px; } }

/* terminal */
.term { background:var(--surface); border:1px solid var(--border); border-radius:14px; overflow:hidden; min-width:0; }
.term-bar { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:0 18px; height:40px; border-bottom:1px solid var(--border); font:500 11px/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.term-scr { padding:18px 20px; font:400 14px/1.85 var(--mono); color:var(--body); height:340px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; }
.term-scr::-webkit-scrollbar { display:none; }
#termLines > div { white-space:pre-wrap; overflow-wrap:anywhere; }
.term-in { display:flex; align-items:center; gap:0; font:400 14px/1.85 var(--mono); color:var(--text); }
.term-in label { color:var(--muted); margin-right:1ch; }
.term-in input { flex:1; min-width:0; background:transparent; border:0; outline:0; color:var(--text); font:inherit; padding:4px 0; caret-color:transparent; }
.term-in input::placeholder { color:var(--muted); opacity:1; }
.term-in input:focus-visible { outline:0; }
.term-hint { padding:12px 20px; border-top:1px solid var(--border); font:400 12px/1.5 var(--mono); color:var(--muted); }
.term-hint b { font-weight:500; color:var(--body); }
.term-chat { display:flex; flex-direction:column; gap:8px; padding:12px 0; }
.term-chat .bub { max-width:92%; padding:9px 13px; border-radius:10px; font:400 14px/1.45 var(--sans); }
.term-chat .bub-me { align-self:flex-end; background:var(--acc); color:var(--acc-ink); border-bottom-right-radius:3px; }
.term-chat .bub-bot { align-self:flex-start; background:var(--bg); border:1px solid var(--border); color:var(--body); font:400 13px/1.7 var(--mono); border-bottom-left-radius:3px; min-height:1.7em; }
.term-cta { padding:10px 0 6px; }
.term-cta .btn { align-self:flex-start; }
.term-lead { display:flex; flex-direction:column; gap:8px; padding:8px 0 6px; }
.term-lead label { display:grid; grid-template-columns:11ch minmax(0, 1fr); gap:1ch; align-items:center; font:400 14px/1.85 var(--mono); }
.term-lead input { min-width:0; background:var(--bg); border:1px solid var(--border); border-radius:6px; color:var(--text); font:400 14px/1.4 var(--sans); padding:7px 10px; }
.term-lead input::placeholder { color:var(--muted); opacity:1; }
.term-lead.err input:invalid { border-color:var(--red); }
.term-lead .btn { align-self:flex-start; margin-top:4px; }
@media (max-width:480px) { .term-lead label { grid-template-columns:1fr; gap:4px; } .term-lead .btn { align-self:stretch; white-space:normal; text-align:center; } }
.cur { display:inline-block; width:8px; height:1.05em; background:var(--acc); vertical-align:-.18em; border-radius:1px; animation:blink 1.1s steps(1) infinite; }
@keyframes blink { 50% { opacity:0; } }
@media (max-width:480px) { .term-scr { height:300px; font-size:13px; padding-inline:16px; } .term-in { font-size:13px; } .term-hint, .term-bar { padding-inline:16px; } }

/* blocos */
.block { padding-block:clamp(72px, 9vw, 120px); }
.head { display:flex; flex-direction:column; gap:16px; max-width:720px; margin-bottom:clamp(36px, 5vw, 56px); }
.grid-3 { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:20px; }
@media (max-width:900px) { .grid-3 { grid-template-columns:1fr; } }
.card { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:28px; display:flex; flex-direction:column; gap:14px; min-width:0; }
.card .body { font-size:15px; }
.st { font:500 13px/1 var(--mono); color:var(--red); }
.st-ok { color:var(--acc); }
.grid-5 { display:grid; grid-template-columns:repeat(6, minmax(0, 1fr)); gap:20px; }
.grid-5 > :nth-child(-n+3) { grid-column:span 2; }
.grid-5 > :nth-child(n+4) { grid-column:span 3; }
@media (max-width:900px) { .grid-5 { grid-template-columns:1fr; } .grid-5 > * { grid-column:auto; } }
.tag { align-self:flex-start; font:500 11px/1 var(--mono); letter-spacing:.04em; padding:6px 10px; border-radius:999px; background:var(--acc-soft); color:var(--acc); }
.tag-off { background:transparent; border:1px solid var(--border); color:var(--muted); }
.card-wip { border-style:dashed; background:transparent; }
.card-wip .cmd .cur { width:.55em; height:.95em; vertical-align:-.1em; }
.card-wip .body, .card-wip .lines { color:var(--muted); }
.cmd { font:700 19px/1.3 var(--mono); letter-spacing:-.02em; color:var(--text); }
.cmd-go { font-weight:500; font-size:.6em; color:var(--muted); letter-spacing:0; vertical-align:.08em; margin-right:1px; }
.card .cmd { font-size:26px; }
.cmd-inline { font-size:1.05em; }
.chat-bar { display:flex; justify-content:space-between; align-items:center; margin:-4px -4px 6px; padding:0 4px 12px; border-bottom:1px solid var(--border); font:500 11px/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.chat-bar .cmd { font-size:16px; letter-spacing:-.02em; text-transform:none; }
.lines { font:400 13px/1.9 var(--mono); color:var(--body); background:var(--bg); border:1px solid var(--border); border-radius:8px; padding:12px 14px; }
.card .btn { align-self:flex-start; margin-top:auto; }

/* como funciona */
.split { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:clamp(32px, 5vw, 72px); align-items:center; }
@media (max-width:900px) { .split { grid-template-columns:1fr; } }
.steps { display:flex; flex-direction:column; gap:24px; margin-top:clamp(28px, 4vw, 40px); }
.step { display:grid; grid-template-columns:40px minmax(0, 1fr); gap:12px; }
.step .n { font:500 13px/1.9 var(--mono); color:var(--acc); }
.step h3 { font-size:18px; }
.step .body { margin-top:6px; font-size:15px; }
.chat { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:22px; display:flex; flex-direction:column; gap:10px; width:100%; max-width:440px; justify-self:end; }
.bub { max-width:88%; padding:11px 15px; border-radius:12px; font-size:15px; line-height:1.45; }
.bub-me { align-self:flex-end; background:var(--acc); color:var(--acc-ink); border-bottom-right-radius:4px; }
.bub-bot { align-self:flex-start; background:var(--bg); border:1px solid var(--border); color:var(--body); font:400 13px/1.8 var(--mono); border-bottom-left-radius:4px; }
@media (max-width:900px) { .chat { justify-self:start; } }

/* ganhos */
.gains { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:24px; }
@media (max-width:900px) { .gains { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:520px) { .gains { grid-template-columns:1fr; } }
.gain { border-top:1px solid var(--border); padding-top:20px; display:flex; flex-direction:column; gap:10px; }
.gain .k { font:700 clamp(24px, 2.6vw, 30px)/1.15 var(--mono); letter-spacing:-.04em; }
.gain .body { font-size:15px; }

/* planos */
.cycle { display:inline-flex; border:1px solid var(--border); border-radius:8px; padding:4px; gap:4px; margin:-16px 0 32px; }
.cycle-btn { all:unset; box-sizing:border-box; cursor:pointer; font:500 14px/1 var(--mono); color:var(--body); padding:10px 16px; border-radius:5px; min-height:40px; display:inline-flex; align-items:center; gap:6px; }
.cycle-btn:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
.cycle-btn.is-on { background:var(--surface-2); color:var(--text); }
.plans { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:20px; align-items:stretch; }
@media (max-width:900px) { .plans { grid-template-columns:1fr; } }
.plan { position:relative; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:28px; display:flex; flex-direction:column; gap:18px; min-width:0; }
.plan-hi { background:var(--acc); border-color:var(--acc); color:var(--acc-ink); }
.plan-tag { position:absolute; top:-13px; left:28px; font:500 12px/1 var(--mono); padding:7px 10px; border-radius:999px; background:var(--bg); color:var(--acc); border:1px solid var(--border); }
.plan-name { font:500 14px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.plan-hi .plan-name { color:var(--acc-ink); }
.price { display:flex; align-items:baseline; gap:4px; font-family:var(--mono); letter-spacing:-.04em; }
.cur-sym { font:500 18px/1 var(--mono); color:var(--muted); letter-spacing:0; }
.price-v { font:700 clamp(40px, 4vw, 52px)/1 var(--mono); }
.price-per { font:400 15px/1 var(--mono); color:var(--muted); letter-spacing:0; }
.plan-hi .cur-sym, .plan-hi .price-per { color:var(--acc-ink); opacity:.8; }
.price-note { margin:-10px 0 0; font:400 13px/1.4 var(--mono); color:var(--muted); min-height:1.4em; }
.plan-hi .price-note { color:var(--acc-ink); }
.feats { list-style:none; margin:0; padding:18px 0 0; border-top:1px solid var(--border); display:flex; flex-direction:column; gap:8px; font:400 14px/1.5 var(--mono); color:var(--body); }
.plan-hi .feats { border-color:rgba(13,15,18,.25); color:var(--acc-ink); }
.feats li { display:grid; grid-template-columns:1.2ch 1fr; gap:.8ch; }
.feats li::before { content:">"; color:var(--acc); }
.plan-hi .feats li::before { color:var(--acc-ink); }
.plan-cta { margin-top:auto; }
.btn-ink { background:var(--acc-ink); color:var(--text); }
.btn-ink:hover { background:#1F242B; color:var(--text); }
.plans-rules { margin:28px 0 0; font:400 14px/1.7 var(--mono); color:var(--body); }
.plans-more { margin:10px 0 0; color:var(--body); display:flex; flex-wrap:wrap; gap:4px 12px; }
.link-cmd { font:500 15px/1.5 var(--mono); color:var(--text); }
.link-cmd:hover { color:var(--acc); }

/* perguntas */
.faq { border-top:1px solid var(--border); }
.faq details { border-bottom:1px solid var(--border); }
.faq summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 0; font:600 17px/1.35 var(--sans); color:var(--text); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:">"; font:500 15px var(--mono); color:var(--acc); flex:none; transition:transform .2s; }
.faq details[open] summary::after { transform:rotate(90deg); }
.faq .body { padding:0 0 22px; max-width:68ch; }

/* fechamento */
.close { padding-block:clamp(96px, 12vw, 160px) clamp(72px, 9vw, 120px); display:flex; flex-direction:column; align-items:center; text-align:center; gap:22px; }
.bigsym { width:min(240px, 56vw); display:block; }
.bigsym svg { width:100%; height:auto; display:block; }
.close h2 { font-size:clamp(32px, 4.6vw, 52px); }
.close .lead { text-align:center; }
.lead-form { width:100%; max-width:540px; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:24px; display:flex; flex-direction:column; gap:14px; text-align:left; margin-top:8px; }
.lead-form label { display:flex; flex-direction:column; gap:8px; font:500 11px/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.lead-form input, .lead-form textarea { width:100%; background:var(--bg); border:1px solid var(--border); border-radius:8px; color:var(--text); font:400 15px/1.4 var(--sans); padding:12px 14px; }
.lead-form input::placeholder, .lead-form textarea::placeholder { color:var(--muted); opacity:1; }
.lead-form textarea { min-height:88px; resize:vertical; }
.lead-form .btn { margin-top:4px; }
.lead-done { font:400 14px/1.9 var(--mono); color:var(--body); display:flex; flex-direction:column; gap:4px; }
.lead-done .btn { align-self:flex-start; margin-top:10px; }

/* rodapé */
.foot { border-top:1px solid var(--border); padding-block:48px 36px; }
.foot-cols { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:32px; font:400 14px/2 var(--mono); color:var(--body); }
@media (max-width:760px) { .foot-cols { grid-template-columns:1fr; } }
.foot .logo svg { height:30px; width:calc(30px * 702 / 172); }
.foot .h { font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.foot .about { font:400 14px/1.55 var(--sans); color:var(--body); max-width:32ch; margin:12px 0 0; }
.foot-col div { display:flex; gap:.8ch; }
.foot-bottom { margin-top:40px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 24px; font:400 12px/1.6 var(--mono); color:var(--muted); }

@media (max-width:560px) {
  .offer-box { padding:20px; }
  .offer-box .btn, .lead-done .btn, .card .btn { align-self:stretch; white-space:normal; text-align:center; padding-block:12px; }
}

/* botão flutuante */
.fab { position:fixed; right:20px; bottom:20px; z-index:30; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .cur { animation:none; }
  *, *::after { transition:none !important; }
}